User Role-Based Access Control & Permissions in React JS | MERN Stack

Published: 02 September 2022
on channel: Dave Gray
56,028
889

Web Dev Roadmap for Beginners (Free!): https://bit.ly/DaveGrayWebDevRoadmap

Learn how to apply user role-based access control & permissions in React.js as we continue to build our MERN Stack Project. We will create protected routes and features in our React app that are only available to managers and admins.

💖 Support me on Patreon ➜   / davegray  

⭐ Become a full-stack web dev with Zero To Mastery Courses:
Advanced React & Redux: https://bit.ly/AdvReactDev
The Complete Node.js Developer: https://bit.ly/CompleteNodeJS
Jr to Senior Web Dev Roadmap: https://bit.ly/WebDevRoadmap-JrtoSr

🚩 Subscribe ➜ https://bit.ly/3nGHmNn

📬 Course Updates ➜ https://courses.davegray.codes/

🚀 Discord ➜   / discord  

☕ Buy Me A Coffee ➜ https://www.buymeacoffee.com/davegray

👇 Follow Me On Social Media:
Github: https://github.com/gitdagray
Twitter:   / yesdavidgray  
LinkedIn:   / davidagray  

🔗 All Resources for this MERN Stack Project: https://github.com/gitdagray/mern_sta...

🔗 Playlist for this MERN Stack Project Series: https://bit.ly/3Sn4EaI

User Role-Based Access Control & Permissions in React JS

(00:00) Intro
(00:12) Welcome
(00:25) Starter Code & Dependencies
(01:09) User Stories
(03:18) useAuth hook
(07:02) Footer username & status display
(08:43) Welcome username & links
(11:38) Header icons and navigation
(21:42) NotesList access
(26:09) UsersList logic
(26:43) Why we still need route protection
(29:34) Create a RequireAuth wrapper component
(32:28) Protecting Routes with RequireAuth
(40:35) Note deletion permissions

📚 Suggested Pre-requisites for this MERN course:
🔗 Node.js for Beginners full course:    • Node.js Full Course for Beginners | C...  
🔗 React JS for Beginners full course:    • React JS Full Course for Beginners | ...  
🔗 Redux Toolkit for Beginners full course:    • React Redux Full Course for Beginners...  
🔗 React Login Playlist:    • React Login, Registration, and Authen...  

📚 Tutorial References:
🔗 jwt-decode: https://www.npmjs.com/package/jwt-decode

Was this tutorial on User Role-Based Access Control and Permissions helpful? If so, please share. Let me know your thoughts in the comments.

#user #roles #permissions


Watch video User Role-Based Access Control & Permissions in React JS | MERN Stack online without registration, duration hours minute second in high quality. This video was added by user Dave Gray 02 September 2022, don't forget to share it with your friends and acquaintances, it has been viewed on our site 56,028 once and liked it 889 people.