Cloning of DineOut with ReactJS
Hello there, you might be visiting restaurants frequently and sometimes you have over-obsessed with pre-empting and fulfilling the wants of today’s diner. It simply meant allowing diners to reserve a guaranteed table at the top restaurants in the city which has multiple benefits on one platform for all dining out needs. We team Hexagon at Masai School developed a clone of the similar website of DineOut in just 3 days as a part of our curriculum. This blog is all about our journey and the challenges we faced while building the Web Application.
Features & Technologies
- Frontend Structure: HTML, CSS, React
- Data Handling: Redux, MongoDB Atlas Server
- Design: Material-UI
Major Challenges
Firstly for data handling, we have tried to scrape the data through ParseHub we got the total data but while making the queries for filtering and sorting on the backend that made to write very complex queries. Over here we got the total data in one table which caused us a problem while filtering the data. So, we are forced to change the total database structure to Small tables like all the data related to Cuisines, offers and so on.. in separate tables and linking these to the restaurant table which made us fetching the data easier this is possible only with support from mentor (Dhaval Chheda). This sorted our issue in solving the problem.
User Flow
We tried to replicate the user flow for booking a table at a particular restaurant and also filtering based on his interest like offers, cuisines, location, and few other things.
I’m attaching some of the screenshots below. To experience our product feel free to explore our Git Repo.
Wrapping up
It’s not just about coding. It’s all about team collaboration, problem-solving, remote working. The more you do it, The better you become. I have always believed in learning by building and I will encourage you to do the same. Explore our CodeBase to experience some of the functionalities. I felt proud to work with such amazing people and special thanks to our mentor Dhaval Chedda. This project could not have been made possible without the contribution of Gopi Chandana.
