Skip to content

Project: React Restaurant Ordering Platform with User Authentication and Checkout. Created at https://spectra.codes, which is owned by @Drix10

Notifications You must be signed in to change notification settings

coslynx/react-restaurant-ordering-platform

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

51 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation


react-restaurant-ordering-platform

A fully functional restaurant website for online ordering

Developed with the software and tools below.

Framework used: React Frontend technologies: Javascript, HTML, CSS Backend technology: Node.js LLMs used: Custom, Gemini, OpenAI

git-last-commit GitHub commit activity GitHub top language

πŸ“‘ Table of Contents

  • πŸ“ Overview
  • πŸ“¦ Features
  • πŸ“‚ Structure
  • πŸ’» Installation
  • πŸ—οΈ Usage
  • 🌐 Hosting
  • πŸ“„ License
  • πŸ‘ Authors

πŸ“ Overview

This repository houses the "react-restaurant-ordering-platform" project, a comprehensive solution designed for food enthusiasts and online ordering preferences. It leverages the power of React for the frontend and Node.js for the backend, providing a seamless and intuitive platform for browsing menus, placing orders, and managing customer accounts.

πŸ“¦ Features

Feature Description
βš™οΈ Architecture The project employs a modular architecture with separate directories for frontend and backend components, promoting maintainability and scalability.
πŸ“„ Documentation The repository includes a README file providing a detailed overview of the project, its dependencies, and instructions for setup and usage.
πŸ”— Dependencies The codebase relies on external libraries and packages such as React, Node.js, Express.js, MongoDB, and Stripe, essential for building the user interface, handling API requests, managing data, and processing payments.
🧩 Modularity The modular structure enhances maintainability and code reuse. Components are separated into distinct directories for easier management and scalability.
πŸ§ͺ Testing The project incorporates unit testing using frameworks like Jest and React Testing Library to ensure the reliability and robustness of the codebase.
⚑️ Performance Performance optimization techniques are implemented to ensure a smooth user experience, including caching mechanisms, efficient API calls, and image optimization.
πŸ” Security Security measures are implemented to protect user data, including input validation, data sanitization, secure communication protocols (HTTPS), and password hashing.
πŸ”€ Version Control Utilizes Git for version control, enabling efficient collaboration and code management with a comprehensive history of changes.
πŸ”Œ Integrations The project integrates with external APIs for essential features. Stripe for secure payment processing, Google Maps for location-based services, Firebase Cloud Messaging for notifications, and potentially Zomato/Yelp for menu data.
πŸ“Ά Scalability The architecture is designed for scalability, allowing the website to handle increasing user load and data volume. Cloud hosting, database optimization, and caching techniques are considered.

πŸ“‚ Structure

β”œβ”€β”€ client
β”‚   β”œβ”€β”€ components
β”‚   β”‚   β”œβ”€β”€ Header.js
β”‚   β”‚   β”œβ”€β”€ Footer.js
β”‚   β”‚   β”œβ”€β”€ HomePage.js
β”‚   β”‚   β”œβ”€β”€ MenuPage.js
β”‚   β”‚   β”œβ”€β”€ LoginPage.js
β”‚   β”‚   β”œβ”€β”€ SignupPage.js
β”‚   β”‚   β”œβ”€β”€ CartPage.js
β”‚   β”‚   β”œβ”€β”€ CheckoutPage.js
β”‚   β”‚   β”œβ”€β”€ OrderTrackingPage.js
β”‚   β”‚   β”œβ”€β”€ AboutUsPage.js
β”‚   β”‚   β”œβ”€β”€ ContactUsPage.js
β”‚   β”‚   └── DishCard.js
β”‚   β”œβ”€β”€ pages
β”‚   β”‚   β”œβ”€β”€ index.js
β”‚   β”‚   β”œβ”€β”€ menu.js
β”‚   β”‚   β”œβ”€β”€ login.js
β”‚   β”‚   β”œβ”€β”€ signup.js
β”‚   β”‚   β”œβ”€β”€ cart.js
β”‚   β”‚   β”œβ”€β”€ checkout.js
β”‚   β”‚   β”œβ”€β”€ orderTracking.js
β”‚   β”‚   β”œβ”€β”€ about.js
β”‚   β”‚   └── contact.js
β”‚   β”œβ”€β”€ styles
β”‚   β”‚   β”œβ”€β”€ global.css
β”‚   β”‚   └── theme.js
β”‚   β”œβ”€β”€ utils
β”‚   β”‚   β”œβ”€β”€ api.js
β”‚   β”‚   β”œβ”€β”€ auth.js
β”‚   β”‚   β”œβ”€β”€ cart.js
β”‚   β”‚   β”œβ”€β”€ payment.js
β”‚   β”‚   └── tracking.js
β”‚   └── App.js
└── server
    β”œβ”€β”€ config
    β”‚   β”œβ”€β”€ database.config.js
    β”‚   └── env.config.js
    β”œβ”€β”€ controllers
    β”‚   β”œβ”€β”€ menuController.js
    β”‚   β”œβ”€β”€ orderController.js
    β”‚   β”œβ”€β”€ userController.js
    β”‚   └── authController.js
    β”œβ”€β”€ models
    β”‚   β”œβ”€β”€ Menu.js
    β”‚   β”œβ”€β”€ Order.js
    β”‚   β”œβ”€β”€ User.js
    β”‚   └── Dish.js
    β”œβ”€β”€ routes
    β”‚   β”œβ”€β”€ menuRoutes.js
    β”‚   β”œβ”€β”€ orderRoutes.js
    β”‚   β”œβ”€β”€ userRoutes.js
    β”‚   └── authRoutes.js
    β”œβ”€β”€ services
    β”‚   β”œβ”€β”€ menuService.js
    β”‚   β”œβ”€β”€ orderService.js
    β”‚   β”œβ”€β”€ userService.js
    β”‚   └── authService.js
    └── index.js

πŸ’» Installation

πŸ”§ Prerequisites

  • Node.js (LTS version recommended)
  • npm or yarn
  • Docker (for containerization, if desired)

πŸš€ Setup Instructions

  1. Clone the Repository:
    git clone https://github.com/spectra-ai-codegen/react-restaurant-ordering-platform.git
  2. Navigate to the Project Directory:
    cd react-restaurant-ordering-platform
  3. Install Dependencies:
    npm install 

πŸ—οΈ Usage

πŸƒβ€β™‚οΈ Running the Project

  1. Start the Development Server:
    npm start
  2. Access the Website: Open your web browser and visit http://localhost:3000

βš™οΈ Configuration

  • Environment Variables: Create a .env file in the project root and define environment-specific settings like database connection details and API keys.

🌐 Hosting

πŸš€ Deployment Instructions

  1. Choose a Hosting Platform: Consider services like Vercel, Netlify, Heroku, AWS, or Google Cloud for hosting the website.
  2. Set Up Deployment: Follow the specific instructions for deploying the project on your chosen platform.
  3. Configure Environment Variables: Ensure that environment variables are correctly set up on the hosting platform.
  4. Deploy the Application: Use the platform's deployment tools to deploy the code and make it publicly accessible.

πŸ“œ API Documentation

πŸ” Endpoints

  • GET /api/menu: Retrieves the restaurant menu.
  • GET /api/dishes/:id: Retrieves a specific dish by ID.
  • POST /api/orders: Places a new order.
  • GET /api/orders/:id: Retrieves an order by ID.
  • PUT /api/orders/:id: Updates an order (e.g., status change).
  • POST /api/users: Creates a new user account.
  • POST /api/login: Authenticates a user and returns a JWT token.

πŸ”’ Authentication

  • The API uses JSON Web Tokens (JWT) for user authentication. Users must authenticate using a valid JWT token to access protected resources.

πŸ“ Examples

  • Get the menu:
    curl -X GET http://localhost:3000/api/menu

πŸ“œ License

This project is licensed under the MIT License.

πŸ‘₯ Authors

🌐 Spectra.Codes

Why only generate Code? When you can generate the whole Repository!