YoVDO

React Router Crash Course

Offered By: freeCodeCamp

Tags

React Router Courses Web Development Courses React Courses

Course Description

Overview

Dive into a comprehensive crash course on React Router, learning how to create and manage routes in React applications. Master essential concepts including BrowserRouter, Switch, nesting routes, redirecting routes, and utilizing match and history props. Explore powerful hooks like useHistory, useParams, useLocation, and useRouteMatch. Begin with initializing a new React app and creating a header component before delving into React Router installation and implementation. Progress through topics such as creating and testing routes, understanding the 'exact' prop, using the Switch tag, and implementing the Link tag for navigation. Discover advanced features like the basename prop, forceRefresh prop, and getUserConfirmation. Learn to handle 404 Not Found pages, access URL parameters, and implement nested routing. By the end of this tutorial, gain the skills to efficiently manage routing in your React applications, enhancing user navigation and overall app structure.

Syllabus

Intro.
Initialize new React App.
Header Component.
React Router Installation.
BrowserRouter.
Creating Routes.
Testing Routes.
'exact' prop.
Switch Tag.
Link Tag.
basename prop.
forceRefresh Prop.
getUserConfirmation.
scroll to top on route change.
404 Not Found Page.
Access URL Params.
useParams Hook.
useLocation Hook.
Redirecting in React Router.
useHistory Hook.
Nested Routing.
Outro.


Taught by

freeCodeCamp.org

Related Courses

Learn React Router
Codecademy
React Router and Redux
Microsoft via edX
Full React Course 2020 - Learn Fundamentals, Hooks, Context API, React Router, Custom Hooks
freeCodeCamp
Front-End Web Development with React
The Hong Kong University of Science and Technology via Coursera
Introduction to Front-end Development with ReactJS
Coursera Project Network via Coursera