FOOD 🍔 - Food Ordering Website

This repository hosts the source code for FOOD, a dynamic food ordering website built with the MERN Stack. It offers a user-friendly platform for seamless online food ordering.

BCA 3rd year Project!

student Names :

1. Dev Vijay
2. Sonali Nagar
3. Vijay Malav
4. Khushi Talreja

Demo 🍕

• User Panel: ( https://devvj-1.github.io/Food-order-website/ )

Features

• Login/Signup
• Logout
• Add to Cart
• Place Order
• Place Order from Specific restaurants
• Order Management
• Filter Food Products
• Beautiful Alerts

Screenshots

• Our Customers Reviews ⭐⭐⭐

• Landing Page with New Logo

• Products Section

• Cart Page

• Login Popup

• Meet Our Team

Run Locally

Clone the Frontend and backend project files

Frontend 🍝 :

    https://github.com/DevVj-1/Food-order-website.git

Backend 🫕:

    https://github.com/DevVj-1/Food-order-website-backend.git

Go to the project directory

    cd Food-Delivery

Install dependencies (frontend)

    cd .\Food-order-website\
    npm install

Install dependencies (backend)

Navigate to your project directory

    cd .\Food-order-website-backend\  
    npm install

Setup Environment Vaiables

Make .env file in "backend" folder and store environment Variables

  EMAIL_USER=Test7113@gmail.com
  EMAIL_PASS=pass123
  MONGODB_URI=mongodb+srv://Test7113:Test1234@cluster0.zfriu.mongodb.net/?retryWrites=true&w=majority&appName=Cluster0

Start the Frontend server

    ./index.html
    npm start

Start the Backend server

Step 1:

Step 2:

Go to the https://cloud.mongodb.com/ and configer Ip server address on Network accessList:

Step 3: If you want to see users you can go to " Clusters > Browse Collections > Users > food-users

Tech Stack 🍜

• Node.js (as the backend runtime environment)
• Express.js (as a backend framework for handling routes)
• Mongodb ( as DataBase )

Frontend Technologies:

HTML5 - Structure of the webpage.

CSS3 - Styling and layout.

Bootstrap (CDN) - For responsive design.

Tailwind CSS - Another styling framework used.

Custom CSS (index.css, navbar1.css, login1.css).

JavaScript - Provides interactivity and dynamic content.

Vanilla JS (index.js, login1.js).

FontAwesome Icons (for UI enhancements).

Bootstrap JavaScript (for modals, dropdowns, and other UI components).

Backend Technologies 🌭:

Node.js with Express.js (Common for handling APIs)

Database 🥪 :

• MongoDB

Deployment 🍱

The application can be deployed on Render or Github.

Feedback

If you have any feedback, please reach out to me here