< Interactive menu / >

Roma Roma Pizzeria

Back to Explore Projects
//
npm run case_study

Building a ReactJS interactive menu working with a back-end API.

Roma Roma Pizzeria is a local pizzeria in Wattrelos, France. They wanted to create an interactive menu for their customers to see their pizzas. I was asked to create a ReactJS application that would work with a back-end API to display the menu and allow employees to edit the menu from a back-office.

For the front-end part, I created a React project with Vite and I uesed TailwindCSS framework for the style, this helped me to improve the fast developement of this project. I also used Axios library to fetch data from the back-end API and to manage the state of the application. I used React Router to create the routes of the application and React Auth Kit to authenticate the user in the back-office...

For the back-end part, I created a NodeJS project with Express and I used MySQL as database. I also used JWT to authenticate the user in the back-office. I used Bcrypt to hash the password of the user and I used Dotenv to manage the environment variables of the application. I used Cors to manage the CORS policy of the application. I used Nodemon to restart the server when I made changes in the code...

Visual aid for the case study.
Main back-office page (in french)

As we can see on the above screenshot, I created a back-office for the pizzeria's managers and employees. They can effortlessly add, edit, and delete any pizza. That allows managers to edit the menu at everytime in few seconds. That was important to create this back-office to prevent any code editing.