Skip to content

A minimal routing solution for routing in react which saves the state across route changes and prevents hard refreshes

Notifications You must be signed in to change notification settings

Ilikepizza2/react-savestate

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

5 Commits
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

REACT-SAVESTATE

Description: react-savestate is a lightweight npm package designed as a router for React applications which preserves states between route changes. It provides alternative routing functionalities and components to streamline navigation within React-based web applications.

Installation: You can install react-savestate via npm by running the following command:

 npm install react-savestate

Usage:

// import the functions
import { Route, getState, Link } from 'react-savestate';
// Define routes using the Route component
<Route path='/' component={LandingPage} />
<Route path='/Contact' component={Contact} />
// Use the Link component for navigation without page refresh
<Link href='/' state={{ data: "from HomePage", data2: "something else" }}>Go to contact</Link>
// Retrieve saved state using getState function
console.log(getState());

Components:

  • Route: An alternative route element for routing between pages in a React application. No need to wrap them in any parent wrapper.
  • Link: A replacement for <a> tag which facilitates navigation without triggering a page refresh. It also supports passing a state object to preserve data across routes without using URL parameters.
  • getState: Function to retrieve the saved state, if any, within the application.

Note:

  • Ensure that the state passed to Link is serializable to avoid any issues with preservation and retrieval.
  • Utilize Route and Link components as replacements for traditional routing and navigation elements within your React application for improved performance and user experience.

Contributing: Contributions to react-savestate are welcome! Feel free to submit issues or pull requests on the GitHub repository: react-savestate GitHub Repository

License: This project is licensed under the MIT License - see the LICENSE file for details.

About

A minimal routing solution for routing in react which saves the state across route changes and prevents hard refreshes

Topics

Resources

Stars

Watchers

Forks