[MUSIC]
>> Today, we have a really
special sponsored stream from Microsoft.
Thank you to the Azure team.
We're going to build an app completely from scratch,
a NodeJS app,
and then we'll deploy it to Azure,
deploy it to the Cloud.
Then we're going to put it onto Kubernetes and put it onto Azure.
I'll show you how to do all of that without even needing
to have Docker on your computer
or anything. It's going to be really cool.
But first off, I guess we're going to
create a repository for our project.
It's going to be a very, very simple app.
This is going to be a Christmas countdown.
We're going to have a repository and it's going to do,
Christmas Countdown NodeJS App,
and we'll add a README, add a gitignore,
and the gitignore is going to be a Node app,
and then I can create repository.
Let's initialize the Christmas countdown very well. That's fine.
Christmas countdown app for NodeJS,
and entry point, test command,
Git repository, keywords.
I will say Christmas countdown, NodeJS,
JavaScript, and Instafluff,
and then author, MIT License, oh, yeah.
Yes. I wish I had Nano because what I like to do on Nano
is then I'd just do a Nano thing and then I might go webweb,
and then run,
and then that's all I need to create for it.
Except in here what I'm going to do is,
I'll actually want to have an API for it,
so web.APIs will say countdown,
body, and options.
We need to have the timer.
We need to know how much time there is between
now and Christmas and then return that in the API.
What I want to know is Christmas,
I want to find JavaScript date theory.
Here we go. This is perfect.
This is what we needed per year, December 25th,
2021, per year, and there we go.
There's Christmas, and then we have today is just this.
I just want to return this,
and so I'm going to return it as a JSONObject,
and be like, Christmas.
Actually, I can just return this and then today.
TimeUntil. This is going to diff.
Run this on port 8080,
and then localhost 8080 and then countdown.
It should give us, wow, it's tiny.
TimeUntil is, I think this is in milliseconds.
What I'm going to do is, I'm going to compute this.
Time until, and I will do milliseconds is diff,
and then timeUntil in seconds is going to be diff
divided by 1,000 and timeUntil in minutes,
is going to be this divided by 60,000,
60 minutes times 60 seconds.
TimeUntil days is going to be diff and then it's going to be
24 hours times 60 times 60,000. That should be it.
[FOREIGN].
>> Oh, yeah. Now,
we have time to milliseconds.
We have 42 days until.
Actually, I should center horizontally though. Let me do that.
To center horizontally,
in the alignment and goes,
this is 100 percent.
You say, ''Text-align'' and then you go "Center", and then.
[FOREIGN]
Check it out. Would you look at that.
The inner text is going to be, let me do this.
Is it too fixed too?
I forgot to close it, 42.54
days until Christmas per year until now.
I can set the font size on this to
be something ridiculously big, 128.
When we do minutes,
diff minus it's going to be days times,
no days times 60 because it's 60 minutes, remove that,
and then we have seconds is going to be equal to but without
the 60 days times 60 times
60 plus minutes times 60.
Now, we can format this.
We can be like 42 days,
something hours etc, until Christmas,
so then the countdown hours,
and then we have minutes,
and then we have seconds, and then milliseconds.
Count mills, 42 days,
12 hours 37 minutes, 52 seconds,
and 973 milliseconds until Christmas.
Maybe what I'll do though,
I should do this as a timer; command,
set, set interval command,
and then this, and then go like this.
I guess this is good enough for now.
With that, now we have this app.
We have it, it works, and it's here.
Now, all we got to do is to get it onto Azure Kubernetes.
I'm going to log in to the portal Azure.
Here what I have to do is I've to find DevOps, create a cluster.
Let's do it. Where do we go?
Let's find, and then I'll put this on Instafluff, that's fine.
"Standard", Christmas countdown.
"Resource group", actually,
I should create a new resource group
because then it'll make it really
easy for me to to delete it.
I'll call this "Christmascountdown" as a resource group.
It's created, deployment in progress.
Now, we're going to connect this to Azure Pipelines.
It's pretty easy. It's pretty nice.
You just do start free or start with GitHub,
and then even the pricing,
there's the free pricing as you saw
earlier free for open source projects.
"Start free" over it. Come here.
That was a go, we get a signed in. I guess that works.
S, X, D, Y, K, K, D,
continue. You've got it working.
Check this out, your result, 42 days, 12 hours,
25 minutes, eight seconds until Christmas.
This is what we're going to do,
build and push the image to Azure Container Registry,
deploy to Azure Kubernetes Service.
We say file's name,
I think it's signed into this,
enter into account, and space "Christmascountdown".
Everything I'm just calling "Christmascountdown".
Container registries, and then we'll
create one and then pay-as-you-go
resource group is going to be
"Christmascountdown" and then enter the name.
This is "Christmascountdown" everything.
Great. The pipeline is instafluff.
Christmascountdown, and then, yeah, show more information.
Here it is "Project Settings", and then "New pipeline",
and select "GitHub" and then we select our repository.
We're going to select this "Christmascountdown",
then we can review the pipeline.
Then "More Actions". Yeah, this is fine review.
It has all the things and then do ''Run''
and then it creates the pipeline.
There isn't much that it has to do.
It's just to create this pipeline and then that's it.
Merely run, "Stages" "Build stage" and it's queued.
It might be working. It might be doing something.
I think that's all I have to do.
I just have to create a new one.
It wants a Docker file.
We might have to create our own Docker file
but once we do that then it should be fine.
The Docker file is going to be on the main thing here.
I'm going to find a template Docker file that we could use,
that's going to be easy.
Here's one, super-easy.
Let's put it in there and package this on
your end and then install TypeScript latest.
We don't really need TypeScript, do we?
Yeah, we don't need that. Then on the production and then npm,
Start Expose 8080 because we run it on port 8080.
Copy everything from that.
[FOREIGN]
Okay, a minute. Now, we did that,
and then it picks it up but we're about to put it onto Cloud here.
We just put in the Docker file so now it's building and we
can see it in progress and then we'll see what's going on.
Here it is and it says, "Deploying." It's building.
It's going to build and then deploy and then the deploy request,
and hopefully, that should be it.
The initials does this.
I don't have Docker installed on my computer.
You don't need to do like image building
things or anything on your own computer or locally.
You just set the thing up and you're like point it to
this repository and then checked in
my Docker file and there you have it.
But it's deploying.
It's deploying to the Kubernetes
cluster and do the thing and that it was
created it and, it deployed.
Finalized, it finished all.
Do you know what this means? It's running.
What? We did it just like that and this is cool.
This is damn cool because we went from
our local Christmascountdown servers thing that's
running on port 8080 on this computer here,
our localhost and then we just use the Microsoft Azure Portal
to then create a Kubernetes cluster and a Container Registry.
We went here and went to
the Azure DevOps and then created new pipeline that connected to
our GitHub repository and then it just
automatically picked it up and configured
all the settings to connect up to the Kubernetes cluster.
I can't believe it, it and works. It's so cool.
There you have folks. That's all you got to do,
to do Kubernetes is on the Cloud.
[MUSIC]