Skip to content

Exploring React Router DOM through practical implementations during my internship at Foothill Technology Solutions. The project covers setup, routing, nested routes, URL parameters, data loading, and error handling.

Notifications You must be signed in to change notification settings

Jamal-SaadEddin/React-Router-Tutorial

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

36 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

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
  1. Navigate to the project directory
cd React-Router-Tutorial
  1. Install dependencies
npm install
  1. 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

Acknowledgements

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

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

About

Exploring React Router DOM through practical implementations during my internship at Foothill Technology Solutions. The project covers setup, routing, nested routes, URL parameters, data loading, and error handling.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published