Express.js is a fast, unopinionated, and minimalist web framework for Node.js. It's extremely popular because of its simplicity and flexibility. In this tutorial, you will learn how to set up a simple Express.js application.
By the end of this tutorial, you will:
- Understand the basics of Express.js
- Be able to set up a simple Express.js application
Prerequisites:
- Basic knowledge of JavaScript
- Node.js and npm (Node Package Manager) installed. If they are not installed, you can download them from here.
Let's set up our first Express.js application.
Step 1: Initialize a new Node.js application.
Create a new directory for your project and run npm init -y
to create a new package.json
file. This file describes your application and its dependencies.
Step 2: Install Express.js.
Run npm install express
to add Express.js to your application.
Step 3: Create an app.js
file.
This will be the main file for your application.
Step 4: Set up your first Express.js application.
In the app.js
file, add the following code:
const express = require('express');
const app = express();
const port = 3000;
app.get('/', (req, res) => {
res.send('Hello World!')
});
app.listen(port, () => {
console.log(`App listening at http://localhost:${port}`)
});
Step 5: Run your application.
Run node app.js
to start your application.
Let's break down the code:
// This line imports the express module
const express = require('express');
// This line creates a new express application
const app = express();
// This line sets the port the application will run on
const port = 3000;
// This line sets up a route handler for GET requests made to the root path ('/')
app.get('/', (req, res) => {
// This sends a response of 'Hello World!' when the route is accessed
res.send('Hello World!')
});
// This line tells the app to listen on the specified port and logs a message to the console
app.listen(port, () => {
console.log(`App listening at http://localhost:${port}`)
});
When you run this application and navigate to http://localhost:3000
in your web browser, you will see 'Hello World!'.
In this tutorial, you learned the basics of Express.js and set up a simple Express.js application.
Next, you could learn more about routing, middleware, and how to serve static files with Express.js. Here are some additional resources:
- Express.js Guide
- Express.js API Reference
Exercise 1: Create an Express.js application with routes that respond to '/about' and '/contact' requests.
Exercise 2: Extend your application from Exercise 1 to include middleware that logs the current date and time whenever a request is made.
Exercise 3: Create an Express.js application that serves static files (like HTML, CSS, and images) from a 'public' directory.
Solutions:
Exercise 1: Here's an example solution:
app.get('/about', (req, res) => {
res.send('About page')
});
app.get('/contact', (req, res) => {
res.send('Contact page')
});
Exercise 2: Here's an example solution:
app.use((req, res, next) => {
console.log('Time:', Date.now());
next();
});
Exercise 3: Here's an example solution:
app.use(express.static('public'));
With this solution, if you have a file named index.html
in the 'public' directory, you can access it at http://localhost:3000/index.html
.