DEV Community

Eelco Verbrugge
Eelco Verbrugge

Posted on • Updated on

How to Dockerize a React app

A very simple and short guide to dockerize a React app.

Create a new React app

$ npx create-react-app dockerized-react-app
Enter fullscreen mode Exit fullscreen mode

Cd into your project

$ cd dockerized-react-app
Enter fullscreen mode Exit fullscreen mode

Create a file named Dockerfile

FROM node:13.12.0-alpine

WORKDIR /app

ENV PATH /app/node_modules/.bin:$PATH

COPY package.json ./
COPY package-lock.json ./

RUN npm install --silent
RUN npm install react-scripts@3.4.1 -g --silent

COPY . ./

CMD ["npm", "start"]
Enter fullscreen mode Exit fullscreen mode

Create a docker-compose file docker-compose.yml

version: '3.7'

services:

  app:
    container_name: my-dockerized-react-app
    build:
      context: .
      dockerfile: Dockerfile
    volumes:
      - '.:/app'
      - '/app/node_modules'
    ports:
      - 3000:3000
    environment:
      - CHOKIDAR_USEPOLLING=true

Enter fullscreen mode Exit fullscreen mode

Build your container

$ docker-compose up -d --build
Enter fullscreen mode Exit fullscreen mode

Go to http://localhost:3000/

Discussion (0)