0% completed

All LessonsFree Lessons (7)

Introduction

Why Take This Course?

Course Overview

What is Routing?

Client-Side Routing vs Server-Side Routing

Introduction to React Router

Quiz: Introduction to Routing

Getting Started

Creating a React App and Installing react-router Configure the App to Use react-router Create the Necessary Components of the React App Quiz: Installing and Configuring React Router

Routing

Routing in React Js Implementing Routes in a React Application Challenge: Create a New Route The Use of useRoutes Hook Quiz: Creating Routes in a React Application Using React Router

Navigation

Navigation in ReactJS Implementing Routing With the Link Element Implementing Routing With the NavLink Element Quiz: Navigation with react-router

Advanced Routing

Nested Routes and Outlet Component Reading URL Params by Using useParams "No Match" Route and Passing Props to Component Index Routes & Layout Routes Quiz: Implementing Advanced Routing in a React Application

Advanced Navigation/Links

Query Strings The Use of useLocation and useSearchParams Navigate Programmatically Passing Props to a Link Quiz: Implementing Advanced Navigation in a React Application

Project: Authentication App

Project Setup and Initialization Add Routes and Links Add Index and Layout Routes Add Login Functionalities Using Context API Use the Context Data in Components Private Routes and Restricted Routes Quiz: Authentication App

Bonus React Topics: Page Transitions and Code Splitting

Animated Page Transitions Code Splitting in React JS Quiz: React Bonus Topics

What’s Next?

Wrap Up!Project Ideas for Practice

Course Assessment

React Router Fundamentals

Project

Create a Website with Dynamic Routing Using React Router

Getting Started with React Router v6/

...

/

Quiz: Introduction to Routing

Quiz: Introduction to Routing

Answer some questions about routing and react-router.

We'll cover the following...

Routing Quiz

1.

(Fill in the blank.) The initial loading of web apps is slow in ___________.

A.

server-side routing

B.

client-side routing

1 / 6