Next.js Conf 2024: Your app should be Live by Default – Watch Keynote

merearchive

By Eunjae Lee

Food blog about authentic Korean cuisine.

Post page - A title and a subtitle leading to the corresponding post in Korean
Image with a caption
Recipe with the interactive unit switcher
Mobile
Mobile
Interactive recipe - unit switcher and collapsible steps
Subscription via serverless function on Vercel
Ingredients - It's rendered as <span> but later it can become a link to a popup that contains images and more information for those who aren't familiar to Korean ingredients
The recipe is a structured document
Each ingredient as in number and unit makes it easy to convert them to different units.

About the project

Food blog about authentic Korean cuisine.

Minji Jung is a cook/writer specialized in Korean cuisine. She wanted to share her experience and wanted to have a customized platform where she could author contents as she wanted them to be.

The most challenging part was the recipe box at the bottom of each post. When she writes the recipe on Sanity studio, the ingredients are in metrics. However, since those are just numbers with units, they are rendered differently(imperial units) for those in the US.

A recipe consists of multiple steps, and each step is collapsible. It was possible because all the data is not HTML but a structured JSON that can be used by React on the frontend.

It has a subscription box that calls a serverless function hosted on Vercel, and it calls the API to convertkit to register a new subscriber.

Contributor