About Session:
In this session, you will learn how to use Docker containers as a full featured development environment using Visual Studio Code and docker desktop for Linux containers.
Register to event via MeetUp: https://www.meetup.com/azureusergroupsundsvallsverige/events/288307989/
About Speaker:
Ashish Singh Baghel is a digital technologies professional, passionate, curious and learning about modern technologies. He works as Azure Cloud Architect, DevOps Consultant at Tata Consultancy Services
Ashish is also a community member of Azure User Group Sweden. He shares and speak about DevOps, automation, migration and modernization of business applications and IT processes.
Socials:
Twitter: https://www.twitter.com/mechDeveloper1
LinkedIn: https://linkedin.com/in/baghelashish
Blog: https://techhackswithash.com/blog/
Show More Show Less View Video Transcript
0:30
Hello, welcome to Azure User Group Sweden. And thank you so much everyone for tuning in today
0:39
Hi, Håkan. How are you? Yes, I'm fine. How are you? I'm great. Thank you. It's a sunny day
0:45
actually here outside here in Sweden. How is it on your side? It's sunny, but it's a little bit
0:52
chilly today. Yes. And I hope that you're having a great day, everyone that are watching or
0:59
tuning with us today. And before we start, let me just introduce ourselves. So let me introduce my
1:08
co-community leader, Håkan. Håkan Selvornagel is a manager in AI and big data, and he is also a
1:17
Microsoft AI MVP based in Norway. And he is also a community leader of, of course, Azure User Group
1:27
Sweden and also two other user groups as the Norwegian.NET user group, AI42
1:36
And he is also a public speaker and very active in the community
1:42
And yes, thank you, Håkan, for being here. Thank you, Jona. So Jona Andersson, she is based in Svenswell, Sweden, and she works as a software engineer
1:54
at Forefront Consulting. And she is also an Azure MVP, a Microsoft certified trainer
2:00
She is a mentor and an international public speaker. And she is right now writing her first book for O'Reilly
2:09
And what is the book about, Jonah? It's about Azure, of course
2:14
Yeah, very passionate about Azure. Yes, thank you so much, Håkan, for the introduction
2:21
Today we have an interesting session coming, and it's going to be about containers as a development environment
2:30
But before we introduce our speaker and bring him to stage, let me just inform everyone about our code of conduct
2:39
So we would like to remind everyone to be nice and friendly
2:46
listen with purpose and be thoughtful, be respectful to others, seek to understand and not criticize
2:53
be curious and open to share your ideas and be inclusive and respectful in your comments
3:00
or questions and if you have uh questions uh or feedback about the code of conduct feel free to
3:08
visit this link or contact me and hokan and also um we will be sharing a learner badge to those
3:19
that are learning with us today. So we will show this again also later for the Azure Heroes
3:28
Fika is also coming after our session. So he would like to join us later
3:34
You can save this QR code or link already to get a chance to mingle with us
3:40
and also to ask direct questions to our speaker. All right. Without further ado, let me just introduce our speaker
3:53
So our speaker today is very special because he's been part of our community for the past year and he's been joining us in all of our sessions
4:04
So our speaker today is Ashish Singh Bagheel. He is a digital technologies professional who is passionate, curious about learning modern technologies
4:21
And he works as an Azure cloud architect, DevOps consultant at Tata Consulting Services
4:29
Ashish is also a community member of Asher User Group Sweden, and he shares and speaks about DevOps automation, migration, and modernization of business application and IT processes
4:45
So without further ado, let's bring Ashish finally on stage. Hi, everyone. Hi
4:53
Hi, Ashish. Hi, Jonna. Hi, Haken. Hi, everyone. It's so good to be here today as a speaker
5:03
Yes, we are happy to have you. We are very happy to have you. Yes
5:07
Yeah, I'm really excited, very happy to be talking. I have attended a lot of inspiring sessions in this meetup group
5:16
So, yeah, looking forward to present what I'm working with. Yes, yeah
5:21
And I believe Hoken Ashish is the second speaker, I mean, community member that we have that started speaking and sharing knowledge, right
5:31
First was Audrey, and then now we have Ashish. So, yeah, we're excited to have you
5:38
So let's bring your presentation on the screen. And yes. All right
5:48
Let's remove ourselves, Hoken. All right, perfect. I think I can start with my talk. Yeah. Perfect. So before starting
6:03
my presentation, I always like to show one of my projects, which I have configured with
6:09
the development containers. So yeah, let me show you a virtual machine. So I have recently
6:16
created this Windows 10 virtual machine and yeah I would just like to show you that this virtual
6:24
machine there are not a lot of softwares installed in this VM. It's a very simple very new virtual
6:31
machine. So as you can see it has Docker desktop installed. It has Git installed. So Docker desktop
6:37
I need it to run Linux containers. Git I want it to push and pull my changes. So these are the only
6:44
two main softwares installed and I have of course uh visual studio code where I which is my favorite
6:51
editor all right so yeah just uh just so that you know that uh this is a very new basic machine and
6:58
I don't have any development uh softwares here like uh like I don't have python so like if I'll
7:05
type python dash version nothing will happen because python it's telling me windows is telling
7:11
me Python not found right similarly I don't have node as well right so no
7:16
development software development kits are available on my on my machine yeah so
7:23
let just yeah so I will just quickly show you something so this is my github repository okay and what I do I will quickly click on one of my projects okay so this
7:37
is one of my github repository blog projects so yeah this is my personal
7:43
project I'm working on to create my own personal blogging website so I want to
7:49
show you what happens when I click on this badge in my repository. So as you can see I have this
7:56
badge called remote containers open. I can zoom in a bit so that it's visible. Yeah so let's just
8:03
see what happens when I click on this badge. Okay so yeah so as soon as I click this badge
8:08
it automatically started visual studio code right and now it will do a lot of stuff in this machine
8:16
So, VS Code will use Docker Desktop and files present inside my repository to create a development container environment for me
8:26
Right? So, as you can see, this is doing, a lot of stuff is happening
8:31
So, I can quickly start the logs so that you can see the logs
8:35
So, as you can see, it's pulling base image, right? Creating configuration
8:42
And on the bottom corner, you can see it's opening remote. Right
8:45
So this is interesting. So we will just wait for a couple of seconds more and we will see what happens
8:52
Yeah, so as you can see it has now loaded my entire
8:57
repository inside VS code and On the bottom corner, it says dev container node.js. So this is cool, right
9:05
Just by clicking a button my entire repository is cloned My development container is up and running and I can quickly click on plus icon to get a bash
9:15
session and let me just see what it is. So if I'll do host name
9:20
So as you can see, it's giving me a container ID as a host name
9:25
Right? So if I'll do you name dash a, so this is a Linux command to check the version
9:31
So as you can see, it is now telling me that this is a Linux container
9:35
and it's running on Windows subsystem for Linux. Right? How cool is that
9:41
As you can see now, I'm getting a notification that my application
9:45
running on port 8000. So let's see what happens when I click on open in browser. So let me just
9:51
quickly click on this button and there you go. My website is up and running in my development
9:59
container environment. So how cool was this right? So this is what my talk will be. This is what I
10:07
will talk about today. That how you can set this up. How you can configure your projects
10:13
to be running inside a development container. And this is very cool, right? You can just clone
10:20
your repository. You can open it in any machine, right? So, yeah. So, yeah. Let's start my talk
10:29
with this. So, yeah. Hello, everyone. My name is Ashish. And today I'll be talking about
10:38
containers as a development environment, how you can use containers to develop on them
10:46
I will specifically talk about Visual Studio Code Remote Containers Extension because this extension
10:52
helps you to configure your projects, your repositories very easily. First of all, who am I
11:02
A little introduction about me. My name is Ashish Singh Vaghel. I work as Cloud and DevOps
11:07
consultant. So I'm originally from India. I'm currently living in Oslo, Norway and currently
11:13
working for one of our major banking clients here in Oslo, Norway. So I mostly do automation
11:19
Azure DevOps. I work a lot with Windows containers and we are also working a lot in
11:25
migrating and modernizing our business applications. So if you are interested in any of these things
11:32
please feel free to ping me on LinkedIn. You can get all the links on my website. You can also scan
11:39
this QR code so that you have all the links, my Twitter, GitHub, LinkedIn. So just feel free to
11:46
message me if anything interests you and you want to talk about it. Perfect. So now let's talk about
11:55
developing inside container so containers are very powerful i mean we all know containers have
12:02
almost taken over taken over the development world right it has drastically changed how we build
12:09
application how we ship them right so now containers there's there's this new thing coming
12:16
up that containers now developers are utilizing it as development environments full feature
12:21
development environment. Everything you need for your development, you can install it inside
12:26
container. And Visual Studio has given us very cool container extensions using which you can
12:32
seamlessly integrate your Visual Studio code features inside your container. So I will show
12:39
you this today. I will show you how you can use Visual Studio code and Docker containers as for
12:45
development so you can run any application inside development container and you can separate your
12:51
tools libraries run times needed for working with a code base right because many times you you install
12:59
different different softwares to develop a different code base right so let's say if you
13:05
want to develop a web application you will probably install node.js right if you want to develop an
13:11
API, you will probably install .NET, right? Let's say if you want to do a setup or testing
13:18
you'll probably use Python, right? So there are so many different tools and technologies available
13:23
and it's kind of better to, you know, isolate them, right? So this is what development containers
13:31
help you to do. So let's say if you want to work on Python application, spin up your Python
13:36
container environment development environment and start working on your python application. Let's say you don't want to work on python, stop your python development container
13:46
spin up your java container if you want to develop any java application, right? No need to install
13:52
anything on your local operating system. You can install and set up everything inside container
13:57
which kind of keeps your windows systems clean, right? So this is how it looks. As you can see in
14:04
in this slide that you have your infrastructure, then you have your operating system
14:09
This can be Windows operating system or Linux operating system. And then you have Docker, which is my container runtime
14:17
And we can have different containers running in my machine, separated isolated containers
14:27
So this is how it looks. And I will talk briefly about how this technology works
14:32
So yeah, first of all, you have your local operating system. In my case, this is Windows 10 machine
14:38
but it can be any machine. All right, it can be a Linux machine
14:43
it can be a Windows machine, it can be Mac operating system, any operating system. Yeah
14:48
So in this local operating system, what we have, I have Visual Studio Code installed
14:53
All right. And then what I will do I will spin up a container All right And inside this container what what so VS Code has this very interesting feature that it can have its UI portion running on a separate machine
15:07
and it can have its server portion running on a separate machine
15:11
and it can, they can talk. So this is what makes this development containers possible
15:17
that if you're using VS Code, you can have your user interface part of VS Code running
15:23
on your local operating system. and you can have your server part of VS Code running inside a container
15:30
Now, that is pretty cool, right? So this is what using this, what you can do
15:35
you can install your VS Code extensions. You can install them inside container, right
15:41
And everything related to user interface and themes, it will be available inside your local operating system
15:49
All right. And then inside container, we will have our source code
15:53
inside container. Container has its own isolated file system. Container has its own isolated terminal processes
16:00
Container will have its own isolated application running and it will have the debugger attached, right
16:07
So this is how a development container works actually. Yeah. So everything you need for development
16:15
it will be available inside a container. Perfect. So now what do you need to do this
16:23
You don't need a lot of softwares. On Windows machine, you just need Docker Desktop
16:27
and WSL2 backend to spin up Linux containers. Or if you have a Mac, you only need Docker Desktop
16:34
If you have a Linux machine, you can install Docker Community Engine and Docker Compose
16:40
That's all you need to use this. So yeah, I think this is the best part
16:48
which everybody is waiting for. We can talk a lot, but demo is something different, right
16:53
So yeah, what I will do right now is I will try to configure a development container environment
16:59
right in front of you from scratch so that we can see how it works
17:04
All right. Perfect. So, okay, let me try to connect to my..
17:12
Yeah, let me try to connect back to my virtual machine so that this is just to make sure
17:17
this is just to show you that I'm working on a machine which is completely new there is nothing
17:23
pre-installed inside my machine yeah and if anybody has any question please feel free to interrupt me
17:30
in between post your questions comments if you have any confusion just feel free to send them
17:36
in the chat and I'll be happy to answer it okay all right perfect so yeah as as I have shown you
17:43
already I don't have any softwares installed on my local machine so I will show you again. If I'll
17:49
do python dash dash version nothing will happen and windows will complain that python is not in your
17:55
machine. So yeah we will set up a python development environment inside a container
18:02
Okay yeah so first of all what I want to do I want to clone a github repository. Okay
18:08
So let me just quickly clone it. Yeah, let me just try to
18:17
Yes. So as you can see, this is nothing but a simple git clone command
18:22
And it is pulling a Microsoft repository named mslearn python products. Okay
18:29
So yeah, what I will do, I will open it inside code, GitHub code spaces
18:34
So let me just quickly do that. And right now this repository is present inside my Windows operating system, right
18:43
This is not inside any container or anything like that. This is just a normal setup, right
18:49
Let me quickly open a terminal. So yeah, I hope this is visible
18:54
Yes, perfect. So as you can see, this is my repository in VS Code
18:59
And I have a PowerShell terminal available to me. But, and this is a simple Python project, as you can see
19:05
and as I also want to show you that this is a web application Flask which uses a Flask framework
19:12
all right so yeah we will set up we'll set up a development environment for Python okay so but
19:20
before that let me show you what you need so I talked about VS Code extension so this is the
19:26
remote containers extension which you will need so whatever commands whatever demo which I will
19:32
show you it is possible because of these extension called remote containers so yeah you have to make
19:39
sure that this is installed on your vs code yeah you can simply search it on extensions and you can
19:46
install it yeah so but yeah now since i already have this remote containers extension installed
19:54
and i have my repository available inside my local machine so what i will do i will press f1
20:01
in my keyboard. So as soon as I press F1 in the keyboard it opens this command
20:07
palette. Alright and in this command palette what I will do I will search for
20:14
add dev container. Yeah so as you can see it's giving me an option add
20:18
development container configuration files. So this is the power of this remote containers extension that you don't have to do anything manually. This
20:29
This extension will help you set up your project and it's just click, click, click
20:33
Everything is automated. So, it's like very simple to get started. So yeah
20:39
So what I will do in my repository, I'll add this development container configuration files
20:44
And as you can see, as soon as I click that, now it's giving me a lot of options
20:50
So it's a lot of pre-configured development configuration environments. It's showing me that you can use Python 3
20:57
You can use Python 3 with PostgreSQL. You can use Anaconda, Miniconda, or if you want
21:02
you can also start with a simple basic Ubuntu image. All right
21:07
But these options are coming up based on the files present inside my repository
21:12
So since it's a Python project, it's showing me all the Python options
21:16
but you can also click on show all definitions. So if you'll click on show all definitions
21:20
it will show you all the available development container images which are available to you
21:26
Okay. So these are predefined images, which are, which is available. So as you can see, you can use Azure C++, Dart
21:34
Go, any Java. So like you have tons of options, R, Ruby, everything available to you
21:42
But for now, this is my Python project. So I will try to use the development environment for Python
21:48
So what I'll do, I'll quickly click on this, select this Python three. Now this extension is asking me which version of Python you want
21:57
So for this project, I'll choose Python 3.1. Now it's asking me if you want any Node.js version inside your development container
22:05
I will select none because I don't want Node.js. And now VS Code is asking me that if you want any additional features to install
22:16
So now this is very interesting because when you have a developer machine, you install
22:21
lot of softwares along with software development kit right which helps you in development for example you install git because git helps you to push and pull changes to github repository let say if you working with azure you might install azure cli on your
22:36
local machine right so yeah so like that you can install a lot of additional softwares which you
22:42
want so this screen this is predefined scripts which visual microsoft gives you so these are
22:49
pre-configured scripts by Microsoft which you can use to install common softwares for development
22:55
So as you can see it's giving us options to install SSH server, you can install Terraform
23:01
if you're working on any infrastructure project and it also gives you an option to install a
23:07
lightweight desktop for your container. Yeah but for now for this project I only want git because
23:13
I want to be able to push and pull changes so I'll select that and for git version I'll select
23:18
OS provided and that's it. This is all I did just click click click and as soon as I did this as you
23:27
can see this has this has created a new folder inside my repository. So this dev container folder
23:33
is new and now newly created available on my machine and it as you can see it has two files
23:39
it has a docker file and it has a dev container dot json file. So we will talk about this dev
23:45
container.json file in detail. So this is actually used to automate the configuration of your project
23:51
So we will do that in a while in this demo for this project. But for now let me talk about this
23:56
Docker file. Okay. So as you can see this Docker file is very basic Docker file. So what I'll do
24:03
I'll remove all these comments first so that this Docker file is clean and it doesn't confuse us
24:10
So as you can see this Docker file has is very simple Docker file, right
24:16
It just has one single from instruction that it needs to pull this base image from Microsoft's
24:23
container repository. That's it. There's nothing else in this Docker file. It is plain and simple
24:30
And if you'll see this devcontainer.json file. So let me just zoom out a little bit. Yeah
24:37
this devcontainer.json file you have a lot of configurations which you can use to customize
24:43
your development container. So whatever options we have selected, they are available here
24:48
So as you can see in this in this features option, since we selected git to be installed
24:54
and we selected OS provided, this is available here. And we have we have used a predefined
25:02
container, development container image. So that's why it has, it is using, it is using this name
25:07
Python 3 and it has already installed some extensions for Python, right? So yeah, but we will
25:14
talk about this file more in a while, but for now what I will do since I have this dev container
25:21
dev container configuration already available in my, in my repository, what I'll do, I will open this
25:27
repository inside container. So right now this repository is inside my local
25:32
operating system but I want it to be inside a container where Python is
25:37
present, right? So I will press F1 and it will give me command palette and I'll
25:41
select reopen in container. So yeah as you can see this option is coming up
25:47
reopen in container so I will click here. Okay now if you'll see VS code will
25:53
start spinning up my development container based on the development configuration files which we
26:00
have recently added. So let me just quickly open up the log so that you can see what is what it is
26:06
doing. So it's doing a lot of cool stuff. It's building my image right. It will pull up the
26:11
Python base image from Microsoft repository. It will install extensions for a Visual Studio
26:16
code which for Python and it will install git as well. It will do all that stuff and it will
26:23
give me that remote container for development right how cool is that and yeah by the time this
26:30
is uh this is starting so this is very useful right because you don't have to spend time on
26:36
setting up your you know development environment in a new machine so for example this this development
26:43
container configuration this is version controlled in your repository right and since this is version
26:50
control this you can check it in github and anyone can just pull this repository and he can spin up
26:56
his development container and he's ready to go whatever tools he wants he it will be available
27:02
inside this development container whatever tools are required for development but uh yeah i think
27:08
for now i think this uh this uh this extension has done its thing so now as you can see in this
27:14
bottom corner it's telling me that you are inside a dev container python 3 development container
27:19
all right so let's just inspect this container what so I'll click on this plus icon and as soon
27:26
as I click on this it will give me a batch session okay so let's check where we are so I'll type
27:31
host name so best thing I do I type host name just to check the whether I'm in my local machine
27:38
so yeah if I'll do it if I'll type host name in powershell it will print out the machine name
27:44
right? It's telling me it's win 10 PC 001 but if I do a host name here in this bash session
27:51
it's telling it tells me that it's a container ID, right? And let me do uname dash a and this
27:57
will tell me that you are running on Linux. You are running on WSL2, right? So this is a WSL2
28:04
container actually which is available to me. But yeah, again let's check whether Python is available
28:10
because python is not on my local machine right. So let's do that again python dash dash version
28:16
It will fail because python is not on my windows operating system but python is available on my
28:24
development container. So let me just do this and as you can see it's giving me that python version
28:30
3.1.0 is available to you for working. Sounds cool right. Okay so now since this is a
28:39
a python project and this is a flask project i need to install this flask dependency
28:46
but for now i will do this manually but i will also show you how you can automate this dependency
28:53
installation in devcontainer.json file so you can specify this configuration in dev containers so
28:59
that every time when your development container is available it will run this command to install your
29:06
your dependencies so we will see that in a while but for now let me just quickly install this
29:12
dependency so i will do pip3 install dash dash user r requirements.txt yeah so let me just quickly
29:24
install this flask framework perfect so now flask framework is available and i will try to run my
29:32
application okay so I will do Python and then app.py and perfect as you can see
29:41
as soon as I did this it has started my development server and it is telling me
29:46
that your application is running on this IP and this port and let me just quickly
29:52
show you that VS code is intelligent enough that there is a process in
29:56
running inside your container and it has automatically forwarded this port 5000 from inside container to my local IP
30:06
So this 5000 port is now available for me so I can quickly browse it and it will open
30:12
up my browser and as you can see my Python Flask application web application is up and
30:18
running inside a container Linux container on my Windows 10 machine. How cool was that? Right
30:27
Yeah, let's see a couple of more things, okay? Because there are a lot of stuff which you want to do
30:34
with your development environment. You want to install a lot of software. You want to install a lot of extensions, right
30:39
You want all these commands to run automatically, right? So yeah, let's see how to do that
30:44
So what I will do, I will quickly open this devcontainer.json file
30:48
and we will go through this file together, okay? So that we understand it and we will configure our project
30:54
automate our project using this file. Alright, so first section is like name. So you can change it
31:02
to any name. This is Python 3. So I will add, I will give it a name Python 3 Ashish, just, just a
31:08
random name. And as you can see, this is Docker file. And this Docker file is actually this file
31:13
which this devcontainer.json is pointing to. Alright, so this, this, this is pointing to this
31:19
Docker file. So whatever instructions you have in this Docker file, it will build them using this
31:27
devcontainer.json configuration. So as you can see in the argument, it is passing that
31:32
Python version 3.10 needs to be pulled from Microsoft's container repository. So it is
31:40
pulling that base image based on this configuration. So I can change it here. Let's say if I want to
31:46
install python version 3.9 3.8 anything so i can simply change it here and my development container
31:53
will pull that specific version of python okay and node version is none because we have selected
31:59
we don't want node.js let's talk about this customization section so in this customization
32:04
section you have this first section called vs code so this section settings sections you know
32:11
it is to map your VS code settings inside container. So you don't have to worry about
32:17
this section. You can keep it which is like pre-populated. Okay. I don't personally map any
32:24
settings, any VS code settings from my local machine to container, but you can do that. Okay
32:29
So since we have picked a predefined configuration from Microsoft, Microsoft has already given us
32:36
given us these settings, right, that are automatically mapped from my local VS code to
32:43
VS code inside to my container, to the files inside my container. Yeah, so you can just keep it
32:50
pre-populated, which is there. And now there is this extension section. So in this extension
32:55
section, you can specify as many extensions, VS code extensions, you want inside your container
33:02
because extensions is what makes VS Code what it is today, right
33:06
Extensions is what everybody wants. Everybody loves it. Everybody wants to work with extensions
33:12
Yeah. So for this particular project, I can actually show you this is actually a Python project and it uses Jinja syntax
33:20
So as you can see here, this is Jinja syntax and there is no syntax highlighting here, right
33:27
So this is just a plain, simple black and white text coming up. So what I want, I want that syntax highlighting to come back in my VS code
33:36
So what I'll do, I'll go to extensions. I'll search for Jinja and let's just see
33:43
So as you can see, the top most extension, this is the Jinja extension, which I want
33:48
So as you can see, it has 4.3 million download, a very decent rating. So I want it inside my container
33:54
Okay. So what I'll do, I'll click on settings. I will copy the extension ID
33:58
I will go back in my project. I will click on devcontainer.json and I will add this extension
34:06
So this is an array. So I can just paste this extension ID here. So similarly, you can add as
34:12
many extensions as you want for your project. Okay. So we have added this whole Lord Jinja extension
34:20
So next time when we build this image, next time when we will restart this container
34:25
it will pull up this Jinja syntax extension it will install it inside our container development
34:31
container and this extension will be available for us to work with how cool is that right and
34:38
then there now then yeah this forward port section we have so in this section you can define if there
34:44
are any specific ports you want to map between your container and your local operating system Right
34:51
So, yeah, if you want to map any for, so for example, for this demo, VS code was intelligent
34:59
enough to detect our port 5000. So we didn't have to specify it here, but there can be cases sometimes where when VS
35:07
code is unable to detect any process running inside your container, or if you want any
35:12
customized port to be forwarded, you can specify them here. now I will leave it blank because VS code is automatically forwarding 5000 for me. So I don't
35:23
need to worry about it. Yeah. Next we can specify some commands, post create command. So I talked
35:28
about this, right? So we had to install this requirement.txt flask framework, right? We had
35:34
to install it manually when our container was ready, but you want to automate it, right? You
35:40
You want VS code to do this. So I will uncomment this section
35:44
Okay, so this is the post create command. So what it will do, it will run this command PIP3 install command as soon as our container
35:53
is created. All right. So as soon as Docker builds our container and build finishes it that means that our container
36:03
is now available. And now as soon as our container is available, we because of this VS code dev container dot
36:10
JSON settings VS code will automatically run this command inside your container so that
36:16
you don't have to run this pip3 install command again and again
36:21
One more thing I want to do I want to specify another command post start command
36:27
So what this post start command will do it you can specify any commands here which you
36:33
want to run when your container is available when your container is created when your create
36:39
command has run then when everything is available inside container you want to run you want to
36:45
run some commands right so what I'll do I'll specify this command over here that I want
36:51
my container to start the python development server automatically okay so this is exactly
36:58
what I'm doing here so it will do nothing it will just run this command and it will
37:03
give me a text file in the repository with all the output so we will see what happens okay for now
37:11
I will just give a post start command so that every time my container is available my python
37:18
development command my path and development server is up and running so that I don't have to type it
37:24
manually all right so yeah now this remote user so this is the remote user for your container So the container which is available to me it is currently running as this VS Code user
37:39
So if you want to run as root user for your container, you can comment it out. But for
37:46
now, I am fine with this. I want to run my container as VS Code user. So I will keep
37:51
it like this. Yeah, and then the features it's like these are pre pre pre pre
37:59
configured scripts which are available to us, right? So yeah, I I will keep git
38:04
get over here just as it is. I don't want any anything else. Alright, so since now
38:11
we have features available we have post create command, we have post start
38:16
command and we also have extensions we have not touched settings. Yeah, so now
38:21
this devcontainer.json file is looking good. Okay, yeah but one more thing. Okay
38:28
so this docker file. Okay, so the best place where you if you want to install
38:35
any additional softwares for your development environment the best place is to install it using this docker file. So what I will do just to show you that
38:43
this is a very basic Debian based image okay so you can use apt-get commands to install
38:51
whatever software you want inside your container okay so what I'll do I'll use I'll give a docker
38:57
run instruction and I will install node.js this is just to show you that you can install any
39:03
software inside your container so what I'm doing I'm using this apt-get command to install this
39:10
node.js version 14. so when i will rebuild this container it will install node.js version and then
39:17
we will see whether node.js is available or not all right so you can specify any software whatever
39:22
you want uh it can be node.js or anything else right all right perfect so now since everything
39:29
is available i want to rebuild my container now so i'll press on f1 and as soon as i press f1 it
39:36
it will I will search for rebuild and as soon as I search for rebuild it gives me an option
39:41
to rebuild my container. So I'll select this because I have made a lot of changes in my configuration
39:47
Okay, so I want this configuration to be applied on new containers
39:52
So I will select this option. And now what it will do now VS code will rebuild our container based on the configurations
40:01
we have specified in our devcontainer.json file and our Docker file. So we can check these logs by the time it is creating, right
40:10
So this is very cool, right? But yeah, for now I'm showing you all this devcontainer.json features locally in a Windows
40:21
10 machine, but I will also give you a sneak peek on GitHub Codespaces that how you can
40:26
use these dev container how you can use your dev container to develop on cloud I mean you you
40:34
don't even need a windows machine to develop I mean you if you have a dev container configuration
40:39
and if your code is in github you can simply use github code spaces and github code spaces will
40:45
give you a terminal in a browser web browser so you don't even need vs code installed you just need
40:51
a browser to develop. But yeah, we will see that in a while but for now let's just see. Okay
40:57
so now as you can see it's configuring our dev container environment and as you can see it has
41:02
run this post create command inside our container. So pip3 install user command is it has been run
41:10
and as we can see this flask dependency is available. Perfect and as you can see this post
41:16
start command has also run. Okay, perfect. So post start command has run and I want to show you this
41:23
nohop.out because this is the output of this post start command which we have specified here
41:29
Right? So we have specified this command to run development python in development
41:34
python as development server. Right? So since we have specified this command
41:39
by VS code has started this has run this command and all the outputs are now coming here available
41:47
here okay and again VS code is intelligent enough and it has forwarded the port 5000 for us because
41:54
our application is running on port 5000 inside container okay so now we will what we will do we
42:00
will quickly try to open it in browser and as you can see this application is up and running on port
42:08
5000 right pretty cool so I didn't have to run any commands to install my dependencies I didn't
42:15
have to run any command to start the development server it's all fully automated how cool is that
42:22
right so we we also let's just inspect a couple of things because we have specified in our docker
42:28
file that we want to install node.js as well right so let's just see whether node.js is
42:33
available inside our container. So what I'll do, I'll do node-version and as you can see node version
42:42
14 is available to me inside container because we have installed node version 14. We have
42:47
given the docker file run instruction right for our development container environment. And also
42:54
we also installed this Jinja extension right Jinja syntax highlighter. So let's just check
43:00
whether the syntax highlighting is back on our html page and yes as you can see this uh
43:07
jinja syntax is now getting highlighted so product.name for loop everything is getting
43:15
uh is getting highlighted so yeah our this looks like our our uh jinja syntax extension is working
43:25
working perfectly fine. So how cool was this fully automated project, your development container
43:33
your Docker file. So this is this is available to you and you can push this configuration in
43:40
into your GitHub account and anyone can just simply start developing. They don't have to waste
43:46
time in setting up their machine for development. They will just pull your repository, open your
43:52
repository in a container and everything will be available to them. How cool was that right
43:58
I absolutely love this feature and I use it for my personal project. So I showed you before starting
44:05
my presentation that I have this block project where I have this docker file and devcontainer.json
44:13
file available where I have configured my my development container environment and you can
44:19
use it for any projects. I mean, I also use this for one of my Terraform projects. So what I have
44:28
done, I have specified this dev container configuration to work with Terraform. So yeah
44:35
you can use this for most of your development projects and it's very cool. Yeah
44:43
So, yeah, that was all. That was all I had for demo
44:47
So let's just quickly check what we did. Let's just quickly revise
44:54
So yeah we have seen how we can use development containers We have configured dev container file using which we have specified extensions which
45:07
we wanted to install. We have specified post create command post start commands
45:12
But for this demo, I showed you Docker file single Docker file, but there can be cases
45:16
where you can install. You can use Docker compose to spin up multiple multiple containers for development
45:23
That is also possible. say if you want a database container as well so you can use docker compose so i'll leave it to you
45:29
to explore try to spin up a development environment using docker compose and i also showed you you can
45:36
pick predefined configuration uh from vs code so the python 3 demo which i showed today for the
45:42
predefined container configuration but you can also use uh anything you can also start from scratch
45:48
You can use a simple basic Ubuntu image and you can install softwares, extensions, whatever you want on a basic image as well from scratch
45:58
And the features options, we have seen that I have used Git features option to install Git
46:05
But yeah, you can install many customized, many softwares which are like very basic for development
46:13
Common softwares are available for you to install inside your container using this features option
46:20
So like Azure CLI or AWS CLI. Yeah. And one last thing, GitHub Codespaces
46:27
So whatever demo I showed you, I showed it to you on local machine
46:31
But GitHub has this very cool feature called GitHub Codespaces. So using Codespaces, you can develop inside a browser
46:38
So as you can see, you can, using this Codespaces feature, what GitHub will do, GitHub will give you a terminal
46:46
And in this terminal, you will have all the softwares and everything available, which you have configured for your development container
46:56
So this uses Codespaces, it uses your dev container configuration to give you the softwares and the terminal which you want inside a browser
47:06
So, but this Codespaces feature, this is not yet available for individual users
47:11
This is only available for enterprises for now, but soon Microsoft, I think, will announce
47:17
it to be available for individual users. So you can use GitHub Codespaces
47:24
But since I have attended Microsoft Build and I have access to GitHub Codespaces, so I can
47:30
quickly show you. So this is my block project. So what I'll do, I'll quickly press on dot
47:35
and as soon as I press on dot this will open my repository inside browser okay and yeah let me
47:44
just quickly wait I will zoom it a bit so as you can see this is a browser and my repository is
47:50
actually available in a browser and I will click on this remote explorer remote explorer option
47:57
and this will list github code spaces available for me so as you can see this blog repository
48:05
has a code spaces. I'll quickly click on connect so that it attaches it spins up the code spaces
48:12
for me. So as you can see now it is using my dev container configuration to spin up a code space
48:18
So this is nothing but a machine running on cloud and I will get the terminal available to me inside
48:24
browser for development. So yeah we will just quickly wait for this code spaces to start up
48:30
And then we will see how cool it is that you don't need anything for development
48:35
You just need a GitHub account and you just need a browser to work on any projects, be it Python, Node.js, Terraform, anything
48:45
Yeah, so as you can see, this is now starting Codespaces. And as you can see in the bottom corner, it's showing me that Codespaces is now available
48:54
And this blog project is now available. So let me just quickly show you host name
49:01
So as you can see host name now, it's showing me as code spaces. And I can show you that node is available
49:08
So I can do quickly node dash dash version. And node version 16 is available for my project
49:14
How cool is that, right? And there's no hop.out. This will show me the output of my development server
49:20
So it is running my development command. And now as you can see, it's telling me that port 8000 is available
49:26
so I can quickly open it in browser. So my blog website, I'm developing it inside a remote machine
49:32
in a GitHub code space in a browser, and I can debug it
49:37
I can inspect my changes by using this port forwarding inside a browser
49:44
So yeah, I thought this is pretty cool, and I was absolutely amazed when I figured out these features
49:51
So I was like, maybe it will be worth sharing it with others
49:55
what I am using and how I am using it. So I'll recommend everybody to try it out
50:01
Yeah. So that's all I had for today. This was my talk
50:07
And if you have any confusion, if you have any questions, you want to reach out to me
50:11
you can do that. All the, yeah, all the links and everything
50:18
are now available to you on the screen. You can also scan this QR code
50:23
it will redirect you to my, yeah, it will redirect you to my, yes, my website
50:34
Yeah, that's all I had. I hope this will be useful
50:45
Yes. Hi. Yes. Thank you so much, Ashish, for the great session
50:52
Yes. I learned a lot. It was very interesting and interactive as well. We have great feedback from our audience from Happy Unicorn. I believe it's Chris. She said, fantastic demo of a really cool, funny functionality. Thank you
51:14
And then Audrey is also saying thank you for your presentation and a question
51:23
So, yeah. I think that's a very great question, Audrey. And I'm so happy that you asked
51:29
So thank you for posting this. So Audrey is saying that she has never worked with containers
51:34
So why would she use containers? Why would she start using development containers
51:40
And that's a very valid question. when does it become a need to use containers for development
51:45
Okay, so Audrey, the problem was like, so let's say if you are working on a big project, okay
51:51
So let's say if I'm working on a .NET project, so I install a lot of softwares
51:56
So let's say if I'm working on a .NET project, I'll install a Nougat package
52:01
I'll probably install Azure CLI and I'll configure it for my use
52:06
So if you're working in a company, you will install Azure CLI and you will configure that CLI to authenticate it with cloud, right
52:13
So you do a lot of customizations. So the machine which you have, it's specific to you
52:19
It's personalized to you. We don't realize, right? We don realize what all things that we are installing in our machine But our machine is a complete stranger to other So if someone else will try to work with your project he won be able to start immediately
52:35
because there are a lot of customization, a lot of configurations, which are manual
52:39
which you will have to probably, you know, tell your partner that, okay, bro, you are
52:45
using node, you are using this.net. So you probably need to install this extension as well, which will help you in development
52:52
You probably need to authenticate using Azure CLI. So you have to install a lot of other softwares along with software development kit
53:00
You have to configure it as per the requirements of your project. So all that can be automated on with the dev containers
53:07
So what I can do, my block project is available. So anyone can just clone it and he can simply run it on containers
53:16
He doesn't need to worry about anything else. So what tools I'm using, everything will be available to him
53:22
So yeah, it reduces the effort for anyone to get started, right
53:26
So you can simply clone a project and start working on improving it, start resolving issues
53:34
I hope that answers. Yeah, I'm sure. I'm sure. I agree also
53:39
I'm sure Audrey also agrees. That's really a good point, Ashish. I did actually while you're showing the GitHub code spaces that it actually tried to do that on my own
53:52
And it's pretty powerful that you could do it in your browser. Yeah, that's great
53:58
We also have a lot of feedback from Dona May Yap. It was awesome
54:07
Also Hogan with us here. Thank you. Great feedback. Great session. Audrey, great
54:17
And just, yeah, from Don. Very good presentation. I will definitely use it with my personal project
54:25
And yeah, just appreciation, Ashish. Very great job. Thank you so much
54:31
Yeah, I'm so happy to see a lot of comments and a lot of feedback
54:36
So thank you so much. And Don, if you feel like, if you are struggling, if you feel like you need any help, feel free
54:42
to reach out to me. I'll be happy to help you with the containers and Codespaces
54:47
So anybody, just feel free to reach out to me. If you need any help or any guidance, I'll be happy to help you
54:54
Yeah. So yes, the question, Ashish here, or a clarification, because with the GitHub Codespaces, is that for free
55:02
or do you need to pay to use it? Yeah, that's a very good question
55:06
So for my case, I attended this Microsoft Build, actually. So during Microsoft Build, Satya Nadella actually announced free access to GitHub Codespaces
55:20
who were registered for Build. So I am using GitHub Codespaces for free, but this feature is not yet available for individual user
55:29
And when it will be available, you'll have to pay for it. So they will charge you
55:34
And I think it will be very minimal charge based on the machine type which you select
55:40
So what I'll do, I want, I will ask you to search for code spaces. Yeah
55:46
So just search for code spaces and you can, yeah, keep an eye on this website so you can
55:53
get all the details, all the instruction which you want. So as you can see, it has like a lot of powerful, you can spin up powerful machines. Yeah
56:01
And yeah, you'll have to pay for it. that's the thing so yeah i think i got a i think i got a preview ashish i think i wasn't also on
56:10
build that's why it worked when i said i just pressed dot yeah yeah but i hope uh i soon
56:17
definitely it will be available for uh personal or private use uh as well yes yeah but we have
56:25
go ahead yeah sorry yeah sorry sorry remote containers is available so you can develop on
56:30
containers on your local machine. So GitHub Codespaces is like different feature, but yeah
56:36
you can develop with containers on your local machine as well. Yeah. Yeah. I said, I just want
56:42
to add to note that as a developer, it's really a great tool, especially that like we each developer
56:49
can have like a Windows, can have Apple or I mean, or Mac. So it makes it easier for us to like get
56:56
started on what the things that we need to do in the development so this is a great uh innovation
57:02
yeah yeah yeah that's true and i just want to show you a couple of more things uh just just want to
57:10
give you a thing about code spaces that using code spaces you don't have to worry about signing your
57:15
code right so signing your code you have to if you want to set up that in your local machine
57:20
you have to install a PGP key, right? And then you have to upload that key inside your, yeah, inside GitHub
57:27
So that GitHub marks your commits as verified commits. So as you can see, I have this GPG keys
57:34
GPG keys available. So signing your code in Codespaces is very simple
57:39
So in my last talk, one of the guys asked that how you will sign your code when you're using Codespaces
57:45
So the answer is very simple. you can just simply check this box in the GPG verification
57:51
No need to set up anything. You don't need any key or anything. GitHub will automatically sign your code based on your identity
57:58
So it's just clicking the selected repository and selecting the repository where you want this signing feature
58:06
And also you can have your secrets attached to your code spaces. So as I've showed you, I have a Terraform project
58:12
So I'm using this Terraform cloud secret, which is getting mapped to my code space so this is specific to me it won't be available to anybody
58:20
else so i can develop and connect to terraform cloud using this secret so yeah i just wanted to
58:27
show you that a lot of different functionalities which you want for development are available to
58:31
you on code space yeah very cool yes thank you thank you all right time is uh running out yeah
58:40
So, before we thank you so much, Ashish, for the great presentation
58:46
I think I will look up the recording and check on your repo to get started
58:52
I myself as well for this. But before we end our live stream, I want to share to everyone the QR code for the Azure
59:04
Learner badge. So, if you missed this one at the beginning of the session, feel free to scan it to claim
59:10
your Azure Heroes Learner badge. If you have time, you are welcome to join us on our after session FICA
59:20
about 15-20 minutes, if you missed to ask questions during the live stream
59:25
or if you want to say hi to us in Zoom. All right
59:30
Thank you so much. Do you have anything else, Håkan, that we missed before we end
59:37
No, I don't think so. All right. Yes. Okay. So thank you so much, Ashish, and everyone, our friends that joined us live today. I appreciate your time and hope to see you on the FICA and our upcoming session in two weeks. Have a great weekend
59:58
Yeah. Thank you so much. See you again. Bye. Bye
#Virtual Worlds
#Distributed & Cloud Computing


