NodeJS and ExpressJS - Hello World 👨🏻‍💻

Tanwa Sripan - May 23 '22 - - Dev Community

Hey everyone 👋 I recently finished the freeCodeCamp "Backend Development and APIs", if you are interested you can find it here at FCC. I learnt quite a lot and I thought it was a great introductory to Backend Development with NodeJS. So, I thought why not show you all how to create the classic "Hello World" app using Express and NodeJS.

Table of content

  1. Introduction
  2. Pre-requisites
  3. Server set up
  4. Hello world

Introduction

With NodeJS, you can now write backend code with JavaScript. While, for some people, it might not be too difficult to learn a new language to write server-side code, I think that being able to write both frontend and backend with the same language makes learning full stack developer easier (maybe 😁). So what is NodeJS? - NodeJS is a JavaScript runtime environment that comes with many tools to help you write server-side code using JS. You can learn more about it with nodejs.

ExpressJS is a NodeJS framework which is easy to use. It allows you to write handler functions for different HTTP requests (GET, POST, PUT etc...) for different routes (path/URL). It can also be used to serve static files and dynamically generated content using templates. You can learn more about it at tutorialpoint and express.

Pre-requisites

You should:

  • Know some JavaScript code
  • Have NodeJS installed
  • Have VSCode installed (this is the editor I use, but you can use others you are comfortable with)

If you don't have NodeJS yet, you can download it here at nodejs, this will come with a package manager npm which you can use to install various packages and dependencies, e.g. ExpressJS.

Server set up

After you have installed NodeJS, you can create a new folder (call anything you want) and open it up in VSCode, and within VSCode you can open the terminal and initialize a node project with:

npm init -y
Enter fullscreen mode Exit fullscreen mode

This will start a new NodeJS project and create a package.json file with populated information. You can then run:

npm install express
Enter fullscreen mode Exit fullscreen mode

This will add ExpressJS to the dependencies list in the package.json file and install it along with other node built in modules (you will see the node_modules folder appear).

Next, you will need to create a JavaScript file to start coding the "Hello world" app, you can call it app.js or index.js (or whatever).

Code Hello World App

To begin, let's import ExpressJS using require, as express is a function, you will need to call it and store it in a variable typically called app. We can then start the server by telling app (a.k.a express) to listen on a specific port.

const express = require("express"); // import express
const app = express(); // initiate express
const PORT = 8000;

app.listen(PORT, () => console.log("Server is running on http://localhost:" + PORT)); 

Enter fullscreen mode Exit fullscreen mode

The second argument to the .listen method lets us define a callback function so we know when the server is up and running.

We can start the server by going to the terminal and run this command (*note: my js file is called index.js, so you will need to use whatever you named your js file):

node index.js
Enter fullscreen mode Exit fullscreen mode

Right now, you won't be able to do much because we have not set up any routes (end-points), but you can still view and check if the server is up and running. You should see the "Server is running on http://localhost:8000" in the console and if you visit that page on the browser you should get a message of "Cannot GET /".

Next, let's set up a GET end-point to the home page or the root URL ("/") and response with a "Hello world". Here we will use .get(), an Express method that tells the server how it should respond to a GET request. The first parameter tells you which route (URL/end-point) you want this to run, in our example we want the root URL ("/") and the second parameter is the handler function which has take two arguments, the request and response object. To print "Hello world", we can use res object and .send the message.

app.get("/", function(req, res) {
   res.send("Hello world!");
});

Enter fullscreen mode Exit fullscreen mode

VOILA! You have done it! If you visit the page now on the browser, you should see that the server has responded to the GET request with a message of "Hello world!" (or whatever message you used). If you don't see anything, try restarting the server by pressing Ctr + C and run node index.js again.

If you followed the steps, hopefully everything should work and you will have coded "Hello world" app using ExpressJS and NodeJS. You can see my example here on replit.

The overall project looks like this:

const express = require("express"); // import express
const app = express(); // initiate express
const PORT = 8000;

app.get("/", function(req, res) {
   res.send("Hello world!");
});

app.listen(PORT, () => console.log("Server is running on http://localhost:" + PORT)); 
Enter fullscreen mode Exit fullscreen mode

Summary

NodeJS is a JavaScript runtime environment which gives you the power to write JS code on the server side. It comes with many helpful built in tools. ExpressJS is a NodeJS framework that help you deal with HTTP requests and more, you can use these two to create a simple "Hello World" app.

Thank you for reading, if you have any feedback please leave a comment or DM me on Twitter at JustTanwa.

L from death note

. . . . . . . . . . . . . . . . . . . . . . . . .