ChaatBazaar🍴

ChaatBazaar is an interactive online street food platform dedicated to bringing authentic Indian snacks like samosa, kachori, and pani puri closer to food lovers within a 5 km delivery radius. It helps users discover regional delicacies often overshadowed by global food trends.

Demo Link : Link

🚀 About the Project

ChaatBazaar is a responsive, mobile-first web application designed to bring the vibrant experience of Indian street food directly to your screens. With location-based delivery checks, intuitive categorization, and a dynamic cart system, it offers a seamless ordering experience tailored for cravings.

✨ Key Features

🎯 Core Features

• Responsive Homepage: Featuring an eye-catching hero section.
• Smart Menu Listing: Categorized by specific states and food types.
• Cart & Checkout System: Includes a location-based delivery check (strict 5 km radius limit).
• Mobile-First Design: Fully responsive UI for optimal viewing across all devices.

🤝 Contributor Features (Areas for Expansion)

• 🌶️ Spice Level Customization: Per order modifications.
• 🎁 Loyalty & Referrals: Points system and referral codes.
• 📍 Live Order Tracking: Simulated tracking UI.
• 🗣️ Testimonials: Social proof sections.
• ✨ Animations: Smooth hover effects and page transitions.
• 🔍 Search & Filter: Advanced functionality for finding specific dishes.
• 🏷️ Daily Specials: Automated combo deals and highlights.

📸 Visual Showcase

Home Page	Menu View

📁 Project Structure

Below is the directory layout of the ChaatBazaar project to help you navigate the codebase:

ChaatBazaar/
├── .github/               # GitHub configuration
│   └── workflows/         # CI/CD automation pipelines
│       └── ci.yml         # Continuous Integration workflow configuration
├── css/                   # Stylesheets for the application
│   ├── 404.css            # Styling specific to the error page
│   └── style.css          # Main global styles and theme configurations
├── data/                  # Local data storage files
│   └── menu.json          # Structured menu item data (dishes, prices, states)
├── img/                   # Asset directory for static images and graphics
│   ├── 1.avif             # Food item image asset
│   ├── 2.avif             # Food item image asset
│   ├── 7.avif             # Food item image asset
│   ├── 8.avif             # Food item image asset
│   ├── 9.avif             # Food item image asset
│   └── chaat.png          # Main application logo/banner asset
├── js/                    # Application client-side scripting
│   └── main.js            # Core JavaScript logic (cart operations, filtering)
├── 404.html               # Custom 404 Error Page
├── about.html             # Information about ChaatBazaar
├── cart.html              # User shopping cart and order confirmation page
├── CONTRIBUTING.md        # Detailed rules and setup guidelines for contributors
├── favicon.png            # Browser tab icon asset
├── index.html             # Application entry point (Landing / Home Page)
├── LICENSE                # MIT License file
├── menu.html              # Browse-able items list page
├── orders.html            # User order history or current order details page
└── README.md              # Project documentation file

## 💻 Tech Stack <a name="-tech-stack"></a>
Built with modern, lightweight web technologies:
* <img src="https://img.shields.io/badge/HTML5-E34F26?style=flat-square&logo=html5&logoColor=white" alt="HTML5" />
* <img src="https://img.shields.io/badge/CSS3-1572B6?style=flat-square&logo=css3&logoColor=white" alt="CSS3" />
* <img src="https://img.shields.io/badge/JavaScript-F7DF1E?style=flat-square&logo=javascript&logoColor=black" alt="JavaScript" />
* <img src="https://img.shields.io/badge/JSON-000000?style=flat-square&logo=json&logoColor=white" alt="JSON" />
* <img src="https://img.shields.io/badge/GitHub_Pages-222222?style=flat-square&logo=github-pages&logoColor=white" alt="GitHub Pages" />


<img src="https://capsule-render.vercel.app/api?type=rect&height=4&color=FF7B54" width="100%">


## Important points for Contributors to keep in Mind :

1. Maintain the Orange theme, throughout the Wesbite.

2. Include "Before" and "After" screenshots of the webpage for all changes, in the Pull Request description.

3. Install the "Live Server" extension and run the project, through Live Server to prevent issues such as images or pages not displaying correctly due to relative file paths.

4. If the original repository gets updated after you fork it, you should sync your fork before creating a new PR. This prevents merge conflicts and outdated code.<br>
So always follow the below steps, before any Pull request, for the corresponding Branch, to keep the repository upto date :



## Method 1: Using Git Commands (Terminal Users)

### Step - 1 : Fetch latest changes from original repo
   ```bash
   git fetch upstream

Step - 2 : Merge changes into your local main branch

git merge upstream/main

Step - 3 : Push updated code to your fork

git push origin main

Method 2: If using Github Desktop app :

Step - 1:

1. Go to your forked repository on GitHub webpage
2. Click "Sync fork" button (if visible)
3. Click "Update branch"

Step - 2:

In Github Desktop app :

1. Open GitHub Desktop
2. Select the repository: ChaatBazaar
3. Click Fetch origin
4. Click Pull origin (if visible)

📥 Submitting a Pull Request for First time :

Follow these steps to contribute your changes to ChaatBazaar:

1. 🌟 Star & Fork the Repository
   Click the “Fork” the repo to create your own copy:
   👉 https://github.com/PatelHarsh2006/ChaatBazaar

2. 📥 Clone Your Fork
   Use the following command to clone your forked repository to your local machine:

   git clone https://github.com/PatelHarsh2006/ChaatBazaar.git

3. Create a Branch Navigate to the project directory and create a new branch for your changes:

     cd ChaatBazaar
     git checkout -b my-feature-branch

4. Make Changes Fix bugs or improve UI/UX as needed.

5. Commit Your Changes Use a meaningful commit message:

   git add .
   git commit -m "📦 [Feature Add] Add XYZ website project"

6. Push Your Changes Push your branch to your GitHub fork:

   git push origin my-feature-branch

7. Submit a Pull Request

   Go to your fork on GitHub.

   Click "Compare & pull request".

   Add a descriptive title using one of the prefixes: [UI], [UX], [Feature Add].

   Link the related issue (if any) and clearly describe your changes.

📜 License

This project is licensed under the MIT License - see the LICENSE file for details.

🤝 Contacts

Source	Link
GitHub Profile	PatelHarsh2006
Project Repository	ChaatBazar

Don't forget to ⭐ star the repo if you like this project!
Made with ❤️ for the 🌍