🍽️ Recipify

Recipify is an AI-powered recipe generator I built to transform ingredients into beautifully formatted cooking instructions.
It showcases how AI APIs can be integrated into a modern React + Express full-stack application.

---

🚀 What is Recipify?

Recipify allows users to enter a list of ingredients and receive a complete recipe generated by AI.
I built this project as a personal demo to help me master real-world full-stack development by working on something practical, interactive, and scalable.

Through this project, I focused on strengthening my understanding of:

• ⚛️ React and modern frontend patterns
• 🧠 AI API integration
• 🧩 Backend development with Express
• 🔗 Frontend ↔ Backend communication

---

🎯 Project Vision

This project goes beyond tutorials and focuses on real application architecture, with an emphasis on:

• Component-based UI design
• Global state management
• API communication
• Clean and maintainable project structure

---

✨ Features

• 🥕 Enter a list of ingredients
• 🔢 A minimum of 5 ingredients is required to generate a recipe
• 🤖 Ingredients are sent to the backend for AI processing
• 📝 The AI returns a recipe in Markdown format
• 🎨 Markdown is rendered using ReactMarkdown
• ⚡ Simple, fast, and intuitive workflow

---

🛠️ Tech Stack

Frontend

• React
• TypeScript
• Redux (Global State Management)
• Axios

Backend

• Express
• Hugging Face API

---

🌍 Live Demo

The project is fully deployed on Vercel and can be used instantly:

Live URL: Recipify Application Live

---

📦 Prerequisites

• Node.js
• pnpm

---

⚙️ Installation

# 1. Add your Hugging Face token inside server/.env
# HF_TOKEN=your_token_here

# 2. Install all dependencies
pnpm install
cd client && pnpm install
cd ../server && pnpm install

# 3. Start the application
cd client && pnpm dev
cd server && pnpm start

---

🧪 How to Use

1. Enter at least 5 ingredients
2. Click Get Recipe
3. View the AI-generated recipe rendered in rich formatting

---

📂 Dependencies

All dependencies are listed in:

• client/package.json
• server/package.json

---

📜 License

This is a personal demo project and is intentionally left unlicensed. The code is provided for learning and reference only. Reuse, redistribution, or commercial use should only be done with my permission.

---

🙏 Thank You

Thanks for checking out Recipify. This project reflects my journey into full-stack development and AI integration, and I plan to keep improving it.

Happy cooking & coding 🍳💻