How I Created A Meal Suggestion App
Anong gusto mo?
This app is designed to simplify things for you. Just pick your main ingredient and how you want to cook it.
It’s all about keeping it straightforward.
After you’ve made those choices, the app does its thing, streamlining the options and serving up a personalized meal suggestion that suits your taste with an embedded Youtube recipe video too.
Easy decision-making made easy!
Frustration becomes Inspiration
I am a WFH dev and my soon-to-be-wife would always ask me “anong gusto mong lunch?“. (what do you want for lunch?)
Instead of quickly answering the question with the classic adobo or menudo, my early-morning-and-not-yet-optimally-functioning-brain thought of the idea of “what if I just build an app for that!”.
I thought it would only take a few hours but here we are…. 6 months later.
Although this project only took about a handful of coding sessions ranging from 1 to 2 hours, it really did take 6 months from conception to completion as I only worked on this a few times in a month.
Tech Stack
I decided to use technologies I have been also using for work.
This is built with NextJs, Typescript, TailwindCss and Material UI with icons from MUI and React Icons, and then deployed with free hosting on Vercel.
Coding with ChatGPT
I have always wanted to work on a side project but after working in front of a computer screen all day, I just don’t have the energy and motivation to pour more hours typing and staring at a screen.
My goal is to build this project while having fun coding and creating something I can share with everyone.
Here’s where ChatGPT comes to save the day!
ChatGPT handles the data manipulation while I do front-end, feature planning and app design.
Because I am now focusing on planning the features instead of building them, I unexpectedly also gained good chunk of experience on Project Management and App Product Design.
Understanding The Filipino Diet
While compiling a Filipino meal dataset, I realized there’s a lack of clear distinction between lunch and dinner.
In our culture, these meals are interchangeable.Lunch often consists of leftovers, which are also served for dinner with the addition of a new dish to avoid repetition.
The choice between lunch and dinner is influenced by the time available for preparation, with dinners typically requiring more time. However, on weekends, dinner meals may easily become lunch options.
Putting It All Together
As a content consumer, I often encounter unclear information that doesn’t meet my specific needs.
Now that I am on the other side of the content wall, I’ll provide a detailed list of the tools and inspiration used to create this web app.
Tools and inpirations
- Design Inspiration: SaasFrame
- React Framework: NextJs
- UI Framework: Material UI
- Deployment and Free Hosting: Vercel
- Icons: MUI Icons and React Icons
- Font: Lexend Deca inspired from monkeytype
- Card UI Style: Glassmorphism
- Button Style: Gradient Drop Shadow
- Blurry Blob Image: fffuel.co/bbblurry/
- Slider: React Slick
- Social Media Share: React Share
- App Screenshot: Pika Style
- Code Snippet: Carbon
More features?
From the beginning, I realized that this wouldn’t just be a meal suggestion app; it’s meant to be scaled up as a general suggestion app of a wide range of topics.
And guess what’s coming up next?
A Videoke Song Suggestion App!
Maybe we’ll have that ready in another six months!
Want to start investing in foreign stocks?
Use my link to create your account today!
Hey there my friends!
Recent Posts
More from MatipidNaDahon
Shirts for Developers 🌎👕
Shop link: WSKY
Chords for Indie OPM Songs 🎸
Site: chordplay.online
Thank you for this app!