Submitted 3 months ago

📜Full Stack Recipes Web App | Prisma | Tailwind | NextJS | Vitest📜

Sam•970

@JustANipple

Preview site View code

This is a solution for...Recipe page

HTML
CSS

1newbie

Design comparison

SolutionDesign

Solution retrospective

What are you most proud of, and what would you do differently next time?

Protein based macros adaption: In the details of a recipe, you can insert your personal macros and that recipe will be adapted to reach your protein level

What challenges did you encounter, and how did you overcome them?

Database: i made use of Supabase and Prisma to host and create a consistent relational database for my recipes. I also used Vitest to test my queries.
Backend: i had a decent grasp of React, so i wanted to give my project a structure with NextJS and Vercel to host it.
Frontend: i used Tailwind to style my project. Very easy to get into and with the help of a very good design from FrontendMentor i was able to get started.

What specific areas of your project would you like help with?

Authentication: this would let me choose which users can access the site. Also i could give different permissions to users to let them edit their own recipes, while others can only see them.
API: ingredients are a bit complex to create and not as user friendly as it should be. Making use of an API would help a lot creating recipes without caring much about macros
Error handling: i'm not sure how to handle errors in my app. It's not clear what part of the app is responsible for throwing errors.

Community feedback

Please log in to post a comment

Join our Discord community

Join thousands of Frontend Mentor community members taking the challenges, sharing resources, helping each other, and chatting about all things front-end!

Join our Discord