🍽️ Food Cooking Recipe Maker 🍲

Welcome to the Food Cooking Recipe Maker! This application is your ultimate companion for discovering and creating delicious recipes. With a wide variety of recipes and detailed instructions, cooking has never been this fun and easy! 😋

🚀 Key Features

  • 🌟 User-Friendly Interface: An intuitive and beautiful UI built with Tailwind CSS to ensure a seamless user experience.
  • 🔍 Recipe Search: Easily search for recipes based on ingredients, cuisine, dietary preferences, and more using the Spoonacular API.
  • 📝 CRUD Operations: Create, Read, Update, and Delete your favorite recipes with ease.
  • 🤖 AI Recipe Suggestions: Get personalized recipe suggestions using AI-powered recommendations.
  • 📱 Responsive Design: Fully responsive design to ensure the app looks great on all devices.
  • 🧑‍🍳 Detailed Instructions: Step-by-step cooking instructions with ingredient lists, cooking times, and nutritional information.

🛠️ Tech Stack

  • Next.js: A powerful React framework for building server-side rendered and statically generated web applications.
  • TypeScript: Ensuring type safety and improved developer experience.
  • Tailwind CSS: For crafting beautiful and responsive UI components with ease.
  • Spoonacular API: A comprehensive food and recipe API providing a vast database of recipes and cooking information.
  • OpenAI API: For generating AI-powered recipe suggestions.

📋 Project Structure

The project is structured to promote clarity and ease of navigation:

/components   - Reusable UI components
/pages        - Next.js pages for routing
/styles       - Tailwind CSS configurations and custom styles
/utils        - Utility functions and API handling
/public       - Static assets like images and icons

🔧 Installation and Setup

To get started with the Food Cooking Recipe Maker, follow these steps:

  1. Clone the repository:
    git clone https://github.com/yourusername/food-cooking-recipe-maker.git
  2. Navigate to the project directory:
    cd food-cooking-recipe-maker
  3. Install dependencies:
    npm install
  4. Set up environment variables: Create a .env.local file in the root directory and add your API keys:
    NEXT_PUBLIC_SPOONACULAR_API_KEY=your_spoonacular_api_key
    NEXT_PUBLIC_OPENAI_API_KEY=your_openai_api_key
  5. Run the development server:
    npm run dev

🚀 Deployment

Deploy the application using your preferred deployment service. Here's how to deploy on Vercel:

  1. Install Vercel CLI:
    npm install -g vercel
  2. Deploy:
    vercel

📸 Screenshots

Beautiful and Ultimate Recipe Maker with which you can save, edit and delete! Preview

You can save the title and memo! Preview

You can update, too! Preview

Search through food menus from the huge database by Spooncular! Preview

Once you pick the menu, let AI spit out the recipe! Mind you, you can also set the words limit and language of your choice!* Preview

The ChatGPT will generate the image of your choice! You can also save the image and edit title! Preview


Enjoy cooking with the Food Cooking Recipe Maker! 🍳👨‍🍳👩‍🍳