Lesson 40

Run HTTP Server with ExpressJS

Learn how to create an HTTP server with the Express library using the JavaScript programming language on the serverside, also known as Nodejs.

01 02 03 04 05 06 07 08 09 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72

Summary

Summary of server.js Setup Using Express

Creating the `server.js` File

The speaker begins by creating a new file called server.js in their project directory to write Node.js code.

Setting Up Express

Require Express:
- Use require('express') to include the Express framework. Ensure that the name matches the package.json dependencies.
- Store the required Express in a variable named express.
Create an App Instance:
- Call express() to create an instance of the app and assign it to the variable app.
Set the Server to Listen:
- Use app.listen(3000, callback) to make the server listen on port 3000. The callback function will execute once the server starts.

Running the Server

Open a terminal in Visual Studio Code using Control + Backtick to run the command:
```
node server.js
```
Visit http://localhost:3000 in a browser to check if the server is running (if you see Cannot GET /, the server is operational).

Adding Feedback to the Console

To understand when the server is running, add a callback to the listen method:
```
console.log('Server is listening at http://localhost:3000');
```
After modifying the code, stop the server using Control + C, and restart it with the same command.

Using Variables for Port Configuration

To avoid repeating the port number:
- Create a variable for the port:
```
const port = 3000;
```
- Use string interpolation with backticks to reference the variable:
```
app.listen(port, () => { console.log(`Server is listening at http://localhost:${port}`); });
```

Final Notes

Run node server.js after each code change to see the updates.
The importance of using backticks for string interpolation in JavaScript is emphasized.

Video Transcript

Okay, I'm going to go here and create a new file. Let's call this server.js. So under our directory, using express, I created a new file called server.js. This is where I will write the JavaScript or Node.js code. Let's start off, submit the boilerplate at first. So to require the Node module we installed, or library or package, you can say require and call it as a function, parentheses, and then under quotes, either single or double, doesn't matter. The name of the Node package, in this case express. This has to match the same thing as the package.json dependencies, entry. Okay, and then we can place this in a variable. I will call it simply the same name as the module. Once we got that express variable, you can call it as a function, and that will return to you an instance of what we call app. You can store that in a variable, typically we say app or app. And finally, you can call, there's a function listen on this app object. So app is an object, so you can say dot to access an attribute or a method. That is a function that belongs to this object. That's called listen, and call it as like this. You need to give it a port, so we can say 3,000, that's the typical port we use when we start off. Okay, so that's the very basic server. Allow, let me explain again. So we installed express, which is a code that somebody else wrote. So we downloaded that with npm, and to be able to use that in our own code base, we do require with the name of the module there. We take that and put it in a variable. Usually I use the same name as the module for the variable. And then we call this express function to get an app object, and that app object can call the listen function with a port that the server will be running. Okay, so now I'm going to go, actually I can open a terminal from Visual Studio Code, so I don't have to change all the time. So I'm going to click, press control to back tick, or you can, if you use Visual Studio Code, it's terminal here. So I can choose, this one is just a power shell, I can use different things, if you use Visual Studio Code, for example, use command prompt. So I have a command prompt tab here. So I can type commands here as well, so I'm going to say node space server.js. So I make sure I'm in the same project directory as the file, the server. So I press enter, I'm not going to see anything, but it's actually running. Let me confirm using the browser. I'm going to go to localhost colon 3000. Yeah, so if I see cannot get slash, I mean it's working. Let me make it bigger. Okay, so how's everybody doing? Yeah, so I went to my terminal, I type node space server.js, that's the file name for this that I wrote, and enter. So it runs the program. Now you're not going to see anything, you're just going to see empty blank without the command prompt. You see there's no prompt here, it's just blank. It's actually running the server, so it's listening to requests. So the address here that you have to go to is localhost colon the port that you specified on line five. In this case the port of 3000. So I have to go to, let me make a comment here, http colon slash slash, localhost colon 3000. Now localhost is usually an alias for 127.0.0.1 IP like the local. Okay, so if the localhost doesn't work for you, try 127.0.0.1. And you've got to add the port there. All right, somebody just joined, we're doing express. So we created a node project with npm init and we installed express with npm install express. And we wrote this file server.js and we ran it in the terminal with node space server.js. Now this is like you said, what's going on here. I don't see anything. So that's pretty bad for us to understand what's going on. So we need some feedback. That's why we can add as a second argument to listen a callback function. Let's add function here. I'll write function keyword. And this callback function will be called as soon as this app or server initiates or starts listening. And we're going to say to the console, a message, so I'm going to say console dot log parentheses. And we're going to say server is listening. So we have some feedback at HTTP colon slash slash localhost colon 3000. Okay, so save that. Now when I change code, whenever I change my code, I have to go to the terminal, kill my server and restart our rounded program again. We always have to do that. It's kind of tedious. So to kill the server, control C. When you say control C, it sends the interrupt signal and it knows how to stop. Once we do that, simply run the command again, node server dot j s, and that was started. Now we can see there's servers listening at localhost 3000. Now I understand. Oh, okay, that makes sense. Now we have some feedback. We know what's going on. And you can even control and click this URL here. It will open the browser for you when you have URLs in the log here in the terminal. Hold control and click to follow the link. Now one thing, if you change the port here, this is going to be wrong, right? So you have to change it here and here. So if you want, you can create a variable like say const board equals 3000 and put a variable here. Instead of 3000 and you can also put it here if you interpolate the string like dollar. Worked. This is string interpolation, meaning the value of the variable port, which is 3000 gets replaced whatever this is at. So it becomes like that. But in order to use interpolation, the quotes surrounding it must be a back tick. The back tick key is the one where the tilde is next to the one on a US keyboard. So back tick there and back tick here instead of single quotes. That's the only way you can interpolate JavaScript. And that's just so if you change the port here to whatever 4000, it will also change here and there automatically. So you don't have to write it twice. Now because I changed my code, I always have to go to the terminal control C to interrupt and then run it again. So it runs the new code. There's no change, right? We just did some variable. No, no different from before.