!! Press enter to create stuff in edit screen !!
A web-app for sharing and viewing recipes.
(Sign in to make and edit recipes)
I used Claude for de-bugging, type generation, drag-and-dropping and ReadMe
I built a recipe creator web-app. Ever since I learned HTML and stuff I wanted to make a website like this. I think this is like the 4th iteration… now that I’m more experienced with Next.js and similar technologies.
The most challenging part was getting the drag and drop right.
Im super proud of how there’s no save button, everything autosaves! and client dictates state, so its like super optimistic.
Added browsing recipes and ratings!
Log in to leave a comment
Added cool ingredient thing with scaling and metric and imperial conversion!
You can also see all recipes by an author.
Log in to leave a comment
Added recipe previews, publishing, and groundwork for search!
Log in to leave a comment
Ingredients can now be deleted, steps too. Steps were pretty easy, mostly just copy paste of ingredients
Log in to leave a comment
I fixed the dragging animations by just using framer motion for everything. Added tag functionality, added support for fractions and mixed fractions for imperial units (fractions are only allowed for those).
I had to fight with react dnd to get everything working semi smoothly and I’m happy how it turned out.
TODO: Deleting Ingredients, Everything to do with Steps, Preview, Publishing, Searching, Rating!
Seems doable.
Log in to leave a comment
Added drag and drop features, editing works good now, still a little buggy. kind of a headache!
Log in to leave a comment
Added dnd and qol stuff so its nice and easy to use!
Ingredients arent fully done but like almost and then they also need to be dragged and dropped, then its just like steps and other configs.
Then I gotta do recipe previews, publishing, searching, rating, and maybe banner upload for recipes?
Log in to leave a comment
My main goal with this project is to have a seamless user experience. To do this, Im creating temp_id and then populating it afterwards. so thats kinda neat.
Log in to leave a comment
I liked the dropdown component so much I made it seperated from the account button. Ill use it basically everywhere I can.
You can see the ratings loading for this recipe (there are none so it shows ?/5, and (0) ratings)!
Log in to leave a comment
Finally got hackclub auth and discord. Now it doesnt matter if you dont have an account image, it just makes one. so yeah
Log in to leave a comment
Selected colors, added basic design elements like navbar and button. Also set up database structure. Might be a little too ambitious but its ight.
Its good to be back in web stuff. Rust is much more stressful than this.
Log in to leave a comment
if youre looking for colors, realtimecolors is my top recommendation!