Deployment instructions for this website:
-
dashbord-client-side: https://tier5-dashboard.web.app/ (firebase) screenshots:
-
dashboard-server-side: https://frozen-thicket-45554.herokuapp.com/ (Heroku) screenshots:
-
Site link: https://tier5-dashboard.web.app/ dashboard admin details: email: admin@admin.com password: admin0
Functionality about this website:
-
Here I have designed full website for desktop, tablet and for mobile screen also. Basically this site is fully responsive screenshot:
-
Here, I have created a dashboard system for managing users. screenshot:
-
Here, In dashboard, I have implemented pagination system. Here every page, user info loads with multiple rows. By selecting row number from dropdown menu Admin can see multiple rows of user. screenshot:
-
Sorting system has been implemented in dashboard system with multiple parameters. Admin can see rows of user by name sorting, gender sorting, age sorting. Also Admin can see rows by ascending and descending order also. screenshot:
*** Has been implemented unique username checking functionality for brand new user registration, for 'add another user' via admin, for updating the already added users
information. I handled every possible situation of checking unique username.
screenshot: 
screenshot: 
-
I have created 30 dummy users and stored in mongo database. screenshot:
-
I have implemented add, remove, update of user information for the dashboard.
-
At first, I have created a authentication system where user can register themselves by providing some information. screenshot:
-
User provides his name, username, age, gender email id, password, confirm password, country, device as his information. Here all the information stores in MongoDB except password. screenshot:
-
Any user can signin in the website by providing just email id and password. Here the authentication functionality(login) is implemented by firebase. screenshot:
screenshot: 
-
So when a user provides his information for registration, just email id and password stored in firebase and as well as registration process completes with the help of firebase. And rest of other user information stores in mongoDB.
-
After registration or signin, an authenticated user redirects to the homepage. screenshot:
-
The user can browse only between homepage and profile page. screenshot:
-
The user can not go to the dashboard page. Because Dashboard should not be used by normal users. So providing admin route functionality I give restriction to normal authenticated users to go to dashboard. screenshot:
-
Only an admin user can navigate all 3 pages including dashboard from navbar. screenshot:
-
In Dashboard page, I have created 3 pages. An admin user can go all 3 pages. Here 3 pages are Add another user, Add another admin user, and main dashboard page. screenshot:
-
Firstly, I have created an authenticated admin user by providing role property in his information at mongoDb. screenshot:
-
An admin user can give another user to admin role by going to 'add admin user' page. screenshot:
-
But when giving another user to admin role, Firebase will first check whether he is admin or not. It is implemented by Firebase JWT token. screenshot:
screenshot: 
-
An admin user can add another user by providing information which is the same when a normal user register himself. screenshot:
-
Here, also all the information stores in mongodb except password. Only email id and password stores in firebase by firebase authentication functionality. screenshot:
-
So by 2 ways, users information is stored on mongodb and firebase. One is via normal registration process and another is via dashboard add another user process.
-
By "add another user" process when a user is registered on mongodb and firebase, that user also can signin to the website by firebase authentication.
-
When any user login to the website, the user can not go to the login page again. It is done by authentication route. screenshot:
-
Users list in firebase authentication screenshot:
-
Users list in MongoDb screenshot:
-
Here I could not implement DAU/WAU/MAU functionality for real time dashboard. I tried a lot by searching many websites and thinking by myself. I will definitely learn this functionality and will implement this of my another project.