Contact Info
43 Street 3, Hiep Binh Chanh Ward
Thu Duc District, HCM City, Vietnam
[email protected]
+84 866.09.02.09
Support

How should we call you?

    Follow Us

    Zodinet Technology Co.,Ltd

    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