Open In App

Express express.static() Function

Last Updated : 15 Jan, 2024
Improve
Improve
Like Article
Like
Save
Share
Report

The express.static() function is a built-in middleware function in Express. It serves static files and is based on serve-static. 

Syntax:

express.static(root, [options])

Parameters: The root parameter describes the root directory from which to serve static assets. 

Return Value: It returns an Object. 

Steps to create the application:

Step 1: Initialize the express app:

npm init -y

Step 2: Installing the required packages by using below command.

npm install express ejs

Project Structure:

NodeProj

The updated dependencies in package.json file will look like:

"dependencies": {
"ejs": "^3.1.9",
"express": "^4.18.2",
}

 Example 1: Below is the code example of the express.static() Function

Javascript




const express = require('express');
const app = express();
const path = require('path');
const PORT = 3000;
 
// Static Middleware
app.use(express.static(path.join(__dirname, 'public')))
 
app.get('/', function (req, res, next) {
    res.render('home.ejs');
})
 
app.listen(PORT, function (err) {
    if (err) console.log(err);
    console.log("Server listening on PORT", PORT);
});


HTML




<!DOCTYPE html>
<html>
 
<head>
    <title>express.static() Demo</title>
</head>
 
<body>
    <h2>Greetings from GeeksforGeeks</h2>
    <img src="Demo.jpg" width="150" height="100" />
</body>
 
</html>


Note: Demo.jpg is placed in the public folder, as the public folder is now being served as static to the server.

Steps to run the program:

node index.js

Console Output:

Server listening on PORT 3000

Browser Output: Now open your browser and go to http://localhost:3000/

 Example 2: Below is the code example of the express.static() Function

Javascript




const express = require('express');
const app = express();
const path = require('path');
 
// Static Middleware
console.log(app.use(express.static(
    path.join(__dirname, 'public'))))


Steps to run the program:

node index.js

Output:

[Function: app] EventEmitter {
_events: [Object: null prototype] { mount: [Function: onmount] },
_eventsCount: 1,
_maxListeners: undefined,
setMaxListeners: [Function: setMaxListeners],
getMaxListeners: [Function: getMaxListeners],
emit: [Function: emit],
.
.
.
.
locals: [Object: null prototype] {
settings: {
'x-powered-by': true,
etag: 'weak',
'etag fn': [Function: generateETag],
env: 'development',
'query parser': 'extended',
'query parser fn': [Function: parseExtendedQueryString],
'subdomain offset': 2,
'trust proxy': false,
'trust proxy fn': [Function: trustNone],
view: [Function: View],
views: 'C:\\Users\\Lenovo\\Downloads\\GFG
Reviewer Internship\\Program\\views',
'jsonp callback name': 'callback'
}
},
mountpath: '/',
_router: [Function: router] {
params: {},
_params: [],
caseSensitive: false,
mergeParams: undefined,
strict: false,
stack: [ [Layer], [Layer], [Layer] ]
}
}

We have a Cheat Sheet on Express Static Functions where we covered all the express static methods to check those please go through Express express() function Complete Reference article.



Like Article
Suggest improvement
Previous
Next
Share your thoughts in the comments