Angular 10 Docker Tutorial | Dockerize Angular App and Deploy to Docker Hub [ STEP BY STEP GUIDE]

Published: 21 July 2020
on channel: Code Decode

12,936

165

#Angular Docker #Dockerize angular app

Udemy Course of Code Decode on Microservice k8s AWS CICD link:
https://openinapp.co/udemycourse

Course Description Video :
https://yt.openinapp.co/dmjvd

Hey Guys , As you can see in the starting of the video, our localhost 4200 was not responding, why this never happened to us in previous videos.? That’s Because the node server is not up and running anywhere in the whole system.

Then how can this whole angular application works at localhost :80.

What is this port 80? How can we transport complete angular application including node modules and even without starting the node server how this angular application works flawlessly? That’s because this is a docker image which is running here.

. And in this video my agenda is to make sure that we not only create docker images but also push them to docker hub for others to use your application anywhere without having the need to install node js or cli or anything. They just need browser and your docker image.

For tools we need:
Npm
Node
Angular CLI
VSC
Docker
Steps we have used in this video

1) Install Angular CLI

npm install -g @angular/cli

2) Create a New Angular Project With CLI

ng new project-name

3) Install Docker

From link https://docs.docker.com/install/

4) Try running app using ng server.

5) Create Dockerfile in root folder of your app with no extension.

FROM node:11.6.0-alpine AS builder
COPY . ./test-a-application
WORKDIR /test-a-application
RUN npm i
RUN $(npm bin)/ng build --prod

FROM nginx:1.15.8-alpine
COPY --from=builder /test-a-application/dist/test-a-application/ /usr/share/nginx/html

Now build your docker image using docker extension of VSC.

Right click on command pallet and write docker build, it will ask for file press enter.
Then it will build your docker image.

Docker image run.

Localhost : run there;

Push docker image to docker hub

Docker Hub : Its like a github for Docker images. Like git stores your repositories similarly docker stores your docker images.

What is nginx?
Also called as engine X is a web server

Why not use VMWare ? Like oracle one? :

Because : Vmware creates multiple OS on same host OS. Containerzation in oredr to be light weight, use same host OS and it creates multiple containers over your Host OS

Have you ever faced this situation when your code is working perfectly fine at your end / or at your system but as soon as you release it to testing, at QA’s system, that same code does not work. Do you remember when we covered package.json video, I have shown you how this can happen.

The reason behind this can be the version conflicts on user’s end. So what’s the solution.
Cant we create a container with the required versions, node modules and easily ship these containers to run on other machines?

Now the end users can use the application easily by running this container without worrying about the dependencies or any version conflicts.

This video contains step by step guide that you can follow to know how to dockerize angular application. It contains all the info required for learning angular docker using angular docker nginx.
Its made with Angular 10 hence you can learn how to dockerize angular app created in angular 10.
It contains step by step guide that helps you in creating an angular Dockerfile which is a bare minimum requirement for building a docker image for your angular 10 application. Use angular docker nginx for creating image for docker

It also contains steps to run the docker file in Visual studio code using visual studio code extensions.This angular docker tutorial is all what you need implementing containerization technique for your angular application

This tutorial also explains about dockerhub, ngnix, VMWares pros and cons and many more hidden terminologies and facts.

Code Decode Playlists

Most Asked Core Java Interview Questions and Answers :    • Core Java frequently asked Interview ...

Advance Java Interview Questions and Answers :    • Advance Java Interview Questions

Java 8 Interview Questions and Answers :    • Java 8 Interview Questions(New Features)

Hibernate Interview Questions and Answers :    • Hibernate Interview Questions Java

Spring Boot Interview Questions and Answers :    • Advance Java Interview Questions

Angular Playlist :    • Angular Course Introduction || Angular 8

GIT :    • GIT

Subscriber and Follow Code Decode

Subscriber Code Decode : https://www.youtube.com/c/CodeDecode?...

Linkedin :   / codedecodeyoutube

Instagram :   / codedecode25

--------------------------------------------------------------------------------------------------------------------------------------

On this page of the site you can watch the video online Angular 10 Docker Tutorial | Dockerize Angular App and Deploy to Docker Hub [ STEP BY STEP GUIDE] with a duration of hours minute second in good quality, which was uploaded by the user Code Decode 21 July 2020, share the link with friends and acquaintances, this video has already been watched 12,936 times on youtube and it was liked by 165 viewers. Enjoy your viewing!

994