Currently, the project handles navigation by manually checking window.location.pathname and rendering different components based on the current path. However, this causes full page reloads and makes route handling less efficient.
Proposed Improvement:
Refactor the project to use react-router-dom, a library specifically designed to handle routing in React applications. This will enable smoother, more efficient navigation between different pages without reloading the entire application, improving the user experience.
Tasks:
[x] Install the react-router-dom package
[x] Set up basic routing in the application by refactoring Home.jsx to include React Router.
[x] Update the Nav.jsx to use <Link> components instead of li or a tags to improve navigation without page reloads.
[x] Remove old code that used window.location.pathname to manage routes.
Gothsec
commented
1 week ago
Description:
Currently, the project handles navigation by manually checking
window.location.pathnameand rendering different components based on the current path. However, this causes full page reloads and makes route handling less efficient.Proposed Improvement:
Refactor the project to use
react-router-dom, a library specifically designed to handle routing in React applications. This will enable smoother, more efficient navigation between different pages without reloading the entire application, improving the user experience.Tasks:
react-router-dompackage<Link>components instead oflior a tags to improve navigation without page reloads.Example: