Getting Started with Express JS
Vamsi Krishna
Posted on July 13, 2022
What is Express JS?
Express is a fast and minimalist web framework for Node.js that provides a robust features for web and mobile applications.
Express is a server-side framework. It can be used with client-side frameworks like React, Angular or Vue to build full stack applications π.
Most of the times we build API's with express so that it takes request from frontend and serves back the data mostly in JSON format.
What is the Use of Express?
- It makes building web apps with node js much easier
- It is used because its light, fast and free
- Most popular Node framework
- Easy to use with Frontend frameworks
prerequisites
- JavaScript Fundamentals
- Basics of Node and npm
Installing Express
run npm install express
command to install express js
Basic code for creating Server in express
const express = require('express')
const app = express()
app.get('/', (req, res) => {
res.send('<h1>Home page.....</h1>')
})
app.listen(3000, () => {
console.log(`server is listening on port 3000`)
})
As we can see that we are listening on port 3000, so if we go to localhost:3000, we can see the following page running
But Why Express JS
why express js when node js exists?
You might have this doubt, When I started learning express I got this doubt. Comparing Node js and express JS is not very perfect because Node is a runtime environment which allows us to run JavaScript outside the browser where as Express is a Framework. No.1 reason for using express is that we can create a server with less lines of code than using http in node js.
To understand in depth, lets create a server that shows 'Home Page...' when user is on localhost:3000 url and shows 'About Page...' when user is on localhost:3000/about
ππ Performing above query using Node http module :
const http = require('http');
const server = http.createServer((req,res) => {
res.statusCode = 200,
res.setHeader('Content-Type','text/html')
if(req.url === '/') {
res.end('<h1>Home Page....</h1>')
} else if(req.url === '/about') {
res.end('<h1>About page....</h1>')
}
})
server.listen(3000, () => {
console.log(`server is listening on port 3000`);
})
ππ Performing same query using Express JS:
const app = require('express')()
app.get('/', (req, res) => {
res.send('<h1>Home page.....</h1>')
})
app.get('/about', (req, res) => {
res.send('<h1>About page.....</h1>')
})
app.listen(3000, () => {
console.log(`server is listening on port 3000`)
})
we can clearly notice the difference and how simple and easy express js is. The good thing about express js is it sets the status code and content type automatically.
sending json in express
app.get('/', (req, res) => {
res.json({
name: 'hello',
age: 22
})
})
Middleware Functions
middleware functions are functions that have access to the request and response object. express has built in middleware but middleware also comes from 3rd party packages and we can also create custom middleware.
middleware can make changes to the request and response object.
sending static folder
create a public folder and add index.html, about.html, and contact.html, so when user goes to '/index.html' then that file will be served. '/about.html' servers about.html file
app.use(express.static(path.join(__dirname,'public')));
thanks for reading
Follow Me on Socials
Instagram Twitter GitHub Linkedin
Posted on July 13, 2022
Join Our Newsletter. No Spam, Only the good stuff.
Sign up to receive the latest update from our blog.
Related
September 27, 2022