Contact Info
43 Street 3, Hiep Binh Chanh Ward
Thu Duc District, HCM City, Vietnam
linh@zodinet.com
+84 908 543479
Support

How should we call you?

Follow Us

Zodinet

Docker Horizontal Large

Dockerize your Angular 2+ App

This tutorial will help you create docker container with Angular 2 and Nginx on production mode.

1.Setup Angular 2 application

Following Angular 2 instruction and create your Angular application https://angular.io/guide/quickstart

1.1 Install the Angular CLI

1.2 Create a workspace and initial application

1.3 Serve the application

2. Setup Dockerfile

2.1 Create .dockerignore

From your root directory, create .dockerignore file. It will ignore files/folder when you copy into docker image from your source.

node_modules
npm-debug.log
Dockerfile
.dockerignore

2.2 Create Dockerfile

From your root directory, create Dockerfile

FROM node:8 as node

WORKDIR /usr/src/app


COPY package*.json ./
COPY . .

RUN npm install

RUN npm run build --prod


FROM nginx:1.13.12-alpine

COPY --from=node /usr/src/app/dist /usr/share/nginx/html
COPY ./nginx.conf /etc/nginx/conf.d/default.conf

EXPOSE 80 443

3. Build & Run

3.1 First Build and create image

Run the following command

docker build -t zodinet/angular-web-app .

3.2 Run your image

Run the following command

docker run --name angular-web-app -p 443:443 -p 80:80 -d zodinet/angular-web-app

Check your result by visit http://localhost/

Post a Comment