React Router (v6) - The Complete Guide

Focused View

CodeLicks Academy

3:33:35

103 View

1. Introduction

1. Introduction.mp4

02:06

2. Requirements.mp4

01:04

3. React Project Setup.mp4

02:43

4. Server Demo Walk-through.mp4

02:44

2. Basic concepts

1. Using Browser Router Element.mp4

04:23

2. Declaring Paths.mp4

04:35

3. Styling Paths.mp4

13:32

4. 404 Not Found Routes.mp4

04:09

5. Redirecting 404 Routes.mp4

03:12

3. Navigation and Links

1. Navigation.mp4

07:09

2. Handling states of active NavLink.mp4

02:55

4. Advanced Routing

1. Nested Routes with Outlet.mp4

05:57

2. Fetching Data via Nested Routes.mp4

06:48

3. Relative and Absolute Navigation.mp4

13:16

4. Dynamic Routes.mp4

03:56

5. Accessing Route Params.mp4

03:01

6. Fetching Data with Route Params.mp4

08:52

7. Implementing Programmatic Navigation.mp4

03:22

8. Passing State along Navigation.mp4

05:32

9. Navigation Deltas Concepts.mp4

03:34

10. Domain-Driven Routes.mp4

04:35

11. Restricting Access to Routes.mp4

09:25

5. Routing techniques for CRUD operations

1. a Second Approach of Relative Paths.mp4

04:28

2. Using Link with Nested Routes.mp4

07:25

3. Creating a New Book.mp4

15:48

4. Redirecting after Creating Books.mp4

07:02

5. Reading an Existing Book.mp4

06:56

6. Updating a Book.mp4

02:55

7. Deleting a Book.mp4

07:04

8. Using Search Params.mp4

06:32

9. Linking UI state with Search Params States.mp4

14:04

10. Rendering UI with Search Params.mp4

09:45

11. Adding Page Scrolling upon Route Changes.mp4

04:32

12. Object-based Route Setup.mp4

08:38

6. Next steps

1. Recap and Next Steps.mp4

01:36

Description

Master React Router API with practical best practices. Learn component-based routing, authentication scenarios, and more

What You'll Learn?

Understanding the basic concepts of React Router
Master Nested Routes in React Router by learning how to define child routes and use components for your nested routes
Develop Protected Routes by learning how to protect some routes with authentication patterns
Fetch data from Rest-API endpoints by using React Router API features
Learn best practices in navigation between different paths of your application with relative and absolute navigation techniques
Build dynamic routes and implement navigation based on data coming from backend server
Learn how to pass parameters and use them in your components using URL Parameters in React Router
Learn advanced concepts and practices such as navigation deltas, passing state with navigation and domain-driven routing

Who is this for?

React developers looking to learn or level up their current knowledge in React Router API

Front-end Developers

Developers looking to learn React

What You Need to Know?

Basic knowledge in ReactJS

More details

Description
Welcome to the only Udemy course teaching React Router from zero to mastery!
In this course I teach you everything you need to know about React Router v6 as a react developer by building a real-life project from the ground up. With this course you will master all the complex React routing concepts with concrete real-life examples as we move on a full-stack building an online book shop single page application.
I will walk you beyond the information that you can find in the documentations and blogs and teach you industrial best practices with real-world scenarios that do make sense for you and level up your skills as a React developer for real.
You will learn how to implement different types of component-based routing into your application along with other scenarios such as protected routes and authentication.
Most of the resources out there, only mention React router as a side-tool in their courses but in this course all the materials are meant to teach you the React router API with all the best practices and some of the hidden tips that I learned the hard way in my career life as a React developer, to prepare you for developing your React projects as an expert.
First we explore the basic concepts such as declaring a path, adding some styles based on the active path and how to deal with 404 routes.
Then we move on to learning navigation and using elements such Link and Navlink in React Router v6.
After that we touch on advanced topics in React routing including nested routing, dynamic routing, fetching data based on URL parameters and more.
Finally, we implement a complete set of CRUD operations against a backend server to experiment all the React routing features related to CRUD operations and see a lot of routing best practices for enhancing our data fetching and CRUD operations.
So, hopefully I will see you in the course to start leveling up your React Routing Skills.
Who this course is for:
React developers looking to learn or level up their current knowledge in React Router API
Front-end Developers
Developers looking to learn React

User Reviews

Rating

average 0

Total votes0

Focused display

React

CodeLicks Academy

Instructor's Courses

Welcome to CodeLicks Academy! We are a team of software engineers with a passion for sharing knowledge and helping others understand complex concepts. We have extensive experience in the industry, having worked on a variety of projects ranging from small startups to large systems. We also have a deep understanding of software engineering and data engineering concepts, and love to apply these principles to real-world problems.In addition to technical skills, we have a strong background in teaching and have always had a love for sharing knowledge. Our team members have taught in both formal and informal settings, and have a knack for breaking down complex ideas into simple, easy-to-understand concepts. We believe that anyone can learn how to code and talk to computers at fast pace, so we are dedicated to helping people achieve their goals by providing short but informative video courses on variety of topics as code licks! Whether you're a beginner looking to get started in software/data engineering, or an experienced professional looking to enhance your skills, we are here to help you reach your goals. With our combination of technical skills and teaching experience, we are confident that we can help you take your skills to the next level.

Udemy

View courses Udemy

Students take courses primarily to improve job-related skills.Some courses generate credit toward technical certification. Udemy has made a special effort to attract corporate trainers seeking to create coursework for employees of their company.