DEV Community

Jason
Jason

Posted on

Introducing Yokie - A Recipe Sharing Social Media WebApp

I would like to share a small project I've been working on for the past few days. Yokie!

Yokie is a recipe site that I always wanted but was never able to find.
Most cooking recipe sites out there are slow, full of ads, and have a giant story or description before actually seeing the recipe, so Yokie's mission is to:

  1. Provide the ingredients and directions at the top of every recipe
  2. Load adequately fast
  3. Be ad-free

Along with those core competencies, Yokie also provides:

  • A grocery list feature that is shareable and editable with other users
  • A favoriting feature to keep track of recipes you want to remember to cook
  • A profile to showcase your own recipes (or store your private recipes)

I built this app because it's something I wanted to use everyday. I figured others might also not enjoy the current landscape of recipe sites out there, so decided to make it a social media site so anybody can join and start searching and saving their recipes too.

The tech stack

The stack is pretty cool in my opinion, nothing too fancy, most pages are server rendered using Go templates, and most pages have little or no javascript on them!

2 pages are pretty interactive so I added VueJS to those pages, 'why Vue?' you may ask, because I didn't want to setup any bundling or a client side compiling workflow, with Vue I just needed to add a script tag and start using it - easy peezy.

All data is stored in a Firestore database, and all recipes are also stored in Algolia in order to have a nice search page.

Authentication is handled with Firebase Auth because it's free and it just works.

The Go server runs on Google App Engine, and user files are stored in Google Storage.

And that's pretty much it!

Signup!

I'm trying to get people to signup so the database of recipes starts to grow, so I'm offering a twitter style verification checkmark for new users for awhile - so if you want to secure your favorite username and get a nice cool checkmark on your profile - signup!

Cheers!🍻

Discussion (13)

Collapse
devpato profile image
Pato

Congrats on your project! Out of curiosity, why did you decide to use Firestore and Algolia? Great tools tho, I'm asking because they can't get expensive fast.

Collapse
rametta profile image
Jason Author

Mostly because of how fast it is to integrate, since I have experience with both in the past, it was very easy to setup quickly without looking at any documentation.

Regarding the price, I find firestore's free tier to be more than enough for most side projects, same with algolia free tier

Collapse
devpato profile image
Pato

yeah I agree you can get a fullstack web app working in now time!! keep killing it

Collapse
mmmrks profile image
mmmrks

Did you have some alternatives in mind? What would you use?

Collapse
devpato profile image
Pato

firestore is awesome and easy to setup! but i would have probably done it with MongoDB atlas BUT doing the backend setup etc takes time which is def a down side

Collapse
thomasbnt profile image
Thomas Bnt • Edited

Very great website ! πŸŽ‰πŸŽ‰πŸŽ‰
However, I'm French and the mesures is not coherent, only for USA people's, any update on the future for that? β˜•

Oh and you SEO is not showed.

See my post if you want learn more about that :

Collapse
nicolasini profile image
Nico S___

Looks great, I just found a small UI issue in the directions section
directions ui issue

Collapse
rametta profile image
Jason Author

Oh strange, I haven't noticed that. Thanks for letting me know!

Collapse
nicolasini profile image
Nico S___

happens in all the recipes for me, using latest Chrome on mac

Collapse
nicolasini profile image
Nico S___

Would be great to be able to login with Twitter or even DEV :)

Collapse
rametta profile image
Jason Author

Coming soon! πŸ˜‰

Collapse
michaeltharrington profile image
Michael Tharrington (he/him)

This is an excellent idea! Bookmarked. ❀️

Collapse
valeriashpiner profile image
Valeria

Cool! I like Yokie! ❀️