Full Stack Web Application using React, Node.js, Express, Apollo GraphQL with Webpack and Babel

This is a template project for full stack development with React and Node.js. Javascript ES6 and ES7 syntax are also supported in this project.

Key Features

Frontend

• React
• Ant Design
• React Font Awesome
• Apollo Client

Backend

• Node.js
• Express
• PM2
• Apollo Server with Express.js

Compile

• Webpack 5
• Babel 7

---

Quick Start

Create enviornment variables config for webpack

• .dev.env: config for development environment
• .prod.env: config for production environment

# development or production
NODE_ENV=

# MongoDB URL
MONGO_URL=

# Secret
TOKEN_SECRET=

Development in docker and docker-compose

To build or rebuild images

docker-compose build --no-cache

Aggregate containers

docker compose up

Aggregate containers and do not attach MongoDB service

docker compose up --no-attach mongo

---

Install NPM packages

yarn (or npm install)

Development

yarn dev (or npm run dev)

Production

The output objects will be generated in dist folder. You could modify the path in webpack.config(.*).js.

1. Build

   yarn build (or npm run build)

2. Start

   yarn start (or npm start)

3. Start by PM2

   pm2 startOrReload pm2.config.js --env production --update-env