React Router DOM Learning Project

This project was completed as part of my front-end internship at Foothill Technology Solutions. The main goal was to learn and apply the concepts of React Router DOM by following a detailed tutorial.

Tutorial

The tutorial followed is from the official React Router documentation. You can view the tutorial here.

Objectives

The project covers the following objectives:

1. Understanding What React Router Is.
2. Recognizing When to Use React Router.
3. Getting Started and Installation: Learn how to install React Router.
4. Components of React Router.
5. Learn How to Create Routes.
6. URL Parameters.
7. Programmatic Navigation.
8. Understanding React Router Hooks.
9. 404 Page Handling.
10. Testing with React Router.

Each title in the table of contents in that tutorial has been implemented as a single commit in this repository to ensure a clear and structured learning path.

Demo

You can view a live demo of the project here.

Features

• Basic routing setup
• Nested routes
• URL parameters
• Programmatic navigation
• Custom 404 page
• Integration of React Router hooks

How to Clone and Run Locally

To clone and run this project locally, follow these steps:

1. Clone the repository

git clone https://github.com/Jamal-SaadEddin/React-Router-Tutorial.git

2. Navigate to the project directory

cd React-Router-Tutorial

3. Install dependencies

npm install

4. Run the project

npm run dev

This will start the development server and you can view the project in your browser at http://localhost:5173/.

Authors

• @Jamal-SaadEddin

Acknowledgements

• This task is part of the Foothill Technology Solutions Internship Cycle.
• Big thanks to my trainer @Huthaifa

---

Thank you for visiting my project! Feel free to star or contribute to the repository if you find it useful.