Skip to content

love25-codes/recipe_master

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

2 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

🍽️ Recipe Master

A modern React + Vite recipe discovery web app that lets users search meals, explore recipe details, and save favourites locally.

The project focuses on API integration, component-based architecture, and responsive UI design.

🌐 Live Demo:

✨ Features:

 -> 🔍 Search recipes dynamically from API
 -> 🍲 Detailed recipe view (ingredients + measurements)
 -> ❤️ Add recipes to favourites (stored using LocalStorage)
 -> ⚡ Fast UI using React + Vite
 -> 🎨 Styled with Tailwind CSS
 -> 📱 Fully responsive layout
 -> 🍴 Random dish of the day section

🧠 Concepts Used:

 -> React Hooks (useState, useEffect)
 -> Component Architecture
 -> Props & State Management
 -> API Fetching
 -> Conditional Rendering
 -> Local Storage
 -> Dynamic Rendering from API data

🛠️ Tech Stack:

 -> React
 -> Vite
 -> Tailwind CSS
 -> JavaScript (ES6+)

📂 Project Structure:

Recipe_Master
│
├── src
│   ├── components
│   │   ├── Banner.jsx
│   │   ├── Discover.jsx
│   │   ├── Favourites.jsx
│   │   ├── Footer.jsx
│   │   ├── FunFact.jsx
│   │   ├── Navbar.jsx
│   │   ├── QuickMeals.jsx
│   │   ├── RecipeCard.jsx
│   │   └── Search.jsx
│   │
│   ├── App.jsx
│   ├── main.jsx
│   └── index.css
│
├── package.json
└── vite.config.js

❤️ Favourites System:

Recipes added to favourites are stored using LocalStorage, meaning:
   -> Each user gets their own saved list
   -> Data persists after refresh
   -> No backend required

👩‍💻 Creator:

Lovepreet Kaur

Built with curiosity, creativity, and React.

Releases

Packages

Contributors

Languages