Dead-Simple React App

How to easily integrate Express.js and MongoDB with create-react-app.

Development

Install dependencies:

yarn

While developing, two servers must be run at the same time:

• Server server: Express.js connected to the database at port 4000.
• Client server: create-react-app development server with hot reloading.

Both can be started with the single command:

yarn run dev

Go visit localhost:3000 and query the server with relative paths like:

// Good
fetch('/api/v1/').then(...);
// -> Request is automatically proxied.

// Bad
fetch('localhost:4000/api/v1/').then(...);
// -> Real server address, but you will have problems with CORS.

Production

On production the app must be built once and then only run Express.js server:

# Automatically builds optimized react-app
yarn start

Production with Docker

First create data volume:

docker volume create --name=deadsimple-data

Then run with docker-compose and PM2 with (also update with):

docker-compose up -d --build

See the logs

docker-compose logs --follow app