I want to share the recipe website I made:
https://epicure-recipes.netlify.app/recipes
Recently, the company Epicure went bankrupt. They primarily sold seasonings and meal kit packets and supplies, but their website was also host to 3,300+ recipes. When the company shut down their website, those recipes were lost... sort of. Using the Wayback Machine, I scraped all those recipes and built a static site from the data. The source code for that site can be found here:
https://github.com/peiche/epicure-recipes
I initially built the site using a static site technology called Gatsby, not realizing that it was actually a dead project. After a little research, I found that Next.js is a pretty popular alternative for building a static site, so I set myself to the task of porting it.
Not only is the port complete, but I've added a lot to the site since then. I've added images to recipe pages, tags (think like blog post tags), and lists of products used in each recipe. I also added dark mode because I love it and prefer it.
The most recent addition is a faceted search powered by Algolia. I already use it on the family website, but since that's running WordPress, I really haven't ever had to build a search index from the ground up, using all-new data. Well, now I have.
I built the UI with MUI. I'm a big fan of Google's Material Design, and this port of it is top notch. It's my go-to whenever I build a React app.
Usually Next.js sites are hosted on Vercel, but I am well experienced with hosting static sites on Netlify, so that's where this one is hosted. I have a local script that rebuilds the site if/when I make some improvements to the extracted data, which gets checked into the GitHub repo. From there, Netlify automatically deploys the updated site.
Top comments (0)