Through our own experiences, we are lovers of food delivery services. As university students, we've all experienced the feeling of being too lazy to cook and love to open up DoorDash and get food delivered in 20 minutes. While we know that ordering and eating fast food is bad for you, there's simply no other viable alternative that is convenient. In order to encourage not only ourselves but others, we created DuoChef.
DuoChef is a meal planner social platform that provides the user with an all-in-one meal planning app. Don’t force yourself to stick with a complicated app demanding dietary perfection, start using DuoChef. DuoChef will help you choose a tasty recipe, plan your meal, teach you how to cook it, and the recipe videos on how to cook if you ever need extra help! Your meal prep has never been so well-planned. DuoChef is also a social network. DuoChef incentivizes students to can compete with their friends to make your favorite dishes, build daily streaks, post photos of their creations for the leaderboards, and challenge other friends!
DuoChef is a web application that is built to provide a streamlined experience for University students to make healthy, easy and fun recipes at home, while also building strong habits, connecting with friends, and sharing what you've made. The UI/UX was designed using Figma to create models and visualizations of the interface. The front-end was built using React, while the backend was developed using Firebase. Furthermore, we used a machine learning algorithm to determine a score for a meal that the user made.
One of the biggest challenges we ran into was the styling of the components. Even though most of us have experience with CSS, it was defintely one of the most difficult tasks since we tried to adhere to our original design in Figma as much as possible. Coming up with an initial design was also a challenge we faced since we often found ourself changing our designs whenever we realized there was a flaw. Another challenge we ran into was git control. We were often struggling with branches, merge conflicts and push issues.
- Creating an accessible design
- Collaborating by working in person with each other
- Being able to learn how to work with React and Figma within an extremely short timeline
- Creating a positive work environment!
- build websites using React, HTML, CSS, Figma, Firebase and Javascript
- How to create a high-quality product in a short time frame through prototyping
- Styling and CSS is very hard!
During the development of DuoChef, we realized that manually inputting each recipe into the database was extremely tedious. We would like to allow all local cooks and chefs access to our database and put their own recipes in for the world to use.
-
cd into local directory that you want to use to store the app then clone git repo
git clone https://github.com/brian-ngyn/Hack-Your-Learning-2022.git -
npm or yarn install for dependencies
npm installoryarn install -
run the app
npm run