In this tutorial, I will be demonstrating how to build a simple server with Node.js. and Express. I will be using VScode as my text editor and I am on a Mac.
To get started you will need to have Node.js installed. You can download it here. Once installed, open your terminal (if you’re using VScode you can type ctrl ~). Run the command node -v in your terminal. You should see the Node version returned in your terminal. I will be using version 12.13.1 for this tutorial.
Next, we will create a new directory on our desktop. I will call mine simple_server. You can do this by right-clicking on your desktop and selecting new folder.
Now we will go back to our VScode terminal and navigate to our Desktop. In your terminal type the command cd Desktop and press enter. You should see that your terminal is now on your desktop.
Now run the command code simple_server. VScode should open your newly created folder.
If this didn’t work for you, alternatively you can drag and drop the folder to your VScode.
You should see your folder on the left-hand side of the editor. Check your terminal to see that you’re in the right directory as well. It should look like this.
Hover over the simple_server folder and click new file, save it as server.js. VScode should open the new file for you in the editor.
Now let's go back to our terminal and initialize our directory. In the terminal (double-check that you’re in the simple_server folder) and run the command npm init -y which will initialize our folder and create a package.json file. You should now see that our package.json file was created.
In your package.json file, the key “main” should be set to “server.js”. Now back in the terminal run the command npm i express. NPM (Node Package Manger) comes with Node.js. Express.js, or simply Express, is a web application framework for Node.js. It was designed for building web applications and APIs.
You should now see that a folder called node_modules was installed along with a package-lock.json file.
Now that the setup is taken care of. Let's start building our server. In your server.js file, let's bring in express. Don’t forget to save your file after every step. Use the shortcut CMD + s.
Next, we will create an app variable and set it to an instance of express.
Now let's give our server something to do. Let's tell our server to send some data to our browser. We do this with the following bit of code.
The final thing we need to do to get our server to work is to tell it what port to listen on. We do that with this block of code.
And there you have it. You’ve just built your very first server with Node.js and Express. Congratulations!
Now let’s make it run. In your terminal run the command node server.js. You should see a message saying “Listening on port 3000”.
Now let's open a new browser window and go to http://localhost:3000/. You should see our message displayed in the browser.
Let's add another route for our server to listen for. When our server gets a request it will send to the browser any data that we tell it to. Above our app.listen code block let’s add another route for an about page.
Something to note, running node server.js will require you to kill your server and restart it after every change. This can be done by running the command CTL + c followed by node server.js in your terminal. This can be annoying. Let’s install another node package to help us out. In your terminal run the command npm i -g nodemon. This will take care of restarting our server automatically after we make changes to our server.js file. Now we can simply run the command nodemon in our terminal.
Let’s go back to our browser and add /about to the end of our http://localhost:3000 route and hit enter. You should see that the server sent back the new data to the browser. You should also see a message in your terminal saying “Server received a request for the about page”.
I hope you’ve enjoyed this tutorial! If you’d like to learn more, please connect with me on LinkedIn and send me a message!
Thank you for your time!