This was a fun one. I’d been working on a large scale website rebuild, sunsetting a legacy .NET website and replacing it with a fresh Next.JS site, so based on what I learned doing that I created this. This recipe site uses the Next.JS app router, with a Sanity headless CMS backend, all using TypeScript.

Things to improve

• Site search just uses Sanity, searching on one field, but it could use something like Elastic to search multiple things (tags, recipe name, ingredients etc.) and would be much faster and provide better quality results
• Caching has not been implemented. While this is fine for a demo site such as this, it’s recommended for larger scale sites to reduce the load on Sanity, as much of the data will not really change after it’s been published, so it does not need to query Sanity for every request
• Addition of SEO metadata
• Dark mode – the site is very bright so dark mode or theming would be quite nice here

GitHub https://github.com/omar-ebrahim/ReactRecipes

Issues (tasks) page https://github.com/omar-ebrahim/ReactRecipes/issues

Site hosted on Vercel https://react-recipes-sooty.vercel.app/