Introduction
React Router provides a convenient way to define protected routes that require authentication in order to access. By defaul...
For further actions, you may consider blocking this person and/or reporting abuse
I feel adding global state management for authentication is an overkill, it will be better/simpler to use context, even local storage will do the job for you if you’re using jwt auth.
Its an option but ,remember leta say in a scenario you are building a complex web application.you will need a state management
but Localstorage a risk for XSS and it's not a good practice
I was recently stuck in the same problem, protecting the routes. I was using Auth0 in my project. And I was facing the problem in this section-
The error was coming from react-router-dom, cause the version 6 doesn't support this format.
So, if anyone is using Reactjs +Auth0 only then try to do like this instead:
Although your article is great, I'm saving it for future.
Nice really appreciate .this is helpful i have also learnt.thanks manh
Awesome share, thanks a lot 👍💯✨
Can you do one without Redux?
yes, sure its possibe very possible
i used redux assuming maybe you will be building maybe a large application.
but you can use without redux and instead use useContext and useReducer
What about building an app with a very simpler way instead of using Redux, works with small to very large scaled projects
yarn add @mongez/router
This will add Mongez Router in your project.
Now in your main/index file clean it up and add the following code
Now implement the
Guarded
middlewareAnd that's it.
Thanks for the article though, it would be helpful for those who are not familiar with Redux.
I will make one .with usecontext
thanks
@ashok_pateliya_a065307ccb Good luck mate
Grate method, ever, I haven't seen a simple method like this, i suggest use it with Context .
Thank you! i was looking for the same thing and found it here, your article helped me a lot!
You are welcome
State is lost when we refresh app, user needs to login again. LS and SS are better options.
Nope. Redux has persist feature
state will be lost when you do a browser page refresh
use redux-persist, then it wont be lost.
Naa , it’s persist .. local storage
As you said redux state is not persistent between refreshes, u need LS or SS to store something to make a route protected.
Now it is. Use redux-persist.
Can you explain from where you have imported ?
<Navigate />
Imported wat ?
updated original comment ?