Cómo usar Docker con Angular y no morir en el intento

Para empezar a trabajar con Docker, principalmente deberíamos entender qué es y cómo funciona.

Docker es una tecnología de código abierto que nos permite crear pequeñas virtualizaciones de sistemas, llamados contenedores, donde podemos meter o empaquetar todo lo necesario para que funcione nuestra aplicación. Estás pequeñas virtualizaciones se ejecutan como procesos y no llegan a ser tan pesadas como las máquinas virtuales convencionales. De esta forma, logramos que en ellas tengamos todo lo esencial y necesario para que nuestra app o servicio funcione correctamente.

Originariamente, esta tecnología solo funcionaba en sistemas Linux, pero actualmente se encuentra también disponibles en sistemas Windows, aunque solo está disponible para las versiones de Windows 10 y Windows Server 2016.

Las ventajas principales con respecto a las máquinas virtuales son:

• Ocupan menos espacio que las máquinas virtuales convencionales.
• Al ser más ligeras que las máquinas virtuales, podemos estar ejecutando varias a la vez en el mismo servidor.
• Son más fáciles de actualizar y desplegar.
• Nos permiten crearlas lo más parecidas al entorno real de ejecución, por lo que las pruebas serán más efectivas.
• Cuenta con un repositorio de imágenes muy extenso que podemos utilizar de inicio para crear las nuestras propias que se encuentraaquí.

Comenzar a trabajar con Docker

Para comenzar a trabajar con Docker lo primero que tenemos que hacer es instalar las herramientas necesarias. Para ello, puedes acceder a la página oficial aquí.

Una vez tengamos todo instalado, lo siguiente es añadir un fichero Dockerfile en la misma ruta de nuestro proyecto. Este fichero contendrá todas las instrucciones necesarias para dejar nuestro entorno preparado y listo para ejecutar nuestra aplicación con todas las dependencias necesarias. En este ejemplo vamos a crear un fichero para ejecutar una aplicación de Angular.

Para crear nuestro fichero debemos pensar en los comandos necesarios para correr una aplicación angular, que son los siguientes:

• Instalar las dependencias necesarias, para ello ejecutamos npm install.
• Ejecutar la aplicación npm start. Ejecutando esta última instrucción si accedes a la dirección http://localhost:4200 deberás ver tu aplicación ejecutándose.

Una vez tenido en cuenta lo anterior vamos a crear nuestro dockerfile.

Añadir el fichero .dockerfile a nuestro directorio con el siguiente contenido:

Analizando nuestro fichero encontramos varias cosas:

• FROM node:8.6: Es el contenedor que vamos a usar para crear el nuestro propio.
• COPY ./ /app/: Copiamos los ficheros de nuestro proyecto al contenedor.
• WORKDIR /app: Es el directorio de trabajo donde se encuentra la aplicación dentro de nuestro contenedor.
• RUN npm install: Instalación de las dependencias para que nuestra aplicación funcione.
• EXPOSE 4200: Exponemos el puerto 4200 como público en nuestro contenedor; que es el que expone de forma predeterminada nuestra aplicación.
• ENTRYPOINT npm start:  Es el punto de entrada de nuestro contenedor y el que hace correr nuestra aplicación una vez ejecutado el contenedor.

A la hora de copiar nuestra aplicación a un contenedor, hay que tener en cuenta que, cuando copiamos los ficheros, no queremos copiar la carpeta local node_modules en el local.

A continuación, para ejecutar crear nuestro propio contenedor, vamos a ejecutar la siguiente instrucción:

docker  build -t  nombrecontenedor:etiqueta

Una vez generado nuestro propio contenedor lo ejecutaremos para ver que todo funciona correctamente:

dcoker run -p 4200:4200 nombrecontenedor:etiqueta

• Este comando arranca nuestro contenedor y ejecuta el comando indicado en el punto de entrada (ENTRYPOINT).
• A su vez estamos mapeando un puerto local 4200 con el puerto interno del contenedor.
• Ahora, si escribimos http://localhost:4200, volveremos a ver la misma imagen anterior, nuestra aplicación corriendo, pero esta vez dentro de un contenedor.

Conclusión

Hemos visto de una forma básica cómo ejecutar nuestra aplicación desde un contenedor Docker. Evidentemente, esta no es la forma más elegante de hacerlo ya que, si nos fijamos en el tamaño del contenedor, este ocupa muchísimo espacio puesto que estamos metiendo todo el proyecto en el contenedor – incluidas las dependencias generadas por Node (node_modules). La forma correcta de hacerlo sería realizar una compilación y, posteriormente, exponer la aplicación compilada detrás de un servidor http.