React Router v6 tutorial in Hindi #11 Protected Route

In this react-router 6 tutorial in Hindi, we learn how to navigate on button click or Navigate programmatically. This video is made by anil Sidhu in Hindi
steps of video
Make Login Page
Make Protected Route
Use Protected Route
Use Local Storage to complete the flow
Insta: code.steps
Complete playlist for react router
• React router v6 tutori...
React js Latest Playlist in Hindi: • React tutorial for beg...
inst id: @code.steps

[@sandiproy9361]

Best protected routing ever! thanks for the video 👏

[@knoladgetv....5408]

thankss❤ iam not coding student pro but job ke liye apki sari vedios dekta hu apki sari vedios gager me sager vali hoti h short time me kitna kuch sikha dete ho app such me sir super seuper all vedios best of luck ase hee agee vedios amazing bnane ke liye❤❤❤

[@sidharthvyas5883]

धन्यवाद अनिल भाई। It hepled me in a critical time.

[@kushmunot8651]

Thanks bhai
i was stuck on this part from last one week but your video saved me
Thank you so much and All the best !!

[@contactpbs2058]

Thank for the video very nicely explain as always you did... Short and great

[@amardeepsinghchauhan5994]

Here's the onclick function to implement the logout functionality =>
function logout() {
localStorage.removeItem("Login");
navigate("/login");
}

[@FaisalAnsari-ch4pl]

9:20 Love that sound um um um😄

[@syedusama7773]

Really need this this video at this time... thanks bro 😊

[@KSHMRGAMING]

Thanks for this video I was stuck at this for so long time...

[@nikhilkumarjamwal5322]

Nice i was about to search for this, how we set sessions on our pages!👍

[@swapnilcodes]

Easy and wonderful video Sir ji...

[@ajayshukla7238]

Many thanks for this quick help on auth routing.

[@NIKITPULEKAR]

Awesome

[@bhavamsingh8092]

Sir please login or signup page system functional component ke through video bna dijiye please

[@whysumancode]

Thank You Brother!
We all love you ❤🫶

[@khanapeena2191]

using Navigate Cmpoenent is best to use here because in your logic whather the user actuall log in or not they will be able to see desired route page for some mile second then the condition is run in the useeffect so gradually usere to able to needed routes without login so its better to use Navigate Componenet we should use usenavigate on button click something like that

[@maxvhanamane840]

It works but when you click protected route multiple times in this example i.e home. you see a glimse/flash of the protected route content. How to fix that?

[@vishalpawarrr]

Upload more video on regular basis 🙏

[@ayushpal790]

BT- 00:00:13 kuch-uch-uch-uch

[@baolong9679]

thank you sir

[@ayanonlinee]

Thank You so much 😅, finally I got it 😢

[@codestepbystep]

Glad I could help!

[@edwardgaming5681]

Bhai ye method me agar koi inspect me jakar state change kr de to??

[@shivcoder3610]

thanks gurudev

[@ravindrap884]

hey thanks for this video, could you please provide the code on git, my home page and login page content are not showing after trying this.

[@CodtachiYoutube]

Best explanation 🤞

[@khizarijaz6712]

just amazing🔥🔥

[@KaushikR-qq7pf]

hi when I call useEffect, I get invalid hook call exception

[@sahilgoyal9422]

improved apporach i guess more correct by setting the dependecy array that cause rerenders to affect useEffect hook to initiate
import React, { useEffect, useState } from 'react';
import { useNavigate } from 'react-router-dom';
function Login() {
const navigate = useNavigate();
const [isLoggedIn, setIsLoggedIn] = useState(false);
const login = () => {
localStorage.setItem('login', true);
setIsLoggedIn(true);
};
useEffect(() => {
let login = localStorage.getItem('login');
if (login) {
navigate('/');
}
}, [isLoggedIn]);
return (

Login

);
}

[@sahilgoyal9422]

Please correct me if i'm wrong or its not any issue

[@CodeWithAnurag]

What if user change the value of 'login' to true from localstorage? In that case also, user can see all the screens without login.

[@alwazkazi1916]

This is just an example in real world apps a token is used to check user auth

[@saim4556]

can you show example how can user change coz i don't see any way user can do this...

[@HassanJawedWani]

Sir if there are 50+ pages on website, it's much overwhelming to add protected to 50 Routes, is not there, any other solution?

[@prashantpriyadarshi5810]

is that protected.js component is a HOC ?

[@GIS-Engineer]

I have project on reactjs and nodejs .
Database is postgresql how to deploy on Tomcat Apache server

[@madhusudankrishnamoorthy3793]

Sir Login is happening but contents are not visible on navigation

[@T_anishka]

Same issue could you help me

[@aashikroy2198]

Write :-
{Protected Component ={ "Home" }}

[@programmingmaze4493]

useEffect me dependency array kyo pass nhi kiya ??

[@vrajthakar5749]

thank you

[@sarimisettyraghav4324]

nice bro jai hind

[@onesrhaime6255]

please can you register your videos in english because we really need it

[@codestepbystep]

soon :)

[@vimalkumarchaudhary1913]

Hindi mai thik hai😂❤

[@abhishekmaurya9503]

Learn Hindi first

[@seeyou7989]

Bro ERROR thy raha h:
Error: A is only ever to be used as the child of element, never rendered directly. Please wrap your in a

[@durvashnimje3206]

[@sjshdhehbesjks]

routes tag ke andar route likhte hai

[@kenwom006]

thanks

[@kashmirtechtv2948]

But what if we don't want to show Navbar on Login?

[@SumitSingh-wz3wt]

Bhaiya components useffect se pahele hi render nhi ho jayga

[@rimi2419]

I have tries the same code but its not working

[@thecodingplace]

This is not working. Getting error "Operation is unsecure".

[@thecodingplace]

Error is solved. It occurs in Edge only

[@bhabanishankarrath6767]

But not working for me can anyone help

[@mrnabby4178]

Thanks bro for saving my ass

[@Anonymous____________A721]

Is it safe?

[@abdullahsoomro6238]

WELL DONE 🟢

[@dg_official96]

How access code

[@adorablebabiesandpets2514]

No protected route in English

[@farheensayyed3604]

ye work hi nhi ho raha sir

[@TejasPhatangare]

YES BRO I THINK IN NEW REACT IT CHANGED

[@mayankverma3684]

insta id ka link bhi add kiya karo description me