How to create an Express.js application

Express.js is a back-end web development framework based on Node.js that is used to build APIs and web applications. It is one of the widely used web development frameworks as it provides various tools to make web applications fast and organized.

To create an Express.js application, we must follow the steps below.

Installing npm

First, we must install the node package manager (npm) onto our machine to install Express.js. npm is a powerful tool that is used in Node.js applications to allow developers to manage and install external libraries, modules, and packages.

Setup directory

Now that we have installed npm on our machine, we will create and set up a new directory containing our Express.js project. Below is a list of steps we must follow.

  1. Create a directory: First, we will create a directory and navigate into it. We can use the following commands:Setup

mkdir myapp && cd myapp
Command to create folder
  1. Initialize npm: Once we are in the directory where we want to create our application, we will first create a package.jsonIt is a file used in Node.js applications that contains metadata about the project such as a name, version, and dependencies. file using the following command:

npm init
Initialize a Node.js directory

The command will ask us to specify numerous configuration options. To keep them as default, we will press enter whenever prompted. Now, we should be able to see a file named package.json in the directory.

  1. Install Express: Next, we will use npm to install Express into our project. We will use the npm command below to install Express:

npm install express
Install Express.js using npm

When we run the command, we will see a new file created that will be named package-lock.json, containing a list of the dependencies in our project. When we open it, we will see express under dependencies which shows that Express was configured correctly.

  1. Create index.js: Next, we will create a new file named index.js, where we will write the back-end code for our application.

Back-end configuration

Now, in the index.js file, we will paste the following code representing our web application's back-end code.

const express = require('express')
const app = express()
const port = 3000
app.get('/', (req, res) => {
res.send('Hello Educative User <3!')
})
app.listen(port, () => {
console.log(`Listening on port ${port}`)
})

Code explanation

  • Line 1: Import and assign the express module to an express variable.

  • Line 2: Create an instance of the Express application by calling the express() function.

  • Line 3: Define the port number where our application will be hosted. We will use port 3000 here.

  • Lines 57: Configure our home route using the app.get() function. When the user visits the application, we display an empty page with the message Hello Educative User <3 by using the res.send() method.

  • Lines 911: The app.listen() function is used to start the node.js server and listen on the port 3000 defined in line 3. When the server starts, it will log the message Listening on port 3000 onto the console.

Starting the web server

Now that we have set up our basic Express.js application, the final step is to start the Node.js server and visit the web application.

To start the Node.js server, we can use the following command:

node index.js
Command to start server

The command will display a message we logged into the app.listen() function when visiting the app URL.

Sample application

If we follow all the steps, we should have an Express.js application like the one below.

const express = require('express')
const app = express()
const port = 3000

app.get('/', (req, res) => {
  res.send('Hello Educative User <3!')
})

app.listen(port, () => {
  console.log(`Listening on port ${port}`)
})
A simple Express.js application

When we click the "Run" button, we can see in the "Terminal" tab that our server starts using the node index.js command and displays the message Listening on port 3000.

When we view the "Output" tab, we can see the home route of our Express.js application that displays Hello Educative User <3.

Copyright ©2024 Educative, Inc. All rights reserved