Skip to content

README.md

Latest commit

 

History

History
119 lines (82 loc) · 3.47 KB

README.md

File metadata and controls

119 lines (82 loc) · 3.47 KB

React Pilot

I built this while learning the MERN stack as a part of my ICSI 518 Software Engineering class at UAlbany. This project consists of a series of gradual assignments designed to help you learn the MERN stack step-by-step. Each assignment builds on the previous one, introducing new concepts and techniques to enhance your understanding of full-stack development.

Try it out here

Technologies Used

Backend

  • Express.js: Handles API calls and database interactions.

Frontend

  • React.js: Provides a dynamic user interface with real-time updates.

Database

  • MongoDB: Used for data storage and retrieval.

Deployment

  • Originally deployed on Amazon EC2, now migrated to Vercel for hosting.

Project Structure

The project is organized into two main directories: back-end and front-end.

back-end

  • api/: Contains the API routes for different functionalities.
    • addition.js: Handles addition operations.
    • index.js: Main entry point for the backend.
    • inventory.js: Manages inventory-related operations.
    • users.js: Manages user-related operations.
  • config/: Configuration files for the backend.
    • database.js: MongoDB connection setup.
    • dotenv.js: Environment variable configuration.
  • database-models/: Mongoose models for MongoDB collections.
    • product.js: Schema for product data.
    • user.js: Schema for user data.
  • .env: Environment variables for the backend.
  • package.json: Backend dependencies and scripts.
  • vercel.json: Configuration for Vercel deployment.

front-end

  • public/: Static files for the frontend.
    • index.html: Main HTML file.
    • manifest.json: Web app manifest.
    • robots.txt: Robots exclusion protocol.
  • src/: Source code for the frontend.
    • assets/: Static assets like images.
    • components/: React components.
    • services/: API service functions.
    • styling/: CSS files for styling.
    • index.js: Main entry point for the frontend.
  • .env: Environment variables for the frontend.
  • package.json: Frontend dependencies and scripts.

Environment Variables

Both the frontend and backend use environment variables to manage configuration settings.

back-end

  • .env: Contains environment variables for the backend.
    • PORT: The port number on which the backend server runs.
    • MONGODB_URI: The connection string for MongoDB.

front-end

  • .env: Contains environment variables for the frontend.
    • REACT_APP_BACKEND_URL: The URL of the backend server.

These environment variables are essential for configuring the application to run correctly in different environments (development, production, etc.).

Instructions to Use the Project

Prerequisites

  • Node.js and npm installed
  • MongoDB installed and running

Setup

  1. Clone the repository:

    git clone https://github.com/satwikbhasin/react-pilot
cd react-pilot

  2. Backend Setup:

    cd back-end
npm install

  3. Frontend Setup:

    cd ../front-end
npm install

Running the Project

  1. Start the backend server:

    cd back-end
npm start

  2. Start the frontend server:

    cd ../front-end
npm start

  3. Open your browser and navigate to:

    http://localhost:3000

You should now see the React Pilot application running locally.