Skip to content

paras941/recipex-web

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

29 Commits
 
 
 
 
 
 
 
 

Repository files navigation

🍽️ RecipeX — React Recipe Web App

A modern and responsive recipe web application built with React and Vite, showcasing real-world usage of core React concepts such as state management, side effects, routing, and reusable component architecture with modular SCSS styling.

🔗 **Live Demo: Click here


🚀 Tech Stack

Technology Purpose
React (Vite) UI framework and fast development
JavaScript (ES6+) Application logic
React Router DOM Client-side routing
SCSS (Modular) Scalable and maintainable styling
Responsive Design Mobile-first layout

📂 Project Structure

Path Description
public/ Static assets
src/ React source code
src/App.jsx Root component
src/main.jsx Application entry
index.html HTML template
vite.config.js Vite configuration
package.json Dependencies and scripts
README.md Documentation

⚛️ React Concepts Used

Concept / Hook Usage Purpose
useState Search, Favorites, Filters UI and recipe state management
useEffect Recipe Fetching API calls and side effects
Props All Components Component communication
React Router App.jsx Page navigation
Conditional Rendering Loader, RecipeList Dynamic UI updates
Reusable Components RecipeCard, Navbar Clean architecture

🧠 Core Functionalities

Feature Description
Browse Recipes View recipe listings
Recipe Details Dedicated detail pages
Search & Filters Find recipes quickly
Favorites Save selected recipes
Responsive UI Works on all devices
SCSS Modules Organized styling system

🔮 Future Enhancements

Feature Planned Improvement
API Integration Spoonacular / Edamam
Authentication User accounts
Meal Planner Weekly planning
Theme Toggle Dark / Light mode
Nutrition Info Calories & macros

🎯 Purpose

Goal Value
Portfolio Project Show real React usage
Internship Ready Clean architecture
Placement Prep Demonstrates hooks, routing, state
Best Practices Modular structure and styling

📜 License

MIT License — Free for learning and portfolio use.

About

A responsive React-based recipe platform with modular components, SCSS/Tailwind styling, and optimized performance using Vite.

Topics

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors