Skip to content

01 Introduction to Express.js (Eng) .md

Latest commit

 

History

History
271 lines (188 loc) · 7.29 KB

01 Introduction to Express.js (Eng) .md

File metadata and controls

271 lines (188 loc) · 7.29 KB

🚀 ** Introduction to Express.js**

🧩 1. What is Express.js?

Express.js is a backend web application framework built on top of Node.js. It provides a simpler way to create servers, handle routes, manage requests and responses, and build RESTful APIs efficiently.

Think of Node.js as the engine, and Express.js as the car body — Express gives structure and tools to run the backend easily.

It is often called:

“The de facto standard server framework for Node.js.”

⚙️ 2. Why We Need Express.js

Before Express.js, working directly with Node.js HTTP module was complicated. You had to manually write code to handle routes, parse data, manage errors, etc. Express.js simplifies all that by providing:

  • A routing system
  • Middleware support
  • Error handling
  • Template engine support
  • REST API creation tools

So, instead of spending time on setup, you can focus on logic.

🏗️ 3. Core Features of Express.js

Feature Description
🧭 Routing Built-in router to define multiple endpoints for your web app or API.
🧱 Middleware Functions that process requests and responses — for authentication, logging, data parsing, etc.
⚙️ HTTP Methods Easily handle GET, POST, PUT, DELETE, PATCH, etc.
🧾 Template Engines Supports EJS, Pug, Handlebars to create dynamic HTML pages.
🌐 Static Files Serve images, CSS, JS directly using express.static().
🧩 REST API Support Build APIs that send and receive JSON effortlessly.
⚡ Performance Non-blocking I/O model from Node.js = fast and scalable.

🧠 4. How Express.js Works (Flow)

When a client (like a browser or frontend app) sends a request to the server:

  1. Request comes in (GET/POST/etc.)
  2. Express middleware processes the request (authentication, logging, validation)
  3. Route handler decides what to do with the request
  4. Response is sent back to the client (HTML page, JSON data, file, etc.)

Diagram Example:

[ Client ] → [ Express Server ]
     ↓
 Middleware (auth, body-parser, etc.)
     ↓
 Route Handler (GET / POST / PUT)
     ↓
[ Response sent to client ]

🧰 5. Basic Example: “Hello World” App

// Step 1: Import Express
const express = require('express');

// Step 2: Create an app
const app = express();

// Step 3: Create a route
app.get('/', (req, res) => {
  res.send('Hello, World! This is Express.js Server.');
});

// Step 4: Start the server
app.listen(3000, () => {
  console.log('Server is running on http://localhost:3000');
});

👉 Run this using:

node app.js

Then visit http://localhost:3000 in your browser.

🔁 6. Middleware in Express.js

Middleware are functions that run between the request and response. They can:

  • Log details
  • Parse data
  • Check authentication
  • Handle errors

Example:

app.use((req, res, next) => {
  console.log('Request received:', req.method, req.url);
  next(); // pass to the next middleware or route
});

🌐 7. Routing in Express.js

Routing defines how the server responds to different URL paths.

Example:

app.get('/', (req, res) => res.send('Home Page'));
app.get('/about', (req, res) => res.send('About Page'));
app.post('/login', (req, res) => res.send('Login Successful'));

Express makes routing clean, readable, and modular.

📦 8. Serving Static Files

You can serve images, CSS, and JS files easily using:

app.use(express.static('public'));

Now, any file inside the public folder is directly accessible from the browser.

💡 9. Working with JSON and APIs

To handle JSON data:

app.use(express.json());

app.post('/api/data', (req, res) => {
  console.log(req.body);
  res.json({ message: 'Data received successfully' });
});

This is what makes Express.js perfect for RESTful API development.

⚙️ 10. Template Engines

Express supports template engines like EJS, Pug, and Handlebars to build dynamic web pages.

Example (EJS):

app.set('view engine', 'ejs');
app.get('/profile', (req, res) => {
  res.render('profile', { name: 'Sakib', age: 21 });
});

🧩 11. Express.js Directory Structure (Example)

my-express-app/
│
├── app.js
├── package.json
├── routes/
│   ├── userRoutes.js
│   └── productRoutes.js
├── public/
│   ├── style.css
│   └── script.js
├── views/
│   └── index.ejs
└── middleware/
    └── auth.js

This structure keeps code organized and scalable.

🧾 12. Real-World Use Cases

✅ Backend for React / Angular / Vue apps ✅ RESTful APIs for mobile/web ✅ Authentication systems (JWT, Passport.js) ✅ E-commerce servers ✅ Blog or CMS backends ✅ Chat and real-time apps (with Socket.io)

📚 13. Advantages of Express.js

  • 🧩 Simple and flexible
  • ⚙️ High performance (built on Node.js)
  • 🌐 Perfect for REST API development
  • 🔌 Huge middleware ecosystem
  • 🧠 Easy learning curve for JavaScript developers
  • 🧾 Open-source and widely used

⚠️ 14. Disadvantages

Disadvantage Explanation
❌ Not strongly opinionated You must decide folder structure and design patterns.
⚙️ Callbacks can get complex Without async/await or promises, code can be messy.
🧩 Limited built-in tools Some features (like validation, ORM) require external libraries.

🏁 15. Summary Table

Feature Description
Framework Type Web Application Framework for Node.js
Language JavaScript
Creator TJ Holowaychuk
Initial Release 2010
License MIT
Use Case Build web servers, REST APIs, and backend apps
Main Advantage Fast, flexible, minimalistic

🌍 16. Popular Companies Using Express.js

  • Netflix
  • Uber
  • PayPal
  • Accenture
  • IBM
  • Fox Sports

They use it for its speed, simplicity, and scalability.

🧠 17. Summary (In One Sentence)

Express.js is a fast, minimal, and flexible Node.js framework that makes it easy to build web servers, APIs, and backend logic using JavaScript.