DEPLOYING WEBSITES USING AZURE CONTAINER INSTANCES WITH DOCKER HUB IMAGES AND GITHUB

hello guys you're welcome to You computing's YouTube channel my name is Eugene and in this video I'm going to show you how you can deploy Azure container instances using already made custom images from Docker house now I have turned around a lot of terminologies over here I'm going to take my time and break it down step by step for you but I'm going to make sure I don't do too much Theory so that I don't get you bored imagine container instances are used in deploying containers in general so if you want to deploy an application whether it's web application or a website instead of getting a full-blown virtual machine and deploying it on it you can use containers instead now the benefits of using containers over the traditional virtual machines is that it saves you money because Microsoft for instance on their platform charges applications that runs on containers based on the milliseconds that they execute online virtual machine Azure container instances do not run on hypervices they have container runtime environment that they run on and a platform as a service offering now how do we even use container instances on Azure first of all you need to understand that containers are not a Microsoft proprietary technology it was made by these guys over here dock okay so you can install the docker engine on a desktop and build your own um container images if you are a pro or you can make use of the already made container images on Docker Hub we're also going to make use of GitHub so if you don't have GitHub account it is highly recommended if you want to follow along so just go to github.com and sign up over there so before you can use Azure container instances you need to have something that we call Azure container registry now the Azure container registry is the location within Azure and you're going to use who they already made container images from the docker Hub the first thing that you need to do if you want to implement the use of containers is to make sure you create another container registry I've already mentioned what containers are used for you can use it to host your applications but I'm going to use it to host website today and very simple HTML website just for proof of concept so that anybody can understand how containers work I'm going to take the first step by creating something that we call a resource Group if you don't know what a resource Group is I recommend you to go to docs.microsoft.com to readable resource groups okay now um I'll explain it briefly resource groups are just logical units that are used to organize and hold resources on Azure okay so anything that is created under Azure uh reception of this guy over here has to go into a resource Group okay so I'm going to go ahead and then go to my portal menu by default the Azure portal doesn't look like this I have customized mine to look this way if you want to know how I did it I have a video on YouTube teaching how you can customize your Azure portal in order to begin you need to create a resource Group so I'm going to go to the resource Group plate and then as you can see I have a whole bunch of resource groups over here okay now I have a resource group called containers currently is empty so that is the resource Group I'm going to use if you don't have a resource Group you can go ahead and click on create here and then follow through the wizard is very very easy okay so um that is basically how you can create a resource Group so if you have a resource Group you can just go ahead and go to your home screen and then locate This Global search field over here and then enter container registry okay now as you can see on my whole screen I already have container registry here but if you don't have yours over here you can go to the global search field and search for registration okay so it comes up with container registry now you need to click on that and then go ahead and click on create here I'm going to click on create you can create a new Resource Group for this container registry or you can use the system one I already have one called you containers so I'm going to go for that and then I'm going to give it a name I'm going to call this registry the new computing [Laughter] and I'm going to keep it in the East U.S region okay the SKU that comes with it we have different different skus okay I'm gonna stick with the standard I'm going to click here on next to networking and then we're giving access to specify whether we want to give Public Access or private access to this container registry depending on the SKU that you are having you can switch in between these two that with a standard SKU I only have the option to use public so I'm going to stick with that go next and then again the encryption option is only available for premium SK use somebody leave it at the default go next year I'm not going to specify any tags I'm going to go next to review and create and it's as simple as that okay creating your container registry is very straightforward so I'm going to click on create here and then give it a couple of minutes and it's done once the deployment is complete you can click on go to Resource and have an overview of the container registry that you created okay now the next step is to populate this container Registries Repository with images okay because before you can build containers using container instances on Azure you will need to have some images already imported into your container registry from to do this I'm going to click on the cloud shell now if this is the first time you're launching your Cloud show you're gonna have some prompt asking you to create a small storage account it's very normal you can just go ahead and do it in order to import container images from Docker Hub into your new Azure container registry you're gonna have to execute a command okay but before we do that let's go to Docker Hub and then search for the container image we want to import now there is a whole bunch of container images we've been the docker Hub repository okay so when you get into clocker Hub whether you log in or not you can just use there's always a search rule over here you can use it okay or you can click on explore here if you have already logged in and as you can see the most popular container images or the images are listed over here okay now my favorite is the httpd container image okay it allows you to host simple HTTP site okay without any hustle okay so that's what we're going to use so in order to import this into our new Azure container registry do we need to run a command but before that I'm going to click on this don't forget that you can also search for any um Docker Hub container image using the search field over here and just fortunately Define the one that I need over here so I don't need to search so I'm going to click on it and there's a whole bunch of commands over here if you are a new B on containers it can be very very confusing when you get here but I'm going to show you the simple way to do it I have my own cheat sheets that I use because there's a lot of commands involved okay so you can follow along in my steps and then get this done okay so first of all when you get here this is the trick that I use once you click on the container image that you are interested in you can click on tax here and then it gives you some brief hard information over here regarding the image that you want to import it says that this is httpd there's a command here but I'm not going to execute this on the Azure portal okay it says this is httpd column latest okay so there are different different versions of this um Docker container image Okay the reason why I'm showing you this is that sometimes um the latest versions of the docker container image is unstable okay so I'm going to show you how you can cool this Docker image into your container registry on Azure when you get into tags um you're looking out for a Pokemon but I'm not going to execute this in Azure we have a specific command in Azure that we use to import container images into the Container industry that we have on Android I'm going to grab that quickly and dump it here now it's quite a long command but I'm going to take my time and explain to you okay so basically we're going to use the import command import Dash AZ container registry image you're going to run it in the Powershell side of the cloud shell not bash okay this is a Powershell command so you're going to run this import Dash easy container registry image space Dash registry name now this is the Azure container registry that we just created which is you Computing so I'm going to put in here new computing okay that's the name of the container registry that I just created and then you need to also specify the resource Group that the container registry resize and in our situation our Resource Group plus you container okay so you container partial is kind of case sensitive so you have to make sure you maintain your the uppercases and lowercases so let's have a look at something I just want to confirm what I just did so that you don't get confused when I go to Resource groups here we have new containers with an S I nearly made a mistake so you have to double check this if you get the resource Group name wrong you're going to get an error so the resource Group name is you containers our Azure container registry name as your Computing and then we need to specify this parameter over here so that Source registry URI Space Docker dot IO dot Source image space Library forward slash now when you bring this forward slash over here that is when you need to bring the parameter for your Docker image okay so I'm going to go back to the docker Hub and then within the tax tab we have this parameter over here http D column latest okay that is the parameter we need to specify for this image we need to use okay as you can see when you go through the overview that is not over here so you have to come to the tax option they pick it up from here and you don't pick it the whole thing okay if you want to follow along with what I'm doing you just pick the second half of it this one over here okay the same applies to other images that you have on Docker okay if you want to import a different image like let's see Alpine you come here you go to tags and then you don't run this whole command it gets grab Alpine column latest and then you append it to this command that I have given you okay so this httpd is going into a container registry called you Computing inside this resource okay I'm going to zoom in here so that you can have a proper look so I think this is something now I'm going to grab this command over here so I'm going to run this here on our Cloud shell the partial site I'm going to do right click paste and I know I'm going to get an error but I'm going to explain the error in a bit because it's likely for you to face this error so I'm going to go enter here sometimes it will get an error and I'm going to get the solution for you if this error happens okay we didn't have any error but if you get an error from here sometimes is because you have not enabled any administrator for the container registry okay and this is what you need to do when you come across search an error in your after executing this command over here it will have to do with Privileges and permissions you need to enable an admin user for your Azure container registry okay so when you run into an error executing this import command for your new container registry that you've created I think I've already executed this command that is the reason why I'm not getting an error you need to get into the Cloud shell the partial site and then run update container registry space Dash name and then space the value that you're going to put over here is your Azure container registry which in our case is your Computing okay and then you're going to put your resource Group parameter and then the value of your resource Group name which is in our case containers you're going to have to remove this whole thing here and then replace it with that you need to remove this whole thing over here and then replace it with your Azure container registering and then append this parameter Dash enable admin user okay once you execute this command if you press the up arrow on your Cloud shell it's going to bring back the previous command and when you execute is going to go through successfully now what this command has done right now is that it has gone to Docker Hub to import the container image for httpd for us okay now let's go into our container registry which is you Computing and have a look at whether or not the command worked so I'm going to click on our container registry here and then go to repositories now when I go to repositories it shows that we have httpd container image imported now you can delete the repository if you want when you're done with whatever you're doing but once you import a container from Docker Hub into your container registry that doesn't mean that you can start using it right away the next step is creating Azure container instances out of this image that you have imported so this is more of like a blueprint on which the containers you're going to create be made from okay so we are done with the container registry and that's that the next thing we need to do is to go ahead and create a container instance which is the bucket that is going to run our app so I'm going to type in here container if yours is not showing up you can just type in here container and as you can see we have this whatever here that's not what we're going for we're going for container instances that's what we're going to work with today I'm going to click here container instances and then go ahead and create a container instance now when I click on create container instance I'm going to go ahead and click on Resource Group pick my container that I want to place this container instance in and give it a name I'm going to call this one httpd 01 okay and then you can depending on your requirement set your region type the availability zones and availability options that you want but when you get to image source okay if you're a new person and you have not successfully imported any container image from Docker Hub into your container registry you can use the quick start images that Azure provides you can switch to Azure container registry here and as soon as you get to the site it says something here that you compute in okay because that is the only container registry that you have on Azure now I was looking forward to this error message okay as I mentioned earlier on you're going to come across an error message like this sometimes when you are running the import command but I didn't get it I got it here it says admin user must first be enabled for this registry in order to access blah blah blah okay so the fix for this is what I have just given you you need to run the update AZ container registry command using this parameters so so I'm going to just fix in here my value for my Azure container registry name to simple copy and paste and then put my Resource Group name Ctrl C and Ctrl B ased I will lift this command from here and launch my cloud shell okay now I'm going to go ahead and Ctrl C here to clear and then right click and paste okay now when I paste my command and go for the enter key once it's successfully executed I'm going to minimize this and then we'll start this from scratch okay I'm going to jump back into container instances and then click on create container instance you can use this option you can use that option in one works fine and I restart it all over again I'm going to select my Resource Group give it a name I'm going to call this httpd01 and then leave the default region and availability options switch the radio button to Azure container registry and this time around there has disappeared it's okay so if you come across that if you're a first time user of containers on Azure that is how you're going to fix it my one and only container registry has been listed One and Only Image I have imported from Docker Hub has been listed which is httpd and this is the latest version okay I'm going to leave the default OS type to Linux in fact when you're dealing with containers using Linux is better you don't mean I'm sorry Microsoft okay so the size of your container you can make adjustment over here you want if you know your container is going to be accessed by thousands and thousands of users you need to give it more compute power okay but this is just for testing so I'm going to just leave the default go next I'm going to go ahead and specify the networking type I'm going to place it on public for now it says it will create a public IP address for my container this is what I'm looking for now there is an optional requirement over here you can put in a DNS name okay in my case I'm going to put in here a Computing and if it matches the character requirements everything checks green here and if you require setting ports to be opened on this container aside the default or TCP Port 80 for HTTP you can add it here but in our case we're going to leave the default goal next here and then this is a restart policy in case the container fails what should it do the default policy here is restart on failure okay so the container is going to automatically restart when there is a failure okay you can change it always going to leave the default and go next and then leave the tags alone go next and go ahead and create my first container instance once that is done we're going to move on to the next step okay so the container instance has been created you're going to click on go to Resource here within the overview of the container instance it gives you a couple of options you can stop the container unlike Azure app service which even if you stop it is still incuring costs for container instances when you stop the container from running it saves you money now it gives us a public IP address over here gives us an fqdn which looks very horrible by the way okay but this can be changed later okay if you're using it for production environment so I'm going to copy the URL test it first when I click here and go paste and go it says it works so our container is actually working the deployment was successful when you copy the public IP address to when you try it works fine this is the easiest part now we know containers can host web apps and websites and other applications this is a default page on this container instance what if I have a website and I want to host it within this content how do I do it that is where the challenge begins okay but I'm going to show you the easiest way to do it most people build their own images using a Docker engine on your desktop with their application and everything in it and then push it to azure's container registry when it goes into the Container registry and the use that image they have pushed the container registry already made by themselves containing their web pages and web apps and then they use it to create a container instance automatically they get their result okay but if you're not good at building your own images using a local engine then you can use the already made Docker container images and then tweak it push suit your need okay like what we are about to do so how do we even get access to the internal part of this container instance now when I scroll down here you see that we have settings when I click on containers here we have the option here to first of all check the status of the container it says that the container is running which is good when you come here it just stopped whoever that is accessing Pages or apps from this container I want to have access to it okay so you have to make sure it's always running and then when you go to properties it gives you a brief information about how the plots have been configured how much how much CPU and stuff you have on it when it Go unlocks here it basically shows you activities that is happening on this container now in order to get access to the internal part of this container you need to go to connect and then you can select bash shell and click on connect now now when you click on connect it gives you a CLI giving you access to the container okay now this page that we are looking at over here is running on a lightweight OS in this container okay and when I go to Containers here my settings and click connect then I enter my shell this is the OS that is running the container text-based OS is at Linux OS using the Linux account okay now when I list the directory content of this for this container by doing LS it tells me we have a couple of folders over here and we have this folder called he docs okay now itchy docs in terms of web servers is basically the directory where web pages are kept okay if you're hosting a site so this website that we are looking at right now is running inside this directory okay so we're going to change directory into it by doing the AC docs and then press enter here now when I do LS again and press enter it tells me we have index.html and it's this index.html that is actually doing this Mark okay so if you want to replace this whole thing with a production website or a project that we have developed ourselves then we need to find a way to push our code into this directory okay which is what I'm about to show you next I do have a website over here that I have developed I'm not a very powerful developer so I made a simple HTML site okay that we're going to push into this container and make it accessible to the world so I'm gonna just double click this so that we can have a view of how the site looks like it's supposed to be a finance system so it's not a full-blown Finance system okay just a plug right okay as you can see so when I click on home I click on transaction I click on this I click on check balance everything is working fine now how do we get this our already developed site into this container on Azure that is when GitHub comes in you can go to GitHub and then sign up using your email address login and once you log in it gives you the option to create something like a code repository okay I already have an account on GitHub so I'll sign in with my credential if you sign in with your credential all you need to do is to click here create your position if you haven't used GitHub before it's pretty straightforward you click on create repository and then you give it a name I'm going to call this you public okay because I'm going to make it accessible to the general public okay if you want to make it private you can just switch the radio button from here to private but I'm going to make it public because if you are a new user on GitHub and you put it on private authentication gets in and you have to put in username and password and it gets more sophisticated but for demonstration's sake if you want to try this you can just leave it on public and go create your repository now once your work receipt is created I know if you are not a developer this looks very scary but don't worry I'm going to take you through it step by step so once the repository is created for some reason if you hit this button over here again and you are lost okay you can go ahead and then click on the repository that you just created and it takes you back to the same place what you need to do is that you need to install GitHub desktop version okay and then you can go ahead and set it up here so I'm going to go ahead and open a new tab here go to google.com and search for GitHub when I click on GitHub desktop it's going to give me an option to download the desktop version of GitHub once it's done I'm going to get it installed and I'm going to show you how you can push and code so I'm going to click on GitHub desktop to execute it GitHub desktop is being installed as you can see down here once the installation completes it's going to give you the chance to sign into GitHub okay the same credential that you used initially to sign in on the web you can use the same thing here so I'm going to click on sign in to GitHub and then click allow and click open now it signs me in automatically into my GitHub because I have already signed in on the web so I'm going to click on finish here and then it tells me you do have a repository right so I'm going to click on my repository here and then click on clone my repository when I click on clone repository it is going to go into a local path within my documents folder and create a clone there for me so I'm going to click on clone here once this is done you can just minimize your browser and go look for the directory or you can click on show in Explorer here and it's going to take you to the directory that has been created to sell as a clone for your GitHub repository once you gain access into this clone directory you can just open up your Webroot on your local machine copy your code and then paste it in here right the next thing that you need to do is you need to go back into your GitHub desktop and then commit your changes to the main old repository okay now I'm going to give it a summary here by saying version 1.0 and click commit to me this is going to make sure the files that I've just placed in there will be prepared for push okay now when I click on publish here Branch it's going to push the code that I have placed in the directory for my GitHub on my desktop which is this one over here it's going to make sure it is pushed to the cloud or the web one okay how do I know it has been pushed when I go to view on GitHub here on my GitHub desktop it's going to take me to a direct tree well my code is residing so my code is online now once you get it into GitHub the next step is pulling it from GitHub into this HD docs on your Azure container installs okay some container instances support GitHub but in my case this container instance doesn't support GitHub so we will need to install GitHub using the APT command so I'm going to grab my command and paste it the first thing that you need to do in your container instance before you use GitHub is to install git if it doesn't already exist so before you install it you need to run apt update some container instances require that you use sudo in front of the command so if you execute it and it's not working just put s-u-d-o in front of the command before you execute so I'm going to run apt base update go enter and then go ahead and install my git this will enable us to run git commands here so I'm going to get git installed by pressing capital Y here go enter and get get installed I'm going to run LS here it tells us we have index.html which is what is currently running the default web page okay I don't want that so I'm going to get rid of it I'm going to do the RM index.html enter to get rid of it we'll do LS again as you can see it's gone okay now the next step is to use git command to pull my code from here into this directory so I'm going to use the Clone command git clone command to pull my source code from GitHub into this if she dock directory so I'm gonna just copy this and paste it here now if the First Command that we use to install git doesn't work if you try to execute this command it's going to fail okay so you need to make sure git has been installed okay this is going to go through my GitHub it's my GitHub name and this is my software procedure and I'm going to press enter here to retrieve my code from my code repository now it's been transferred from GitHub into htdocs so I'm going to just run LS here to see the content of this directory now it tells me that it has transferred you public directory okay now this in a testing environment is okay but in production environment it's not good because let's have a look I'm going to refresh this when I refresh it just shows the directory you public then when you click on it the page load that's not what you want you want basically decide to load your app directly when somebody goes onto this address here so I'm going to fix this let's fix it together I'm going to go back to the Azure portal and this is what I'm going to do I'm going to just copy the contents all the content from the public directory that has just been placed here into htdocs so this is what I'm gonna do put together a command so I'm going to copy my command and then just put it in here okay I'm going to explain to you so this CP command is just for copying so you can add this Dash R parameter and then it's going to go through my directory as you can see this directory matches what we have over here USR local Apache HC docs in public okay so you public is inside htdocs and what this command is going to do is that it's going to go into this Source you make sure you bring forward slash mysterious means all that means I'll pick everything in the public folder and then dump it in HC docs okay so I'm gonna go ahead and do this paste it here and then go enter okay it does start now let me do LS over here as you can see our pages that we need for our application to run including the index.html the new version is up and running so if somebody goes to this containers public IP address or fqdn you should load the website now when I copy this and then paste it here it loads my site okay so this can be a full-blown website with CSS and JavaScript and everything and it's going to load fine this is basically how you can host your web apps and your website in an Azure container instance with the help of GitHub okay and Docker Hub thank you very much for watching this video If you like this video please like it and share with your friends and subscribe to my YouTube channel I'll see you in the next video

Channel: uComputing

Views: 1,040

Keywords: Windows 10, Windows 11, Windows Server, Microsoft, uComputing, Ghana, Africa, Azure, USA, India, United Kingdom, University of Manchester, University of Greenwich, IT Pro, CompTIA, Network, Cloud Computing, Computer, Computer Science

Id: nWFKy84sUX8

Length: 32min 39sec (1959 seconds)

Published: Mon Apr 24 2023