DEV Community

Cover image for Role based User System (easiest explanation) (Pure JavaScript) by SilvenLEAF
SilvenLEAF
SilvenLEAF

Posted on • Updated on

Role based User System (easiest explanation) (Pure JavaScript) by SilvenLEAF

Using role-based auth is way easier than you can imagine.

SIMPLEST WAY TO USE ROLE BASED USER SYSTEM

const myUserData = {
  role: `admin`,
  //...other user data
}
Enter fullscreen mode Exit fullscreen mode

When we save our user data, we'll give a key of role and this role can have whatever role you want to have, like admin, mod, user...etc.

And to use the role based system, we can simply do a simple if check, like if the user has a role of admin, he can do this or if he is just a user, he can't do this.

COMPLETE GUIDE FOR USING ROLE BASED USER SYSTEM

Suppose we are saving our user data on a JavaScript Object. (You can use any database, MongoDB, SQL whatever you like. The concept is same. I'm just using a normal JavaScript Object to ensure that everyone reading this are on same page)

NOTE: To learn how to create a Login Signup System very easily (with Passport, NodeJS a.k.a JavaScript, MongoDB), see my Next series on 12th Nov 2020. I'll also have a complete tutorial of Role based user system with NodeJS and MongoDB in that series with a demo project.

STEP 1 (CREATING)

const myUserData = {
   email: `luffy@gmail.com`,
   password: `fdas1!@#$$%#efd09879dsgfgfd`,

   name: `Monkey D Luffy`,
   profession: `Pirate`,

  role: `user`,
}
Enter fullscreen mode Exit fullscreen mode

Here we have this user who's role is user.

STEP 2 (USING)

Now suppose X is something that only admin can do, now to make a role based system, we can simply do this....

if(myUserData.role === `admin`){
  //do X that only admin can do
} else {
  //give back a message, something like "You are NOT allowed to do this"
}
Enter fullscreen mode Exit fullscreen mode

And suppose Y is something that only admin or mod can do, then...

if(myUserData.role === `admin` || myUserData.role === `mod`){
  //do Y that only admin and mod can do
} else{
  //give back a message, something like "You are NOT allowed to do this"
}
Enter fullscreen mode Exit fullscreen mode

And suppose you have a demo login system, (that I love to use on my apps), and you do not want people delete this DEMO LOGIN account, (because if they do, you have to re-create it again and again). You can do this...

if(myUserData.role !== `demo`){
  //delete their account
} else{
  //give back a message, something like "You can NOT this DEMO account"
}
Enter fullscreen mode Exit fullscreen mode

Hope this helps you create your own role based auth system. The simplest way to create this system is, create a key role and make user its default value. Then change it to mod or admin or whatever on whenever or however you like.

If you have any questions or If you are stuck

Feel free to reach out to me. You can also contact me on LinkedIN https://www.linkedin.com/in/silvenleaf/ or on Twitter (as @silvenleaf ).

If you wanna know more about me, this is my portfolio website SilvenLEAF.github.io

I'd LOVE to be your friend, feel FREE to reach out to me!!

NEXT BLOG is coming on 10th Nov, 2020

on Change CSS variables with JavaScript

Next Blogs DATE

  • Nov 10th 2020, Change CSS variables with JavaScript

  • Nov 12th, 14th, 16th 2020, Create login signup system with Passport (Series)

  • Nov 18th 2020, How to create Login with Google

  • Nov 20th 2020, How to create Login with Github

  • Nov 22th 2020, How to create Login with LinkedIn

  • Nov 24th 2020, How to create Login with Twitter

  • Nov 26th, 28th, 30th 2020, Password Reset Series (with Node.js and React)

If this blog was helpful to you,

PLEASE give a LIKE and share,

It'd mean a lot to me. Thanks

Prev Blog


Async Await (easiest explanation)

Top comments (0)