chef-ai Tailwind Templates

Chef Ai

OpenAI recipe generator webapp built with ChatGPT API, Next.js, Tailwind CSS.

Chef AI 🧑‍🍳

Webapp that generates recipes based on ingredients and cooking time. Built with OpenAI API, Next.js, and Tailwind CSS.

The app is part of the How to build an AI app workshop by Elena Lape presented at Hack the Burgh 2023 4-5 March 2023.

Prerequisites

Built with

  • Next.js — a React framework for building static and server-rendered apps and websites
  • Tailwind CSS — a utility-first CSS framework (tldr; it lets you write CSS in shortcodes)
  • OpenAI API — an API that lets you use AI to generate text & images

Running locally

  1. Clone the repo
git clone
  1. Install dependencies
npm install
  1. Create an .env file in the root directory and add your OpenAI API key, which you can get from here.
// .env
OPENAI_API_KEY=sk-xxxxxxx
  1. Run the app
npm run dev
  1. Open http://localhost:3000 with your browser to see the result.

Top categories

Loading Svelte Themes