Installation & Setup

Relevant source files

The following files were used as context for generating this wiki page:

• backend/package.json
• frontend/package.json
• socket/package.json
• backend/server.js
• README.md
• backend/app.js

This guide provides comprehensive instructions for setting up and running the E-Commerce project. The application is architecturally divided into three main, independently running services: a Node.js backend, a React frontend, and a dedicated Socket.io server for real-time chat functionality. Each component requires its own setup, dependency installation, and environment configuration.

Following these steps will result in a fully functional local development environment. The project utilizes a range of technologies including Node.js, Express, React, Redux, MongoDB, and MySQL, alongside external services like Cloudinary, Stripe, and OpenAI.

System Architecture Overview

The project is composed of three distinct services that communicate with each other. The React frontend interacts with the backend API for data and the socket server for real-time messaging.

System Requirements

Before beginning the installation, ensure your system has the following software and accounts set up:

Requirement	Version/Details	Purpose
Node.js	>= 18.10.0	JavaScript runtime for all services.
npm or yarn		Package manager for installing dependencies.
MongoDB	Running instance	Primary database for users, products, orders, etc.
MySQL	Running instance	Secondary database.
Cloudinary Account		For storing and managing uploaded images.
Stripe Account		For processing credit card payments.
PayPal Developer Account		For processing PayPal payments.
OpenAI API Key		For the sentiment analysis feature.
Google Cloud Translate API Key	Optional	For translation services.

Sources: README.md

Installation Steps

The installation is divided into three parts, one for each service. You must run the installation commands within the respective directory for each service.

1. Backend Setup

The backend is an Express.js server that handles business logic, API endpoints, and database interactions.

1. Navigate to the backend directory:

   cd backend
   

2. Install dependencies:

   npm install
   

3. Create Environment File: Create a .env file inside backend/config/ and populate it with the necessary keys.
   Sources: README.md, backend/app.js:50-52

   Variable	Example Value	Description
   PORT	8000	Port for the backend server.
   DB_URI	your_mongodb_connection_string	MongoDB connection string.
   DB_HOST	localhost	MySQL database host.
   DB_USER	root	MySQL database user.
   DB_PASSWORD		MySQL database password.
   DB_NAME	new-nodejs	MySQL database name.
   JWT_SECRET	your_jwt_secret_key	Secret key for JWT signing.
   JWT_EXPIRE	7d	JWT expiration time.
   COOKIE_EXPIRE	5	Cookie expiration time in days.
   CLOUDINARY_NAME	your_cloudinary_name	Cloudinary account name.
   CLOUDINARY_API_KEY	your_cloudinary_api_key	Cloudinary API key.
   CLOUDINARY_API_SECRET	your_cloudinary_api_secret	Cloudinary API secret.
   STRIPE_API_KEY	your_stripe_api_key	Stripe API key.
   STRIPE_SECRET_KEY	your_stripe_secret_key	Stripe secret key.
   OPENAI_API_KEY	your_openai_api_key	OpenAI API key.
   FRONTEND_URL	http://localhost:3000	URL of the frontend for CORS configuration.

4. Start the server:

   • For development with auto-reloading:

     npm run dev
     

   • For production:

     npm start
     

   The backend will run on http://localhost:8000.
   Sources: backend/package.json:10-11, README.md

2. Frontend Setup

The frontend is a React application that serves as the user interface.

1. Navigate to the frontend directory:

   cd frontend
   

2. Install dependencies:

   npm install
   

3. Create Environment File: Create a .env file in the root of the frontend/ directory.
   Sources: README.md

   Variable	Example Value	Description
   REACT_APP_SERVER_URL	http://localhost:8000	URL of the backend API server.
   REACT_APP_SOCKET_URL	http://localhost:4000	URL of the socket server.
   REACT_APP_STRIPE_PUBLISHABLE_KEY	your_stripe_publishable_key	Stripe publishable key for the client-side.

4. Start the application:

   npm start
   

   The frontend will be accessible at http://localhost:3000.
   Sources: frontend/package.json:52, README.md

3. Socket Server Setup

This is a lightweight Node.js server dedicated to handling real-time chat via Socket.io.

1. Navigate to the socket directory:

   cd socket
   

2. Install dependencies:

   npm install
   

3. Create Environment File: Create a .env file in the root of the socket/ directory.
   Sources: README.md

   Variable	Example Value	Description
   PORT	4000	Port for the socket server.

4. Start the server:

   npm start
   

   The socket server will run on http://localhost:4000.
   Sources: socket/package.json:10, README.md

Backend Server Configuration

The main backend server, configured in backend/app.js, uses several important middleware for security, performance, and functionality.

The following diagram illustrates the request flow through the configured middleware.

Sources: backend/app.js:13-41

Key middleware configurations include:

• CORS: Configured to allow requests only from the FRONTEND_URL specified in the .env file, and to allow credentials.
  Sources: backend/app.js:13-18
• Rate Limiting: Limits each IP to 100 requests per 15 minutes to prevent brute-force attacks.
  Sources: backend/app.js:21-27
• Body Parser: Parses incoming request bodies with a limit of 10mb.
  Sources: backend/app.js:30-32
• Helmet: Sets various HTTP headers to secure the application from common web vulnerabilities.
  Sources: backend/app.js:35
• Express Mongo Sanitize: Protects against NoSQL query injection by sanitizing user-supplied data.
  Sources: backend/app.js:38

Running the Project

To run the full application, you must start all three servers concurrently. Open three separate terminal windows and run the respective start command in each project directory.

Sources: README.md

Once all services are running, you can access the application by navigating to http://localhost:3000 in your web browser.