1.2.3 • Published 2 years ago

spa-routing v1.2.3

Weekly downloads
-
License
MIT
Repository
github
Last release
2 years ago

Contributors Forks Stargazers Issues MIT License

About The Project

SPA Routing Screen Shot

Turn your web app into a Single Page App quickly and easily without tons of refactoring or tight coupling.

Prerequisites

For initial navigation to your routes (i.e. visiting example.com/route directly) to work, you'll need to configure your server to direct all traffic to your app.

Example (express.js)

app.get(/.*/, (req, res) => {
  res.sendFile(`${__dirname}/index.html`);
});

Installation

CDN

<script
  src="https://cdn.jsdelivr.net/npm/spa-routing@latest"
  type="module"
></script>

Usage

  1. (OPTIONAL) Set the root of your app, if it's not the same as the origin.

    <script type="module">
      import { setRoot } from "https://cdn.jsdelivr.net/npm/spa-routing@latest";
      setRoot("/example/root");
    </script>
  2. Wrap route content in the <spa-route> tag, with an appropriate path attribute value.

    <spa-route path="/home">
      <h1>Home</h1>
      ...
    </spa-route>
  3. Add links to those route(s).

    <a href="/home">Home</a>
  4. Style <spa-route> elements in active/inactive states using the active attribute.

    spa-route:not([active]) {
      display: none;
    }

Contributing

Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated.

If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement". Don't forget to give the project a star! Thanks again!

  1. Fork the Project
  2. Create your Feature Branch (git checkout -b feature/AmazingFeature)
  3. Commit your Changes (git commit -m 'Add some AmazingFeature')
  4. Push to the Branch (git push origin feature/AmazingFeature)
  5. Open a Pull Request

License

Distributed under the MIT License. See LICENSE for more information.

1.2.3

2 years ago

1.2.2

2 years ago

1.2.1

2 years ago

1.2.0

2 years ago

1.1.2

2 years ago

1.1.1

2 years ago

1.1.0

2 years ago

2.1.0

2 years ago

2.0.0

2 years ago

1.0.1

2 years ago

1.0.0

2 years ago