This is a React project developed using Vite as part of 'The Ultimate React Course 2024' by Jonas Schmedtmann.
In this project, I build a web app that keeps track of places visited on the world map and provides a visible list and side notes. With this project, I was able to further my understanding of React, covering topics such as:
- Managing state with
useReducer
. - Using CSS Modules for styling.
- Creating single-page applications (SPA) with React Router.
- Linking between routes with
<Link />
and<NavLink />
. - Implementing nested routes and index routes.
- Dynamic routes with URL parameters.
- Programmatic navigation with
useNavigate
and<Navigate />
. - Creating and providing context with Context API.
- Consuming context with
useContext
. - Combining Context API with
useReducer
for advanced state management. - Performance Optimization and Wasted Renders
- memo, useMemo and useCallback
- Optimizing Bundle Size with Code Splitting/lazyloading
Here's a glimpse of the final project:
To install the project, follow these steps:
- Clone the repository:
git clone https://github.com/xyzeez/worldwise.git
- Navigate to the project directory:
cd worldwise
- Install dependencies:
npm install
- Start the application:
npm run dev