This is a full-stack web application that uses the MERN stack - MongoDB, Express, React (+ Redux) and Node.js.

I have put together a number of features to create a functional system for the smooth running of a restaurant. The app has multiple features including food delivery system with the option to collect the order in person.

Design

The design is elegant, yet very straightforward. I chose to use a colour palette of warm shades of orange and yellow, that look great with the main photo in the hero section.

Menu

The page that displays the restaurant's menu gently spaces out all the dishes from each other to give the users a very clear view of the entire menu. All the menu sections are clearly visible - the users can quicly find what they're looking for. Red minus and green plus signs are for adjusting the quantity. The amount on the right updates automatically after changing the quantity. A user can browse the menu and add multiple items to the basket. To do that they need to use the yellow button "Add". This action will also update in the top right corner of the page.

Checkout

Then, to complete the order users will have to through the checkout where they will be asked to enter thair card details. They can decide whether to collect their food in person or have it delivered to a given address.

Users need to go through a quick registration process, which will then give them access to their account which holds all the order details along with its status.

Notifications

The app uses Nodemailer for managing email notifications. The admin gets notified by email whenever an order has been placed. The user gets an email confirmation of their order.

The user will also get an email confirming the registration.

Admin dashboard

If you're logged in as an Admin you have access to all the user data. What it means is that you can check users' orders and mark orders as delivered or collected. Once you do that, the order status will change from 'Pending' to 'Delivered' or 'Collected' in user's dashboard.

Admin can also see the list of all registered users,names and delete users.

Menu

Admin can add new dishes to the restaurant's menu, delete dishes or edit them. All dishes are assigned a category, price, description and there's an option to mark the dish as vegetarian.