Загрузка...

React Router v6 - Protected Routes, Nested Routes, Active Link, Search Params with Auth Project

Nearly every react application has a react-router to make routes. React Router allows you to make routers in the react application with advanced features. for example, Protected Router, Nested Router, Active Link, Search Parameter, Index Router. Along the way we can also learn react-router hooks like useRouter(), useNavigate() and more.
In this project, we are going to make a mock authentication and add protected routes to understand how react-router is useful to make restricted routes in react. we also going to learn how to use useNavigate() and useLocation() Router hooks.

If you want to learn next.js from the beginning here is the link:

NextAuth Course - Complete Authentication with Credentials, Google & GitHub
https://youtu.be/t0Fs0NO78X8

Complete CRUD Operation With Next.js & MongoDB - For Beginners
https://youtu.be/RKDfKbLJkZQ

Next.js Complete Course For Beginners
https://youtu.be/84CvqVTH9Y8

Tailwind CSS Complete Course
https://youtu.be/lZp4salRFFc

How to Make Blog Website with Next.js & Tailwind CSS - For Beginners
https://youtu.be/1T3GF6endl8

Javascript Complete Course
https://youtu.be/LlMCaEK9PLg

You can Follow Along with me using the below Git Repository.
Use "git branch --list" to see all branches.

📂 Source Project
📦https://github.com/akashyap2013/react_router_authentication_project.git

⏱️ Timestamps ⏱️
00:00:00 - Basic Routes
00:14:46 - Nested Router
00:18:40 - List Invoices
00:33:26 - Filter Invoices
00:40:29 - Index Routes
00:43:41 - Active Links
00:48:12 - Search Parameter
00:59:11 - Persist URL
01:07:28 - Auth Project
01:13:12 - useRoutes()
01:18:21 - Navigation
01:25:59 - createContext()
01:33:38 - useReducer()
01:43:03 - Active NavLinks
01:48:14 - Protected Routes
01:55:19 - Bonus
⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑
👉 Support Me on Patreon 😊:
https://www.patreon.com/dailytuition

🚀 Udemy Courses:
https://www.udemy.com/user/akshay-kashyap-6/

🎅 Playlist :
Complete MERN Series
https://youtube.com/playlist?list=PLynWqC6VC9KMJ7ffdoGM3LjnYlJPK4kiR
⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑

🛠️ Tools I use:
🟠 My Theme: https://www.youtube.com/watch?v=ekHlx6OdSvA
🟠 Font Family: https://fonts.google.com/specimen/Rubik?query=Rubik
⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑

👉 Follow us:
🟠https://www.instagram.com/akki.2013/

More Videos:

💡 Complete Node Course
https://youtu.be/-27HAh8c0YU
▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
💡 React Complete Tutorial
https://youtu.be/jWbzbq2C_RY
▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
💡 Complete Mobile Shopee E-Commerce Website Course - PHP & MySQL
https://youtu.be/KLWA2vCERSQ
▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
💡 Complete Portfolio Website with Bootstrap - HTML/CSS
https://youtu.be/dgKSqz3it50
▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
💡 Create a Shopping Cart Using PHP and Mysql
https://youtu.be/IO5ezsURqyg
▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
💡 Advanced Tic Tac Toe With HTML, CSS & JavaScript - For Beginners [2022]
https://youtu.be/kRQEkTHIEyU
▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
💡 Complete CRUD Operation with PHP MySql Database
https://youtu.be/JZdMXUIMdQw
▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
💡 Birthday Remainder Application with React - For Beginners
https://youtu.be/o2IZaojOz-o
▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁▁
💡 Bootstrap Grid System The Complete Guide - In Action
https://youtu.be/hrKMGFkTKF8
Like this video If you find anything useful. Share with your friends that is all for now I will see you In the next one.

Thank You...! 🙏

⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑⋐⋑

Tags: #react #authentication #project

Видео React Router v6 - Protected Routes, Nested Routes, Active Link, Search Params with Auth Project канала Daily Tuition
Страницу в закладки Мои закладки
Все заметки Новая заметка Страницу в заметки

На информационно-развлекательном портале SALDA.WS применяются cookie-файлы. Нажимая кнопку Принять, вы подтверждаете свое согласие на их использование.

Об использовании CookiesПринять