Original subtitles

This video is yet another really exciting one,

because now we're gonna create our very first

real web server capable of accepting requests

and sending back responses.

And the first step is to include yet another package

or another module,

and this one is called http.

So we're using the require function again,

and then requiring the built-in http module,

and that's the one that gives us networking capabilities

such as building an http server.

Now, let's actually comment out this code here

so that it doesn't get in our way.

So let's actual create kind of a divider here.

So this one is filed,

and this one is for server.

And now, in order to build our server,

we have to do two things.

First, we create a server,

and then second, we start the server

so that we can actually listen to incoming requests.

We use our http module and just like before

we used a method that is on that object.

So just like we did with the fs module.

So, http.createServer

and create server will accept a callback function,

which will be fired off each time

a new request hits our server.

And this callback function gets access

to two very important and fundamental variables.

It is the request variable, and a response variable.

And a little bit more about them in a second.

So, request, and response,

So all we want to do now is to actually

send back a response to the client

and we do that with res.,

which is this object here, this response object, .end,

and then 'Hello from the server!'.

.end, and then 'Hello from the server!'.

So that is the response that we're going to send back.

So again, each time that a new request hits our server

this callback function here will get called,

and the callback function will have access

to the request object which holds all kinds of stuff

like the request url, and a bunch of other stuff.

On the other hand, this response object here

gives us a lot of tools basically

for dealing with the response,

so for sending out the response.

The simplest one is .end,

and this end here, the naming of this method

will make a bit more sense a bit later.

For now, just know that this is the simplest way

of sending back a very, very simple response in this case.

So that's really all we have to do

to send back a plain text response

when a certain request comes in.

Now, if you're a bit confused about all these terms,

like incoming request, or sending responses,

or even about why we do actually have requests

and responses here on our server

then don't worry, because we have a whole lecture

coming up about how the web works

where we're gonna talk all about the client-server model,

and really how network applications work in general.

Again, in this section my main focus

is on actually showing you all the stuff

and really making it work,

and then the theory will follow a bit later.

So that's the philosophy I've used

in all my other courses, and it's been working really well,

and so I believe it's a good thing

to do it here as well.

Anyway, creating a server was the first part,

and now the second part is to actually listen

to incoming requests from the client.

Now, in order to do that we actually need to save

the result of this createServer here to a new variable.

So, we call it usually server,

so server is the result of this createServer method here.

So it will create a server, and now we use that server

and on that we can call listen.

Listen accepts a couple of parameters the first one

is the port, and usually the port

that we use in Note is for example, 8000.

But you will see other numbers like 3000,

or 80, or something like that.

And in case you're wondering what a port actually is,

well it doesn't really matter,

but all you need to know is it's basically

a sub-address on a certain host,

and the host is what we specify next.

We actually don't need to specify it

and then we'll default to a local host,

but we can actually specify it also

to local host explicitly.

So, local host usually has this address as a default,

and local host simply means the current computer.

So the computer that the program is currently running in.

And again, this is the standard IP address

for that local host.

So this one here will start listening for incoming requests.

So basically starting up the server.

And as an optional argument

we can also pass in a callback function,

which will be run as soon as the server

actually starts listening.

So here, it's quite usual to simply display a message

that the server has been started.

So let's say listening to requests on port 8000.

And now all we have to do is to actually go

to this url on our computer on port 8000.

Now before we can do that of course,

we have to run the Note application,

so note index.js, and here we have our lock.

So listening to request on port 8000.

And you see that the app keeps running,

so before it was always stopping

right away, so it did its work,

and then it exited the application.

Right now it doesn't do that.

That's because of something called the event loop

that we're going to talk about a bit later

in another section of this course.

But, no matter what the technical reasons are for this,

it is obvious that the app cannot really exit right away,

because then we could not receive any new requests.

So when we start a server,

Note cannot simply exit the process

so exit the program, because the whole goal

is to wait for the requests to come in.

So this is what I'm gonna show you next.

For now, let's just open up the IP address on port 8000.

And for that we use the colon, and then the port number.

So, this is the host, which is local host,

colon, and then the port number.

Hit enter, and here we go.

So, hello from the server!

And so yeah, it really works.

You have a real web server running on your computer

using NoteJS, congratulations.

So let's go back here and, again analyze what happened here.

We created our server, using createServer

and passed in a callback function

that is executed each time that a new request

hits the server, and then we started listening

for incoming requests on the local host IP,

and then on port 8000.

Once we had all this running, we actually did the request

by hitting that url.

So basically by hitting local host on port 8000.

So then, under the hood of NoteJS an event was fired

which is something that, again,

we're going to talk about a bit later.

But what matters here is that this event

then made it so this callback function was called.

And finally as a result of that,

we then got back this string.

Just for the sake of curiosity,

lets actually take a look at the request object.

We need to close the server and start it again

because we did some changes to the code.

And notice how this time I actually used control C

in order to exit the application.

So remember that in the beginning

when we used the ripple,

I used control D in order to exit it.

But now when we have a Note program running like this

We need to use control C to basically break

from that program.

That's why here I used control C

and throughout the rest of the course

when I want to finish a program

I will always be using control C.

So, that's control and not command C, again.

Even on a Mac you need to use control C.

Let's now do this again, we get the same response,

but now we should have something in the console.

So this here is the request object,

and as I mentioned, there is a ton of stuff in here.

You see it?

All of this, it doesn't even fit actually in the console.

I think I cannot even show you

all the cool data that is in there.

Actually here we have some headers,

so we have the host and here we have some...

Again, so we have some http headers,

which is something that we're going to talk about

I think in the next video.

Anyway, what matters here is that we really

get access to all kinds of stuff

when we handle the request and send out the response.

Doesn't matter here, let's actually get rid of this,

give it a save, and then quit this, and start it again.

And now just to finish this video,

I want to show you what we're actually gonna build

in the next couple of lectures

until the end of this section.

So it's this small fun app called the node farm.

We have a couple of products here,

and we built all of this here

using a very simple html template,

and you can then click on the link

and it will basically take you to the detail page

for this product, in this case the avocados.

It has a bunch of data here,

a button which doesn't do anything,

and then we can go back to the page.

So, avocados, then we have the cheese for example,

and it has then, of course, different data

for each of these products.

So it has this nice fresh, kind of crazy design to it

to make it pop a little bit, and yeah,

I think this is a fun little project.

And we're gonna start building it actually,

right in the next video.