Desplegar app react con docker

April 20, 2019 • ☕️ 1 minutos de lectura

Lo primero debemos editr nuestro package.json para añadir los siguiente comandos a scripts.

{
  "name": "app",
  "version": "1.0.0",
  "description": "",
  "main": "index.js",
  "scripts": {
    // ..
    "docker:build": "docker build . -t gatoflaco/cra-docker",
    "docker:run": "docker run -p 8080:80 gatoflaco/cra-docker --name react",
    "docker:stop": "docker rm -f react"
  },
  "keywords": [],
  "author": "",
  "license": "MIT",
  "devDependencies": {
    // ...
  },
  "dependencies": {
    // ...
  }
}

Ahora crearemos el fichero Dockefile, este fichero debe estar en la raiz del proyecto.

# Stage 1 - the build process
FROM node:10.15.3 as build-deps
# Versions
RUN npm -v
RUN node -v

WORKDIR /usr/src/app
COPY package.json yarn.lock ./
RUN yarn
COPY . ./
RUN npm install
RUN yarn build

# Stage 2 - the production environment
FROM nginx:1.12-alpine
COPY --from=build-deps /usr/src/app/build /usr/share/nginx/html
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]

Ahora crearemos una imagen con el siguiente comando:

docker build . -t gatoflaco/cra-docker

Para ejecutar la imagen y crear el contenedor podemos usar:

docker run -p 8080:80 gatoflaco/cra-docker

También añadiremos un .dockerignorepara obviar algunos directorios.

.git
.idea
node_modules
build