aneesharama/mern-restaurant-app

This is Full stack Restaurant🛎️ app project(currently for desktop) built using NextJS, NodeJS, ExpressJS,MongoDB and TailwindCSS. Please check my project here👇️

MERN stack Restaurant App

Project link: https://swirly-food-delivery-app.vercel.app/

This is Full stack Restaurant app using NextJS(a production ready framework for ReactJS), NodeJS, ExpressJS, MongoDB and TailwindCSS. I have created my own server using NodeJS and ExpressJS and MongoDB(noSQL database) as databse to store the information.

Tools used to build this project

• NextJS (a production ready framework for ReactJS)
• NodeJS
• ExpressJS
• MongoDB Atlas
• TailwindCSS
• Material UI
• Cloudinary (to host images)

Project Features

General features

• Register/login functionalites using JWT token.
• User information is stored in the MongoDB database.
• Navigating different pages using File based Routing system provided by NextJS
• Admin Dashboard to perform CRUD functionalities of Food item.
• All the Images and Food details are dynamically generated by Admin and fetched from the database.
• Filtering food based on categories.
• Add/Remove food from cart.
• User and Cart state management using Redux Toolkit
• Order details is stored in the databse

Customer perspective

• Beautiful and Modern UI using modern tools like TailwindCSS and MaterialUI
• Customer can navigate to multiple pages.(Authentication is not required)
• Customer have an option to choose food from food categories
• Customer can Register new account and can Sign in to the application.
• Customer can Add and Remove food from cart.(Authentication is not required).
• Customer can order food only if he/she is signed in to the application.

Admin perspective

• Admin account has the access to Admin Dashboard(protected route from customers)
• Admin can add new food item with image. The newly added food details is stored in the database with image url, whereas the actual image is hosted in the cloudinary using Cloudinary API
• Admin can update and delete specific food.
• Admin has the access to view all user's name and email(password is hashed using bcrypt) and delete user account.

Upcoming features

• Handling Payment using stripe
• Advanced cart functionalities.
• Real time food tracking using socket.io

mern-restaurant-app's Issues

Better to use isAuth boolean than checking the presence of user

Took a glance at you code and I found that to validate the user authentication you have checked it with the presence of user data from the authSlice. Instead what we can do is we add isLogin boolean in the authSlice and set it in the state when logged in and only check isLogged in status instead of checking userdetail

Constantly need to login in every refresh

The main purpose of the localstorage is to set the token and userdetail for the extended period of time. It shouldn't be used to store data until the page reloads somehow. I don't see the usecase for the localstorage here.

If you want this behavior i.e to relogin in every reload then you could directly store the token and details in the redux and access its value in the admin.

No use of localstorage here