Thanks to visit codestin.com
Credit goes to github.com

Skip to content
This repository was archived by the owner on Oct 11, 2025. It is now read-only.
/ shopeefood-app Public archive

Project course: Clone ShopeeFood by React Native (Cross platform)

nvminh162/shopeefood-app

Folders and files

NameName
Last commit message
Last commit date

Latest commit

Β 

History

65 Commits
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 
Β 

Repository files navigation

ShopeeFood Full-Stack Application

ShopeeFood welcome ShopeeFood Home ShopeeFood Product ShopeeFood Info

πŸ“‹ Table of Contents

πŸš€ Overview

ShopeeFood is a comprehensive food delivery platform inspired by the popular Shopee Food service. This full-stack application consists of three main components:

  1. Mobile Client - A React Native mobile application for customers to browse restaurants, view menus, and place orders
  2. Admin Dashboard - A web-based administrative interface for managing restaurants, menus, and orders
  3. Backend API - A NestJS-based RESTful API service that powers both the client and admin applications

The application enables users to browse restaurants, view menus, add items to cart, place orders, and track delivery status. Restaurant owners and administrators can manage their menus, view orders, and handle customer requests through the admin dashboard.

πŸ“ Project Structure

The project is organized into three main directories:

shopeefood-app/
β”œβ”€β”€ shopeefood-backend/          # NestJS backend API
β”œβ”€β”€ shopeefood-frontend-client/  # React Native mobile client app
β”œβ”€β”€ shopeefood-frontend-admin/   # React admin dashboard
└── README/                      # Project screenshots and documentation assets

✨ Features

Client App Features

  • User authentication (register, login, email verification)
  • Restaurant discovery and browsing
  • Search functionality for restaurants and dishes
  • Menu browsing with item details
  • Shopping cart management
  • Order placement and tracking
  • User profile management

Admin Dashboard Features

  • Admin authentication and authorization
  • Restaurant management (add, edit, delete)
  • Menu and menu item management
  • Order management and status updates
  • User management
  • Analytics and reporting

Backend API Features

  • RESTful API architecture
  • User authentication and authorization
  • Data persistence with MongoDB
  • Email services for verification and notifications
  • File upload for images
  • Caching for improved performance

πŸ’» Technologies

Backend

  • Framework: NestJS (Node.js)
  • Database: MongoDB with Mongoose
  • Authentication: JWT, Passport
  • File Storage: Local file system
  • Email Service: Nodemailer
  • API Documentation: Postman Collection

Mobile Client

  • Framework: React Native with Expo
  • Navigation: Expo Router (file-based)
  • State Management: React Context API
  • API Integration: Axios
  • Form Handling: Formik & Yup
  • UI Components: Custom components with React Native elements

Admin Dashboard

  • Framework: React.js
  • UI Library: Ant Design
  • State Management: React Context API / Redux
  • API Integration: Axios
  • Routing: React Router
  • Server: Express.js (for production serving)

πŸ“± Screenshots

Welcome & Home Screens

ShopeeFood Welcome ShopeeFood Home

Product & Search Screens

ShopeeFood Product ShopeeFood Search

Order & Information Screens

ShopeeFood Order ShopeeFood Information

πŸ”§ Installation & Setup

Prerequisites

  • Node.js (v18 or higher)
  • MongoDB (local or Atlas)
  • Expo CLI (for mobile client)
  • Git

Backend Setup

  1. Navigate to the backend directory:

    cd shopeefood-backend
  2. Install dependencies:

    npm install
  3. Create a .env file (see Environment Configuration)

  4. Start the backend server:

    npm start

Client Frontend Setup

  1. Navigate to the client directory:

    cd shopeefood-frontend-client
  2. Install dependencies:

    npm install
  3. Start the Expo development server:

    npm start

Admin Dashboard Setup

  1. Navigate to the admin directory:

    cd shopeefood-frontend-admin
  2. Install dependencies:

    npm install
  3. Start the development server:

    npm start

βš™οΈ Environment Configuration

Backend .env Configuration

# Server Configuration
PORT=8080

# Database Configuration
MONGODB_URI=mongodb://username:password@host:port/database
ACTIVE_KEY=your_active_key_here

# Email Configuration
[email protected]
MAIL_PASSWORD=your_email_password
MAIL_EXPIRE_IN=500

# Sample Data
SHOULD_INIT=true
INIT_PASSWORD=123456

# JWT Configuration
JWT_SECRET=your_jwt_secret_key
JWT_ACCESS_TOKEN_EXPIRED=1000d

Admin Frontend .env Configuration

PORT=3000

⚠️ Note: For security reasons, never commit your .env files to version control. To get the actual values for these environment variables, please contact the administrator at https://www.facebook.com/nvminh162

πŸš€ Running the Application

Development Mode

Run each component in development mode:

Backend:

cd shopeefood-backend
npm run start:dev

Client Frontend:

cd shopeefood-frontend-client
npm start

Admin Dashboard:

cd shopeefood-frontend-admin
npm run dev

Production Mode

For production deployment, you can use:

Backend:

cd shopeefood-backend
npm run start:prod

Client Frontend: Build the Expo app for the appropriate platform (iOS/Android)

Admin Dashboard:

cd shopeefood-frontend-admin
npm start

πŸ“š API Documentation

The API documentation is available via a Postman Collection. Import the collection file located at:

shopeefood-backend/data/nvminh162_shopeefood_postman_collection_nestjs.json

This collection contains all the endpoints available in the API, along with example requests and responses.

πŸ‘¨β€πŸ’» Development Workflow

  1. Start the backend server first
  2. Launch the client and admin frontends
  3. Use the Postman collection to test API endpoints
  4. Make changes to the respective components as needed
  5. For mobile client development, use the Expo Go app on a physical device or emulator

πŸ‘€ Author

  • Developer: nvminh162
  • Contact: Facebook

πŸ“„ License

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


Β© 2025 ShopeeFood Application. All rights reserved.

About

Project course: Clone ShopeeFood by React Native (Cross platform)

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published