To add more instructions
and tell NodeJS what to do if we got a request
that's coming in, we go back to line three here.
And here, we can do something which we already saw before
in the previous JavaScript course sections
when we worked with event listeners.
We can point at a function here
and pass a pointer at another function
as a parameter value to create server.
For this, I'll add a function here,
and I'll name it handleRequest,
though this name is up to you.
But this is a function that should handle incoming requests,
hence this name should make sense.
Now, that's a regular standard JavaScript function
as we saw it before in the course already.
Now, here for createServer,
we can pass handleRequest as a parameter value
but we don't execute it here.
We don't add parentheses,
instead we omit those and we just use the function name here
as we did it for event handlers earlier in the course.
We just point at this function.
And with that, we let NodeJS know
that it's this handleRequest function
that should be executed once we got an incoming request
because createServer as a first argument,
as a first parameter value wants a requestListener.
And a requestListener in the end should just be a function.
A function that then itself
takes certain parameter values though.
To be precise, a function that takes a parameter value
that describes the incoming request
and hence I'll name it request.
And a second parameter value
that takes a response object
that will allow us to send back a response later.
Now, it can be confusing
that we have a function with these parameter values here,
which we then pass as a parameter value itself
to another function or method.
But createServer simply wants a function
as a parameter value
that then itself takes these two parameter values
because values for request and response
will be passed into this function
once NodeJS executes this function for us
whenever a request is reaching that server.
So whenever a request is reaching this NodeJS server,
NodeJS will execute this function for us,
and it will pass in an object
with more data about the request
and another object that allows us
to send back a response
that's all done automatically by NodeJS.
And therefore now in this handleRequest function,
we can now work with this request,
and for example, extract data from it,
and/or prepare a response that should be sent back.
Now, at the moment, I don't wanna work with the request.
At the moment, I wanna focus on the response instead
and ignore the request for now.
At the moment, we need no data from the incoming request
but we definitely should send back a response
because if you create a web server
that does not send back responses to requests,
it will be an invalid web server
and browsers will show errors
when they try to talk to it
because a web server needs to send back responses
for incoming requests.
Therefore here, inside of handleRequest,
we can now use this response object
to prepare and send back a response.
And for this, using the dot notation,
we got various properties and methods
that we can utilize here.
Now, I'm not getting auto completion here
because my IDE here doesn't understand that handleRequest
will be used here for createServer
but I'll still show you properties and methods
that you can use.
And it all starts with the statusCode property,
written like that with a capital C,
that you can set on the response.
So this is not a method you can call
but a property you can set.
And statusCodes simply are ways
of telling a browser whether a request succeeded or not.
If you wanna communicate a success,
you should set it to 200 typically.
On the other hand,
you might have seen the statusCode 404 before
if you visited any website before in your life
because that's a status code, which is used
to communicate from a server to the browser
that the browser tried to access a website
that doesn't exist
or a page, a part of a website that doesn't exist.
Now here I wanna communicate a success case,
hence I'll set the statusCode to 200.
Now, in the next line,
after setting that statusCode,
I now wanna again use response
and send the response,
so tell NodeJS that I'm done preparing the response,
and also set the data
that should be part of the response.
For example, the text or the HTML code
that should be shown by the browser.
Before we did create HTML files for that,
now here since we control what happens on the server
with NodeJS, we can define the HTML code
that should be sent back here in our JavaScript code
because since you learned before,
one of the ideas of using server-side code
is that you can generate HTML code dynamically
so that you write code that generates HTML code.
And that's what I'll do here.
For this, we can use the end method on the response
to end preparing the response
and to send it to the client.
And to end, you can pass the data that should be sent.
And here we could send a very basic piece of HTML code
where we create a h1 element,
opening and closing tags,
and between that, Hello World!
Now, of course, writing HTML code like this
will be way more cumbersome
than putting it into files
but this only be a temporary solution.
You will soon learn how to use files again.
For the moment, just write it as text
without body and head and anything like that here
in this end method.
And if you do all of that,
you can now save this file
and now we'll execute this file again.
So let's now test whether everything worked.
For that, again, I'll use this integrated terminal.
And just as before,
I wanna execute this app.js file with it.
For this here, I'll again write node blank
and then app.js.
And if you hit Enter, you'll notice something interesting.
You don't get an error and you don't get any special output
but you also don't get back into the command mode.
You can't write another command.
I mean, you can type here
but actually, it's kind of blocked.
You're not entering a new line.
Just to show you the comparison,
if I press Control + C,
which stops this running process
and gets out of this blocked mode,
this is the normal entry mode
where you have some information in front of your cursor.
It will be different for you
but you have something in front of your cursor.
And if I hit Enter, for example, here,
then you see new lines are being started.
Now, if I type node app.js as I did before,
this does not happen.
I do get a new line
but not with that part in front of the cursor,
and that means that actually, this process,
which we started with node app.js
is still running and hasn't finished yet.
And that is actually what we want here
and what should be expected
because we did now start our own server.
By executing this NodeJS code,
we started our own server.
And such a server isn't a process that stops suddenly.
Instead, it should keep on running
because it should keep on handling requests.
If our server would stop,
browsers would not be able
to send requests to it,
and that's not what we want here.
Therefore, this is what should happen
that this process is now stuck and not stopped.
You can always finish it manually
by hitting Control + C as I mentioned before.
Now that's our own web server running on our local machine
and don't worry, it will not be exposed to other people
in the world unless your local network setup
is allowing requests from other computers.
But by default, that should not be the case
and it's not changed by this code
but we can now send the request to this server
from inside our own computer
since the server is running on our computer.
So even without the network being opened up,
we can still send the request to the server
if we use a browser installed on the same computer.
So therefore here I'll go back to my browser
and here you can now enter localhost:3000.
Localhost is simply an alias that refers
to your local computer,
so it's like amazon.com but just the address
of your local computer,
and then :3000 is used to target a specific port.
And here I'm using 3000
because that's the port on which I'm listening.
If you used the different port here,
you need to enter the different port number here
after the colon.
But I do recommend that you do follow along with 3000.
And if you now hit Enter,
you should see Hello World! here.
And you will actually see
that if you inspect this,
this is an h1 element, Hello World!
because I did send back my response
with this h1 element inside of it.
That's the response data.
Now, we also have a head and body tag around that
because that's added automatically by the browser
if it's missing in the response
but the response itself is only this h1 tag here.
We can also see this, by the way,
if you go to the dev tools
and there the network tab,
and you then reload the page
by pressing this reload icon.
Here you see all the requests your browser might be sending,
and here you should see this request to localhost:3000
and if you click on it,
you see more information about this request.
And here you see a preview of the response,
but if you click on response,
you'll also see the response data itself,
and here you see it's only this h1 text.
And this is now a website
that is displayed by the browser
just as it was before in the course,
but the code, the HTML code that is being displayed
is now not actually code that we wrote
in some HTML file, which we then clicked on
or served with the development server
but instead, it's some HTML response
that is generated and sent back
by our own NodeJS server.
And therefore, this NodeJS server now also replaces
this development server extension,
which we used before in Visual Studio Code,
because now we don't need
that extra development server created by the extension
since we do create our very own server with NodeJS here.
Now, the advantages of using NodeJS
might not yet be obvious
since we still have, in the end,
static pre-written HTML code here,
but this is a crucial first step
to dive deeper into NodeJS
because this is basically the main entry point
of any website that you are building with NodeJS.
You always start by setting up a server
and then you can add more features in a next step,
and that's what we'll do throughout the rest of the course
but these are the crucial basics.
Now, with that for the moment,
I'll stop this running NodeJS server here
by going into the terminal and hitting Control + C,
and this will stop it.
And once you stopped it,
if you visit localhost:3000 again,
you'll get an error
because this server isn't running anymore.
Whenever you wanna continue working on the code,
you therefore have to re-execute node app.js
to start that server again.
But that's something we'll do later.
For the moment, this is what I wanna finish with
and now it's time to dive deeper into NodeJS
and what we can build with it.