Dockerfile multi fase

A continuación se detalla la configuración de un archivo Dockerfile multi fase; en donde, primero se utiliza una imagen alpine para construir una aplicación ReactJs y luego utilizar una imagen de nginx para deployar el contenido de la carpeta build

Diagrama de configuración

Archivo Dockerfile

# ---------------------------------
# FIRST BLOCK AS A BUILDER PHASE
# ---------------------------------
FROM node:16-alpine as builder
WORKDIR /usr/app
COPY package.json .
RUN npm install
COPY . .
RUN npm run build

# Default commando for the image, no es necesario
#CMD [ ]

# ---------------------------------
# SECOND BLOCK AS A RUN PHASE
# ---------------------------------
FROM nginx
COPY --from=builder /usr/app/build /usr/share/nginx/html

# Default commando for the image, no es necesario ya que nginx inicia automaticamente
#CMD [ ]
	

• Fase 1: Se utiliza una imagen 16-alpine como constructor, se utiliza el directorio de trabajo /usr/app, se copia el archivo package.json al directorio de trabajo, se corre el comando npm install se copia el resto de contenido y se corre el comando npm run build para generar el directorio build
• Fase 2: Se utiliza una image nginx, luego se copia desde el builder el contenido denerado en la carpeta /usr/app/build hacia la carpeta /usr/share/nginx/html que es la ubicación por defecto para deployar contenido estático en nginx. No es necesiario indicar el comando por defecto para la imagen ya que nginx por defecto se encarga de levantar automáticamente

Comandos para ejecutar el archivo DockerFile

• docker build . para compilar el archivo Dockerfile
• docker run -p 8080:80 id_imagen para inicializar la imagen en el puerto 8080 y mapenado al puerto 80 en donde se levanta por defecto nginx

Fuentes

• Repositorio Git Hub
• Comandos Docker
• Comandos Docker Compose
• Imagen nginx en Docker Hub