khushi-joshi-05 / Food-ordering-website

Foodie is a food ordering website that aims to provide users with a seamless experience for ordering food online, taking orders for pickup, and booking tables for dining in. The website showcases the quality and specialties of the food offered, along with a variety of services to cater to different user preferences.
https://foodies-ordering-website.netlify.app/
MIT License
154 stars 385 forks source link
![image](https://github.com/khushi-joshi-05/Food-ordering-website/assets/76521579/57ac35c6-c9d9-458d-a0bd-0f600fbded89) ![image](https://github.com/khushi-joshi-05/Food-ordering-website/assets/76521579/94548b28-f4e8-48aa-8a59-8c523cd7c206)

Food Ordering Website


![Open Source Love](https://badges.frapsoft.com/os/v2/open-source.svg?v=103)   ![PRs Welcome](https://img.shields.io/badge/PRs-welcome-green.svg)   Lines of Code   Stars Badge   Forks Badge   ![GitHub contributors](https://img.shields.io/github/contributors/khushi-joshi-05/Food-ordering-website?color=blue)   ![GitHub last commit](https://img.shields.io/github/last-commit/khushi-joshi-05/Food-ordering-website?color=red&style=plastic)   ![Repo. Size](https://img.shields.io/github/repo-size/khushi-joshi-05/Food-ordering-website?color=white)            

Foodie is a food ordering website that aims to provide users with a seamless experience for ordering food online, taking orders for pickup, and booking tables for dining in. The website showcases the quality and specialities of the food offered, along with a variety of services to cater to different user preferences.

This repository is aimed to help people to contribute in open source and learn Git and GitHub.

Key Features

Technologies Used

Development Steps

  1. Planning and Design:

    • Defined UI requirements based on user needs and business goals.
  2. HTML Structure:

    • Developed web page structure using HTML elements.
    • Organized content into logical sections like header, navigation, main content, and footer.
  3. CSS Styling:

    • Styled HTML elements to create visually appealing design.
    • Implemented responsive design for compatibility across various devices.
  4. JavaScript Interactivity:

    • Enhanced user interaction with dynamic features like menu filtering and form validation.

Tech Stack

šŸ½ļø How to Run the Food Ordering Website Locally

Step 1: šŸ–„ļø Clone the Project Repository

First, you need to clone the repository to your local machine. This process downloads a copy of the project files.

  1. Open Terminal or Command Prompt:

    • On Windows: You can open Command Prompt by typing cmd in the Start menu search bar and pressing Enter.
    • On macOS: You can open Terminal by pressing Cmd + Space, typing Terminal, and pressing Enter.
    • On Linux: You can open Terminal from your applications menu or by using the Ctrl + Alt + T shortcut.
  2. Run the Git Clone Command: In your terminal or command prompt, type the following command and press Enter:

    git clone https://github.com/khushi-joshi-05/FoodOrderingWebsite.git

    This command will create a new directory named FoodOrderingWebsite in your current location, containing all the files from the repository.

Step 2: šŸ“‚ Navigate to the Project Directory

Now, change your current directory to the newly created project directory.

  1. Navigate Using Terminal or Command Prompt: After cloning the repository, run the following command:

    cd FoodOrderingWebsite

    This command will change your working directory to the FoodOrderingWebsite directory, where all the project files are located.

Step 3: šŸŒ Open the index.html File

To view the website locally, you need to open the index.html file in your web browser.

Option A: Using the Command Line

Option B: Opening Manually

  1. Open File Explorer (Windows) or Finder (macOS):

    • On Windows: Press Win + E to open File Explorer.
    • On macOS: Click on the Finder icon in the Dock.
  2. Navigate to the Project Directory:

    • Browse to the location where you cloned the repository.
    • Open the FoodOrderingWebsite directory.
  3. Open the index.html File:

    • Find the index.html file within the FoodOrderingWebsite directory.
    • Double-click on index.html to open it in your default web browser.

Additional Notes šŸ“

By following these steps, you should be able to run the Food Ordering Website locally and view it in your web browser. Enjoy exploring the project! šŸ”šŸ•šŸŒ®

Screenshots

These are some snapshots of the project.

Landing Page

Menu Page

Services Page

Login Page

Our Contributors ā¤ļø

Thank you for contributing to our repository.šŸ˜ƒ

Contributors ### Show some ā¤ļø by starring this awesome repository!

License

MIT

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