In JavaScript, we often work with objects and arrays.

But without a clean way to access values, our code becomes:

• repetitive

• long

• hard to read

Example problem:

const user = {
  name: "Amit",
  age: 22,
  city: "Pune"
};

console.log(user.name);
console.log(user.age);
console.log(user.city);

Here we are repeating user. again and again.

Now imagine doing this in a big project with 50+ fields

This is where destructuring helps us.

What is Destructuring?

Destructuring means extracting values from arrays or objects and storing them in variables in a simple way.

Instead of writing:

user.name
user.age

We directly get:

name
age

1. Array Destructuring

Before (Normal way)

const colors = ["red", "green", "blue"];

const first = colors[0];
const second = colors[1];
const third = colors[2];

Too much repetition

After (Destructuring)

const colors = ["red", "green", "blue"];

const [first, second, third] = colors;

console.log(first);  // red
console.log(second); // green
console.log(third);  // blue

Mapping idea:

Array → Variables
[red, green, blue] → first, second, third

2. Object Destructuring

Before

const user = {
  name: "Amit",
  age: 22
};

const name = user.name;
const age = user.age;

After

const user = {
  name: "Amit",
  age: 22
};

const { name, age } = user;

console.log(name); // Amit
console.log(age);  // 22

Mapping idea:

Object → Variables
{name: "Amit"} → name

Renaming while destructuring

const user = {
  name: "Amit"
};

const { name: userName } = user;

console.log(userName); // Amit

Sometimes data is missing.

Without default

const user = {};

const name = user.name;

console.log(name); // undefined

With default

const user = {};

const { name = "Guest" } = user;

console.log(name); // Guest

Array default value

const colors = [];

const [first = "red"] = colors;

console.log(first); // red

Benefits of Destructuring

1. Less code

const { name, age } = user;

Instead of:

const name = user.name;
const age = user.age;

2. More readable

Code becomes clean and easy to understand.

3. Avoid repetition

No need to write user.user.user...

Imagine you are entering an airport.

Before boarding a plane, you pass through several checkpoints:

1. Security Check

2. Identity Verification

3. Baggage Check

4. Boarding Gate

Only after passing these checkpoints can you enter the airplane.

Express applications work in a very similar way.

When a client sends a request to a server, we often need to:

• Log the request

• Check if the user is authenticated

• Validate request data

• Parse JSON data

If we write this code inside every route, our application becomes repetitive and difficult to maintain.

This is the problem Middleware solves.

What is Middleware?

Middleware is a function that runs between receiving a request and sending a response.

Think of middleware as a checkpoint.

Client Request
      |
      v
  Middleware
      |
      v
 Route Handler
      |
      v
Server Response

Middleware can:

• Read request data

• Modify request data

• Stop the request

• Send a response

• Pass control to the next middleware

Express Request Lifecycle

When a request reaches the server, it follows a pipeline.

Request
   |
   v
Middleware 1
   |
   v
Middleware 2
   |
   v
Middleware 3
   |
   v
Route Handler
   |
   v
Response

Every middleware gets a chance to process the request before it reaches the route handler.

Middleware Syntax

A middleware function receives three parameters:

function middleware(req, res, next) {
  console.log("Middleware executed");
  next();
}

Parameters:

• req → Request object

• res → Response object

• next → Function that passes control to the next middleware

Understanding next()

The next() function is one of the most important parts of middleware.

Without next(), the request gets stuck.

Example:

app.use((req, res, next) => {
  console.log("First Middleware");
  next();
});

app.get("/", (req, res) => {
  res.send("Home Page");
});

Output:

First Middleware
Home Page

Flow:

Request
   |
Middleware
   |
 next()
   |
Route Handler
   |
Response

What Happens Without next()?

app.use((req, res, next) => {
  console.log("Middleware Running");
});

Now the request never reaches the route handler.

Request
   |
Middleware
   |
STOP

The browser keeps waiting because Express does not know what to do next.

Types of Middleware in Express

Express provides different types of middleware.

1. Application-Level Middleware

This middleware is attached to the entire application.

Example:

app.use((req, res, next) => {
  console.log("Application Middleware");
  next();
});

This middleware runs for every request.

/login
/signup
/products
/profile

All routes pass through it.

2. Router-Level Middleware

Sometimes we want middleware for only specific routes.

Example:

const router = express.Router();

router.use((req, res, next) => {
  console.log("Router Middleware");
  next();
});

router.get("/profile", (req, res) => {
  res.send("Profile Page");
});

Only routes inside that router use this middleware.

3. Built-in Middleware

Express provides some middleware out of the box.

express.json()

Converts JSON request data into JavaScript objects.

app.use(express.json());

Example Request:

{
  "name": "Ashish"
}

Now you can access:

req.body.name

Without express.json(), req.body would be undefined.

express.static()

Used to serve static files.

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

Files inside the public folder become accessible directly.

Example:

public/logo.png

Access:

http://localhost:3000/logo.png

Middleware Execution Order

Middleware executes in the order it is registered.

Example:

app.use((req, res, next) => {
  console.log("Middleware 1");
  next();
});

app.use((req, res, next) => {
  console.log("Middleware 2");
  next();
});

app.get("/", (req, res) => {
  console.log("Route Handler");
  res.send("Hello");
});

Output:

Middleware 1
Middleware 2
Route Handler

Flow:

Request
   |
Middleware 1
   |
Middleware 2
   |
Route Handler
   |
Response

Real World Example 1: Logging Middleware

Suppose we want to know which routes users are accessing.

app.use((req, res, next) => {
  console.log(`\({req.method} \){req.url}`);
  next();
});

Output:

GET /products
POST /login
GET /profile

This is called Logging Middleware.

Real World Example 2: Authentication Middleware

Suppose some routes require login.

function authMiddleware(req, res, next) {
  const isLoggedIn = true;

  if (!isLoggedIn) {
    return res.status(401).send("Unauthorized");
  }

  next();
}

Using it:

app.get("/profile", authMiddleware, (req, res) => {
  res.send("Welcome User");
});

Flow:

Request
   |
Authentication Check
   |
   +--> Not Logged In
   |        |
   |    Unauthorized
   |
   +--> Logged In
            |
        Route Handler

Real World Example 3: Request Validation

Before creating a user, we can validate data.

function validateUser(req, res, next) {
  if (!req.body.name) {
    return res.status(400).send("Name Required");
  }

  next();
}

Using it:

app.post("/users", validateUser, (req, res) => {
  res.send("User Created");
});

This ensures invalid data never reaches the route handler.

Middleware Chain Example

Multiple middleware can work together.

app.get(
  "/profile",
  logger,
  authMiddleware,
  validateUser,
  (req, res) => {
    res.send("Profile Data");
  }
);

Execution Order:

Request
   |
Logger
   |
Authentication
   |
Validation
   |
Route Handler
   |
Response

This is called a Middleware Chain.

Why Middleware is Useful

Without middleware:

app.get("/profile", () => {
  // logging code
  // auth code
  // validation code
  // route logic
});

Every route would contain repeated code.

With middleware:

app.get(
  "/profile",
  logger,
  authMiddleware,
  validateUser,
  handler
);

The code becomes:

• Cleaner

• Reusable

• Easier to maintain

• Easier to debug

Conclusion

Middleware is one of the most powerful features of Express.

Think of it as a checkpoint in the request pipeline.

Whenever a request arrives, middleware gets an opportunity to inspect, modify, validate, or even stop the request before it reaches the route handler.

By separating logging, authentication, validation, and other common tasks into middleware, Express applications become cleaner, more organized, and easier to maintain.

Imagine you order a pizza.

You place the order and the pizza shop says:

"Your pizza will be delivered in 30 minutes."

Now you don't stand outside the shop waiting for 30 minutes. You continue doing other work and receive the pizza when it's ready.

Computers face a similar situation.

Sometimes JavaScript needs to wait for things like:

• API requests

• Database queries

• Reading files

• Timers

These tasks take time.

If JavaScript stopped everything and waited, the application would become slow and unresponsive.

So JavaScript starts the task and continues doing other work.

The question is:

How will JavaScript know when the result is ready?

That's where Promises come in.

What is a Promise?

A Promise is an object that represents a value that will be available in the future.

Think of it as:

"I don't have the result right now, but I promise I'll give it to you later."

Example:

const promise = new Promise((resolve, reject) => {
  setTimeout(() => {
    resolve("Pizza Delivered!");
  }, 3000);
});

In this example:

• Pizza is not available immediately.

• After 3 seconds, it gets delivered.

• The Promise notifies us when the result is ready.

Promise States

Every Promise can be in one of three states.

1. Pending

The task is still running.

Example:

const promise = new Promise(() => {});

Current state:

Pending

The result is not ready yet.

2. Fulfilled

The task completed successfully.

resolve("Success");

State:

Fulfilled

Result is available.

3. Rejected

Something went wrong.

reject("Error");

State:

Rejected

An error occurred.

Promise Lifecycle

A Promise always follows this path:

          Promise Created
                 |
                 v
             Pending
             /     \
            /       \
           v         v
      Fulfilled   Rejected

A Promise starts in the Pending state and eventually becomes either Fulfilled or Rejected.

It cannot go back to Pending.

Creating a Promise

Example:

const pizzaPromise = new Promise((resolve, reject) => {
  const pizzaReady = true;

  if (pizzaReady) {
    resolve("Pizza Delivered");
  } else {
    reject("Pizza Cancelled");
  }
});

Here:

• resolve() means success.

• reject() means failure.

Handling Success and Failure

We use .then() and .catch().

pizzaPromise
  .then((result) => {
    console.log(result);
  })
  .catch((error) => {
    console.log(error);
  });

Output:

Pizza Delivered

If something goes wrong:

Pizza Cancelled

Understanding .then()

.then() runs when the Promise is fulfilled.

promise.then((result) => {
  console.log(result);
});

Think of it as:

"When the task finishes successfully, run this code."

Understanding .catch()

.catch() runs when the Promise is rejected.

promise.catch((error) => {
  console.log(error);
});

Think of it as:

"If something fails, run this code."

Promises as Future Values

Let's imagine a friend says:

"I'll send you the notes tomorrow."

Right now you don't have the notes.

But you have a promise that you'll receive them later.

Similarly:

const notesPromise = getNotes();

At this moment:

notesPromise

does not contain the notes.

It contains a Promise that will provide the notes in the future.

Callback Approach

Before Promises, developers often used callbacks.

Example:

getUser(function(user) {
  getPosts(user.id, function(posts) {
    getComments(posts[0].id, function(comments) {
      console.log(comments);
    });
  });
});

Notice how code keeps moving to the right.

This is called:

Callback Hell

or

Pyramid of Doom

Because the code becomes difficult to read and maintain.

Promise Version

The same code can be written using Promises.

getUser()
  .then((user) => {
    return getPosts(user.id);
  })
  .then((posts) => {
    return getComments(posts[0].id);
  })
  .then((comments) => {
    console.log(comments);
  })
  .catch((error) => {
    console.log(error);
  });

This looks much cleaner and easier to understand.

Promise Chaining

A Promise can return another Promise.

This allows multiple asynchronous operations to run in sequence.

Example:

getUser()
  .then((user) => {
    return getPosts(user.id);
  })
  .then((posts) => {
    return getComments(posts[0].id);
  })
  .then((comments) => {
    console.log(comments);
  });

Each .then() waits for the previous Promise to finish.

This is called:

Promise Chaining

Real World Example

Fetching data from an API:

fetch("https://jsonplaceholder.typicode.com/users")
  .then((response) => response.json())
  .then((data) => {
    console.log(data);
  })
  .catch((error) => {
    console.log(error);
  });

Flow:

Send Request
      |
      v
   Pending
      |
      v
 Receive Response
      |
      v
 Fulfilled

If the network fails:

Rejected

Callback vs Promise

Conclusion

Promises help JavaScript handle tasks that take time, such as API calls, database operations, file reading, and timers.

Instead of deeply nested callbacks, Promises provide a cleaner and more readable way to manage asynchronous code.

Think of a Promise as a future value:

"The result is not available right now, but it will be available later."

Once you understand Promises, learning async/await becomes much easier because async/await is built on top of Promises.

When users upload things on a website like:

• photos 📸

• PDFs 📄

• images 🖼️

It does not come like normal text.

Normal data looks like:

{ "name": "Amit" }

But files are different:

• they are big

• they are not simple text

• they come in a special format

Express cannot understand files directly.

Simple Problem

Express can handle text data easily
But it cannot handle files by itself

So we need help.

Solution: We need a helper (Middleware)

Middleware is something that works between:

• user request

• server response

It helps Express understand special data like files.

What is Multer?

Multer is a tool used in Express to handle file uploads.

Simple meaning:

Multer = a helper that handles files

It does 3 things:

• takes file from request

• saves file in a folder

• gives file info to your code

How file upload works (simple flow)

Step 1:

User selects a file 📸

Step 2:

Browser sends file to server

Step 3:

Multer receives the file

Step 4:

Multer saves file in a folder

Step 5:

Your server gets file details

req.file

Basic setup

1. Install Multer

npm install multer

2. Set storage (where files will go)

import multer from "multer";

const storage = multer.diskStorage({
  destination: (req, file, cb) => {
    cb(null, "uploads/");
  },
  filename: (req, file, cb) => {
    cb(null, Date.now() + "-" + file.originalname);
  },
});

Meaning:

• files will be saved in uploads/ folder

• each file will have a unique name

3. Create upload middleware

const upload = multer({ storage });

Single file upload

app.post("/upload", upload.single("photo"), (req, res) => {
  console.log(req.file);
  res.send("File uploaded successfully");
});

Meaning:

• only one file is uploaded

• file data is in req.file

Multiple file upload

app.post("/upload", upload.array("photos", 5), (req, res) => {
  console.log(req.files);
  res.send("Multiple files uploaded successfully");
});

Meaning:

• multiple files allowed

• maximum 5 files

• file data is in req.files

Show uploaded files in browser

app.use("/uploads", express.static("uploads"));

Now files can be opened like:

http://localhost:3000/uploads/image.jpg

Full flow

User selects file
      ↓
Browser sends file
      ↓
Server receives request
      ↓
Multer handles file
      ↓
File is saved in uploads folder
      ↓
Server gets file info (req.file)
      ↓
Response is sent

“Can JavaScript run outside the browser?”

The answer changed everything in web development — Node.js

1. The Problem: JavaScript was only a browser language

Originally, JavaScript was designed only to run inside browsers like Chrome or Firefox.

So it could:

• Handle button clicks

• Validate forms

• Update UI dynamically

But it could NOT:

• Access databases

• Handle file systems

• Run backend APIs

• Work like Java, PHP, or Python on servers

In short:
JavaScript = frontend only language

Backend required separate languages like:

• Java

• PHP

• Python

• Ruby

This created a problem:

Developers had to learn TWO different languages for frontend and backend.

2. The Big Idea: What if JavaScript could run on servers?

This is where Node.js came in.

Node.js allows JavaScript to run outside the browser — especially on servers.

So now:

• Same language (JavaScript)

• Same syntax

• Same developer mindset

One language for full-stack development

3. How Node.js made it possible

Node.js is not a programming language.

It is a runtime environment.

Think of it like this:

• JavaScript = instructions (language)

• Node.js = machine that executes those instructions on server

It is built on:

V8 (JavaScript engine)

What is V8 (high level)?

• It is the engine inside Google Chrome

• It converts JavaScript into fast machine code

• Node.js takes this engine outside the browser

So basically:

Node.js = V8 engine + extra server features

4. Event-driven architecture (core idea)

Node.js uses something called event-driven, non-blocking I/O

Simple meaning:

Instead of waiting for one task to finish, Node.js:

• Starts a task

• Moves to next task

• Comes back when first task is done

Example:

If 3 users request data:

• Traditional backend → handles one by one (waiting)

• Node.js → handles all together efficiently

This makes Node.js very fast for scalable apps

5. Browser JS vs Node.js (simple comparison)

Browser JavaScript

• Runs in browser

• Controls UI

• Talks to DOM (buttons, pages)

• Cannot access file system

Node.js JavaScript

• Runs on server

• Handles APIs

• Talks to database

• Can read/write files

• Builds backend systems

6. Real-world use cases of Node.js

Node.js is used in many production systems:

• API servers (REST / GraphQL)

• Chat applications (real-time apps)

• Streaming platforms

• Backend for web apps

• Microservices architecture

• Tools like build systems (Webpack, Vite)

Companies using Node.js:

• Netflix

• PayPal

• LinkedIn

• Uber

7. Node.js vs Traditional Backend (Java / PHP)

Java / PHP approach:

• Separate frontend + backend languages

• More server overhead

• Thread-based handling (heavy in some cases)

Node.js approach:

• Single language (JavaScript everywhere)

• Lightweight and fast

• Event-driven model

• Great for real-time apps

That’s why startups love Node.js

8. JavaScript vs Runtime (important interview point)

This is a common confusion:

JavaScript

• A programming language

Node.js

• A runtime environment that executes JavaScript outside the browser

Same language, different environment

Imagine you're using Instagram, Facebook, or Amazon.

When you log in once, you can continue using the application without entering your password on every page.

Have you ever wondered how the application remembers that you are already logged in?

This is where authentication and JWT (JSON Web Token) come into the picture.

In this article, we'll understand JWT Authentication in Node.js in the simplest way possible.

Why Authentication is Required

The Problem

Suppose you have built a blogging application.

Anyone can access your website and try to:

• Create blog posts

• Edit posts

• Delete posts

• View private information

How will the server know who is a valid user?

Without authentication, anyone could perform actions they shouldn't.

The Solution

Authentication helps the server answer one important question:

"Who is making this request?"

When users prove their identity (usually with email and password), the server allows access to protected resources.

What is Authentication?

Authentication is the process of verifying a user's identity.

For example:

1. User enters email and password.

2. Server checks the credentials.

3. If correct, the user is authenticated.

4. The user gets access to protected features.

Think of authentication like showing your ID card before entering a secured office.

What is JWT?

JWT stands for JSON Web Token.

It is a compact string used to securely transfer user information between the client and server.

After a successful login, the server generates a JWT and sends it to the client.

The client stores the token and sends it with future requests.

Instead of asking for username and password every time, the server simply verifies the token.

Why JWT Became Popular

Before JWT, many applications stored login sessions on the server.

This created extra memory usage and complexity.

JWT introduced a simpler approach called Stateless Authentication.

What is Stateless Authentication?

The Problem

Imagine 10,000 users are logged in.

If the server stores login information for every user, memory usage keeps increasing.

Managing sessions becomes difficult.

The Solution

With JWT:

• The server creates a token.

• The client stores the token.

• The client sends the token with every request.

• The server verifies the token.

The server doesn't need to remember who is logged in.

This is called stateless authentication.

Structure of a JWT

A JWT contains three parts:

HEADER.PAYLOAD.SIGNATURE

Example:

eyJhbGciOiJIUzI1NiIsInR5cCI6IkpXVCJ9
.
eyJ1c2VySWQiOjEyMywiZW1haWwiOiJ1c2VyQGdtYWlsLmNvbSJ9
.
abcxyz123signature

Let's understand each section

1. Header

The header contains metadata about the token.

Example:

{
  "alg": "HS256",
  "typ": "JWT"
}

It tells:

• Which algorithm is used

• That the token type is JWT

2. Payload

The payload contains user information.

Example:

{
  "userId": 123,
  "email": "user@gmail.com"
}

This data is called claims.

Common claims include:

• User ID

• Email

• Role

• Expiration time

Important:

Do not store sensitive information like passwords inside the payload.

3. Signature

The signature ensures that the token has not been modified.

The server creates the signature using:

• Header

• Payload

• Secret Key

When a request arrives, the server verifies the signature.

If someone changes the payload, verification fails.

JWT Login Flow

Let's understand the complete flow.

Step 1: User Logs In

The user sends:

{
  "email": "user@gmail.com",
  "password": "123456"
}

Step 2: Server Verifies Credentials

The server checks the database.

If credentials are valid:

const token = jwt.sign(
  { userId: user.id },
  process.env.JWT_SECRET,
  { expiresIn: "1h" }
);

Step 3: Server Sends JWT

Response:

{
  "token": "jwt_token_here"
}

Step 4: Client Stores Token

The client stores the token:

• Local Storage

• Session Storage

• Cookies

Step 5: Client Sends Token

Whenever a protected route is accessed:

Authorization: Bearer jwt_token_here

JWT Authentication Flow Diagram

+--------+        Login Request        +--------+
| Client | --------------------------> | Server |
+--------+                             +--------+
     ^                                      |
     |                                      |
     |          JWT Token                   |
     +--------------------------------------+

Client stores token

Future Requests:

Client ---- JWT Token ----> Server

Server verifies token

Valid Token?
   |
   +-- Yes -> Allow Access
   |
   +-- No -> Reject Request

Creating JWT Authentication in Node.js

Install required packages:

npm install jsonwebtoken bcrypt

Generating a JWT

const jwt = require("jsonwebtoken");

const token = jwt.sign(
  { userId: 1 },
  "secretKey",
  { expiresIn: "1h" }
);

console.log(token);

Verifying a JWT

const decoded = jwt.verify(
  token,
  "secretKey"
);

console.log(decoded);

If verification succeeds, user data is returned.

If verification fails, an error is thrown.

Sending Token with Requests

The token is usually sent in the Authorization header.

GET /profile

Authorization: Bearer jwt_token_here

The word Bearer simply means:

"I am sending an access token."

Protecting Routes Using JWT

Some routes should only be accessible to logged-in users.

Examples:

• User Profile

• Dashboard

• Orders

• Settings

We can create middleware to verify the token.

const jwt = require("jsonwebtoken");

function authenticate(req, res, next) {
  const authHeader = req.headers.authorization;

  const token = authHeader?.split(" ")[1];

  if (!token) {
    return res
      .status(401)
      .json({ message: "Token missing" });
  }

  try {
    const decoded = jwt.verify(
      token,
      "secretKey"
    );

    req.user = decoded;

    next();
  } catch (error) {
    return res
      .status(401)
      .json({ message: "Invalid token" });
  }
}

Using Protected Routes

app.get(
  "/profile",
  authenticate,
  (req, res) => {
    res.json({
      message: "Welcome User",
      user: req.user,
    });
  }
);

If the token is valid:

{
  "message": "Welcome User"
}

Otherwise:

{
  "message": "Invalid token"
}

Token Validation Lifecycle

User Login
    |
    v
Generate JWT
    |
    v
Send JWT To Client
    |
    v
Client Stores JWT
    |
    v
Client Sends JWT
    |
    v
Server Verifies JWT
    |
    +---- Valid ----> Access Granted
    |
    +---- Invalid ---> Access Denied

Advantages of JWT

• Stateless authentication

• Fast verification

• Works well with APIs

• Easy to scale applications

• Can be used across different services

• Reduces server-side session storage

Limitations of JWT

• Tokens cannot be easily revoked before expiration

• Larger than session IDs

• Incorrect handling can create security risks

For most modern web applications, JWT remains one of the most popular authentication methods.

Conclusion

Authentication is an essential part of modern web applications. JWT provides a simple and scalable way to authenticate users without storing sessions on the server.

The basic idea is straightforward:

• User logs in

• Server generates a JWT

• Client stores the token

• Client sends the token with requests

• Server verifies the token

• Protected resources become accessible

Once you understand this flow, implementing authentication in Node.js becomes much easier and you'll be ready to build secure APIs and full-stack applications.

When building backend applications with Node.js, handling routes, requests, and responses using only the core http module becomes repetitive and complex. That’s where Express.js comes in.

In this article, we will understand:

• What Express.js is

• Why it simplifies Node.js development

• How to create a first server

• Handling GET and POST requests

• Sending responses properly

• Difference between raw Node.js server and Express

What is Express.js?

Express.js is a minimal and fast web framework built on top of Node.js.

It provides a simple way to:

• Create servers

• Define routes

• Handle requests and responses

• Build APIs quickly

Why Express simplifies Node.js development

Without Express, Node.js requires manual handling of:

• Routing logic

• Request parsing

• Response formatting

With Express, everything becomes clean and structured.

Key benefits:

• Less boilerplate code

• Easy routing system

• Built-in middleware support

• Faster API development

Creating your first Express server

Step 1: Install Express

npm install express

Step 2: Create server file

const express = require("express");

const app = express();

app.listen(3000, () => {
  console.log("Server is running on port 3000");
});

Now your server is running on:

http://localhost:3000

Handling GET requests

GET requests are used to fetch data.

app.get("/", (req, res) => {
  res.send("Hello from Express GET request!");
});

Example route:

GET /home

app.get("/home", (req, res) => {
  res.send("Welcome to Home Page");
});

Handling POST requests

POST requests are used to send data to the server.

Enable JSON parsing middleware:

app.use(express.json());

POST route example:

app.post("/user", (req, res) => {
  const user = req.body;

  res.send({
    message: "User received successfully",
    data: user
  });
});

Sending responses in Express

Express provides multiple ways to send responses:

1. Plain text res.send("Hello World");

2. JSON response res.json({ success: true, message: "Data fetched" });

3. Status codes with response res.status(201).json({ message: "Created successfully" });

Raw Node.js vs Express.js comparison

Without Express (Raw Node.js)

const http = require("http");

const server = http.createServer((req, res) => {
  if (req.url === "/" && req.method === "GET") {
    res.end("Hello from Node");
  }
});

server.listen(3000);

With Express

const express = require("express");
const app = express();

app.get("/", (req, res) => {
  res.send("Hello from Express");
});

app.listen(3000);

Key difference:

• Node.js → manual routing, more code

• Express → clean routing, less code

Request → Response Flow (Concept)

Client Request
     ↓
Express Router
     ↓
Route Handler Function
     ↓
Response Sent (res.send / res.json)

Express Routing Structure

app
 ├── GET /home
 ├── GET /about
 ├── POST /user
 └── DELETE /user/:id

Each route handles a specific request type and URL

Imagine you are standing in a queue at a bank.

The cashier is serving one person at a time. Until the current person's work is finished, nobody else can be served.

This is how synchronous execution works.

Now imagine you order food online. After placing the order, you continue watching a movie while the restaurant prepares your food. When the food is ready, you receive it.

This is how asynchronous execution works.

JavaScript uses both approaches, but asynchronous programming is one of the most important concepts every developer must understand.

In this article, we'll learn:

• What synchronous code means

• What asynchronous code means

• Why JavaScript needs asynchronous behavior

• Blocking vs non-blocking code

• Real-world examples using timers and API calls

• How JavaScript handles asynchronous tasks

The Problem

Computers execute instructions one after another.

Suppose a program has to:

1. Display user information

2. Fetch data from a server

3. Update the UI

Fetching data from a server may take several seconds.

If JavaScript waits for that operation to finish before moving ahead, the entire application becomes slow and unresponsive.

This is the problem asynchronous programming solves.

What is Synchronous JavaScript?

Synchronous means:

Execute one task at a time in order.

The next line of code cannot run until the current line finishes execution.

Example

console.log("Step 1");

console.log("Step 2");

console.log("Step 3");

Output

Step 1
Step 2
Step 3

Execution happens exactly in the order the code is written.

How Synchronous Execution Works

Timeline

Start
  |
  v
Step 1
  |
  v
Step 2
  |
  v
Step 3
  |
  v
 End

Each task must finish before the next task starts.

What is Asynchronous JavaScript?

Asynchronous means:

Start a task and continue executing other code without waiting for that task to finish.

When the task completes, JavaScript handles the result later.

Example Using setTimeout

console.log("Start");

setTimeout(() => {
  console.log("Timer Finished");
}, 2000);

console.log("End");

Output

Start
End
Timer Finished

Many beginners expect:

Start
Timer Finished
End

But that does not happen.

JavaScript does not wait for the timer.

Instead, it continues executing the remaining code.

Why Does JavaScript Need Asynchronous Behavior?

JavaScript runs on a single thread.

This means it can do only one thing at a time.

If JavaScript waited for every slow operation, websites would freeze.

Examples of slow operations:

• API requests

• Database queries

• Reading files

• Network requests

• Timers

Without asynchronous programming, users would have a terrible experience.

Real-Life Example

Suppose you open Instagram.

The application needs to:

• Load posts

• Load profile data

• Load comments

• Load notifications

Fetching all this data takes time.

If JavaScript waited for each request to complete before doing anything else, the app would feel extremely slow.

Instead, requests are handled asynchronously.

The UI remains responsive while data loads in the background.

Blocking Code

Blocking code prevents other code from executing until the current task finishes.

Example

function longTask() {
  const start = Date.now();

  while (Date.now() - start < 5000) {
    // Wait 5 seconds
  }
}

console.log("Start");

longTask();

console.log("End");

Output

Start
(Wait 5 seconds)
End

The program becomes stuck for 5 seconds.

This is called blocking behavior.

Problems with Blocking Code

Blocking code can cause:

• Slow applications

• Frozen UI

• Poor user experience

• Delayed user interactions

Imagine clicking a button and waiting several seconds before the page responds.

Users would quickly leave the website.

Non-Blocking Code

Non-blocking code allows JavaScript to continue executing while waiting for a task to finish.

Example

console.log("Start");

setTimeout(() => {
  console.log("Task Completed");
}, 5000);

console.log("End");

Output

Start
End
Task Completed

The application remains responsive.

API Call Example

Fetching data from a server is a common asynchronous operation.

fetch("https://jsonplaceholder.typicode.com/users")
  .then(response => response.json())
  .then(data => {
    console.log(data);
  });

console.log("Fetching data...");

Output

Fetching data...
[Users Data]

JavaScript starts the request and immediately continues executing other code.

When data arrives, the callback runs.

Understanding the Task Queue

When an asynchronous operation finishes, JavaScript does not execute it immediately.

Instead, it places the callback inside a queue.

The Event Loop checks:

1. Is the Call Stack empty?

2. If yes, move tasks from the queue to the Call Stack.

Simplified Flow

Async Task
     |
     v
Task Queue
     |
     v
Event Loop
     |
     v
Call Stack

This mechanism makes asynchronous JavaScript possible.

Synchronous vs Asynchronous

Visual Comparison

Synchronous

Task 1
  ↓
Task 2
  ↓
Task 3
  ↓
Task 4

Everything happens one after another.

Asynchronous

Start Task
     |
     +------> Continue Other Work
     |
Task Completes Later
     |
     v
Execute Callback

The program remains active while waiting.

When Do We Use Asynchronous Programming?

Common scenarios include:

• API requests

• Database operations

• Timers

• File reading

• Uploading files

• Downloading images

• Chat applications

• Real-time notifications

Modern web applications rely heavily on asynchronous programming.

Conclusion

Synchronous code executes line by line and waits for each task to finish before moving to the next one.

Asynchronous code allows JavaScript to start a task and continue doing other work without waiting.

Because JavaScript runs on a single thread, asynchronous behavior is essential for handling slow operations like API calls, database requests, timers, and file operations without freezing the application.

Understanding synchronous and asynchronous programming is the first step toward learning Promises, Async/Await, the Event Loop, and advanced JavaScript concepts.

A user clicks the "Check Balance" button. Your application tries to fetch data from the server, but suddenly the internet connection is lost.

What should happen?

• Should the application crash?

• Should users see a blank screen?

• Should it show a helpful error message?

This is where Error Handling comes into the picture.

In JavaScript, errors are unavoidable. Servers can fail, APIs can stop responding, users can enter invalid data, and bugs can appear unexpectedly.

A good developer doesn't try to eliminate every error. Instead, they handle errors gracefully so the application continues to work properly.

In this article, we'll learn what errors are, how to use try, catch, and finally, how to throw custom errors, and why error handling is essential in real-world applications

The Problem: Applications Can Crash

Imagine you're building an online shopping application.

A user clicks the "View Product" button.

Your code tries to fetch product details from a server:

const product = getProductDetails();
console.log(product.name);

What if the server is down?

What if the product doesn't exist?

What if product becomes undefined?

JavaScript will throw an error, and your program may stop executing.

Example:

const user = undefined;

console.log(user.name);

Output:

TypeError: Cannot read properties of undefined

Without proper handling, the application may break and provide a poor user experience.

What Are Errors in JavaScript?

An error is something that prevents JavaScript from executing code correctly.

Common types of errors include:

1. Syntax Error

Occurs when JavaScript code is written incorrectly.

console.log("Hello"

Output:

SyntaxError: missing ) after argument list

2. Reference Error

Occurs when a variable doesn't exist.

console.log(username);

Output:

ReferenceError: username is not defined

3. Type Error

Occurs when an operation is performed on an invalid type.

const user = null;

console.log(user.name);

Output:

TypeError: Cannot read properties of null

4. Range Error

Occurs when a value is outside the allowed range.

const num = 10;

num.toPrecision(500);

Output:

RangeError

Why Do We Need Error Handling?

Imagine a banking application.

A user tries to transfer money.

If an error occurs and the application crashes, the user won't know what happened.

Instead of crashing, we should:

• Detect errors

• Handle them gracefully

• Show meaningful messages

• Continue running the application

This is exactly what try and catch help us do.

Using Try and Catch

The try block contains code that may throw an error.

The catch block handles the error if one occurs.

Syntax:

try {
  // risky code
} catch (error) {
  // handle error
}

Example:

try {
  const user = null;

  console.log(user.name);
} catch (error) {
  console.log("Something went wrong");
}

Output:

Something went wrong

Instead of crashing, the program handles the error gracefully.

Understanding the Error Object

The catch block receives an error object.

try {
  console.log(userName);
} catch (error) {
  console.log(error);
}

Output:

ReferenceError: userName is not defined

Useful properties:

try {
  console.log(userName);
} catch (error) {
  console.log(error.name);
  console.log(error.message);
}

Output:

ReferenceError
userName is not defined

These details are extremely useful while debugging applications.

Real-World Example

Suppose we're parsing JSON data received from an API.

try {
  const data = JSON.parse("invalid json");

  console.log(data);
} catch (error) {
  console.log("Invalid JSON received");
}

Output:

Invalid JSON received

Without try-catch, the application would throw an error and stop.

The Finally Block

Sometimes we need code that should execute whether an error occurs or not.

For this purpose, JavaScript provides the finally block.

Syntax:

try {
  // code
} catch (error) {
  // handle error
} finally {
  // always runs
}

Example of Finally

try {
  console.log("Connecting to server");
} catch (error) {
  console.log("Error occurred");
} finally {
  console.log("Connection closed");
}

Output:

Connecting to server
Connection closed

Even when an error occurs:

try {
  console.log(userName);
} catch (error) {
  console.log("Error handled");
} finally {
  console.log("Cleanup completed");
}

Output:

Error handled
Cleanup completed

The finally block always executes.

Real-World Use Cases of Finally

Common scenarios:

• Closing database connections

• Hiding loading spinners

• Releasing resources

• Cleaning temporary files

Example:

showLoader();

try {
  fetchData();
} catch (error) {
  console.log("Failed to fetch data");
} finally {
  hideLoader();
}

No matter what happens, the loader is removed.

Throwing Custom Errors

JavaScript also allows developers to create their own errors using the throw keyword.

This is useful when business rules are violated.

Example:

const age = 15;

if (age < 18) {
  throw new Error("You must be at least 18 years old");
}

Output:

Error: You must be at least 18 years old

Handling Custom Errors

try {
  const age = 15;

  if (age < 18) {
    throw new Error("You must be at least 18 years old");
  }

  console.log("Access Granted");
} catch (error) {
  console.log(error.message);
}

Output:

You must be at least 18 years old

Practical Example: ATM Withdrawal

Imagine an ATM machine.

A user wants to withdraw ₹10,000.

Current balance is ₹5,000.

try {
  const balance = 5000;
  const withdrawAmount = 10000;

  if (withdrawAmount > balance) {
    throw new Error("Insufficient balance");
  }

  console.log("Withdrawal successful");
} catch (error) {
  console.log(error.message);
}

Output:

Insufficient balance

This is a perfect example of a custom error.

Error Handling Flow

Program Starts
      |
      v
   try Block
      |
      |
 Error?
  /     \
Yes      No
 |         |
 v         v
catch    Skip
 Block   catch
   \      /
    \    /
     v  v
   finally
      |
      v
 Program Ends

Why Error Handling Matters

Good error handling provides several benefits:

Better User Experience

Users see meaningful messages instead of broken applications.

"Unable to load data. Please try again."

Instead of:

TypeError: Cannot read properties of undefined

Easier Debugging

Error details help developers quickly identify problems.

console.log(error.name);
console.log(error.message);

Prevents Application Crashes

Applications continue running even when something goes wrong.

Many beginners get confused because both Spread and Rest use three dots. The key difference is:

• Spread Operator → Expands values

• Rest Operator → Collects values

Let's understand them with simple examples.

The Problem

Imagine you have an array:

const fruits = ["Apple", "Banana", "Mango"];

Sometimes you want to:

• Take elements out of an array individually

• Merge arrays

• Copy arrays or objects

• Accept multiple function arguments

JavaScript provides Spread and Rest operators to solve these problems easily.

What is the Spread Operator?

The Spread Operator (...) expands an iterable (such as an array or object) into individual elements.

Think of it like:

Packed Box → Open Everything Inside

Syntax

...value

Spread with Arrays

Example

const numbers = [1, 2, 3];

console.log(...numbers);

Output

1 2 3

The array gets expanded into individual values.

Copying an Array

Without Spread

const arr1 = [1, 2, 3];
const arr2 = arr1;

This creates a reference, not a copy.

With Spread

const arr1 = [1, 2, 3];
const arr2 = [...arr1];

console.log(arr2);

Output

[1, 2, 3]

Now arr2 is a new array.

Merging Arrays

Example

const frontend = ["HTML", "CSS"];
const javascript = ["JavaScript", "React"];

const skills = [...frontend, ...javascript];

console.log(skills);

Output

["HTML", "CSS", "JavaScript", "React"]

Spread expands both arrays and combines them.

Spread with Objects

Example

const user = {
  name: "Ashish",
  age: 24,
};

const updatedUser = {
  ...user,
  city: "Pune",
};

console.log(updatedUser);

Output

{
  name: "Ashish",
  age: 24,
  city: "Pune"
}

Spread copies existing properties and adds new ones.

Real-World Use Case of Spread

Updating React state:

setUser({
  ...user,
  name: "Ashish Gaikwad",
});

Instead of rewriting the whole object, spread copies existing values and updates only the required property.

What is the Rest Operator?

The Rest Operator (...) collects multiple values into a single array.

Think of it like:

Many Values → Pack Into One Box

Syntax

...variable

Rest in Function Parameters

Example

function addNumbers(...numbers) {
  console.log(numbers);
}

addNumbers(10, 20, 30, 40);

Output

[10, 20, 30, 40]

All arguments are collected into a single array.

Sum Using Rest Operator

function sum(...numbers) {
  return numbers.reduce((acc, num) => acc + num, 0);
}

console.log(sum(1, 2, 3, 4, 5));

Output

15

Rest with Array Destructuring

Example

const colors = ["Red", "Blue", "Green", "Yellow"];

const [first, ...remaining] = colors;

console.log(first);
console.log(remaining);

Output

Red
["Blue", "Green", "Yellow"]

The first value is extracted and the rest are collected into an array.

Rest with Objects

Example

const user = {
  name: "Ashish",
  age: 24,
  city: "Pune",
};

const { name, ...otherDetails } = user;

console.log(name);
console.log(otherDetails);

Output

Ashish

{
  age: 24,
  city: "Pune"
}

The remaining properties are collected into a new object.

Spread vs Rest

Visual Diagram

Spread Operator

Array
[1, 2, 3]

   ...
    ↓

1   2   3

Expands values.

Rest Operator

1   2   3   4

   ...

    ↓

[1, 2, 3, 4]

Collects values.

When to Use Spread

Use Spread when you want to:

• Copy arrays

• Copy objects

• Merge arrays

• Merge objects

• Pass array elements as function arguments

When to Use Rest

Use Rest when you want to:

• Accept unlimited function arguments

• Gather remaining array elements

• Gather remaining object properties

"How do I start my first Node.js application?"

In this article, we'll learn how to install Node.js, verify the installation, understand the Node REPL, create our first JavaScript file, run it using Node, and finally build a simple Hello World server.

The Problem

JavaScript originally worked only inside browsers.

If you wanted to run JavaScript outside the browser, create servers, read files, or interact with databases, you couldn't do it.

For example:

console.log("Hello World");

This code runs in Chrome, Firefox, or Edge.

But how can we run it directly from our computer's terminal?

This is where Node.js comes in.

What is Node.js?

Node.js is a JavaScript runtime that allows JavaScript code to run outside the browser.

Think of it like this:

• Browser = Runs JavaScript inside websites

• Node.js = Runs JavaScript on your computer

With Node.js, you can build:

• Backend APIs

• Web servers

• Real-time applications

• Command-line tools

• Full-stack applications

Installing Node.js

Visit the official Node.js website:

https://nodejs.org

Download the LTS (Long-Term Support) version.

The installation process is similar across operating systems:

1. Download Node.js

2. Run the installer

3. Follow the setup wizard

4. Complete installation

After installation, Node.js and npm are installed automatically.

What is npm?

npm stands for Node Package Manager.

It helps us install and manage packages used in Node.js projects.

Checking the Installation

Open your terminal and run:

node -v

Example output:

v24.1.0

Now check npm:

npm -v

Example output:

11.2.0

If both commands show versions, Node.js is installed successfully.

Understanding Node REPL

Before creating files, let's understand REPL.

REPL stands for:

• Read

• Evaluate

• Print

• Loop

Node REPL is an interactive environment where you can execute JavaScript code directly from the terminal.

Start REPL:

node

You will see something like:

>

Now type:

2 + 3

Output:

5

Try:

const name = "Ashish";
name

Output:

'Ashish'

Node immediately reads your code, executes it, prints the result, and waits for the next command.

That's why it's called REPL.

Exit REPL:

.exit

or

Ctrl + C

(two times)

Creating Your First JavaScript File

Create a file named:

app.js

Add the following code:

console.log("Hello from Node.js");

Save the file.

Running the Script Using Node

Open terminal in the same folder.

Run:

node app.js

Output:

Hello from Node.js

Congratulations!

You just executed your first Node.js application.

How Node Executes a Script

The execution flow looks like this:

app.js
   ↓
Node Runtime
   ↓
JavaScript Engine
   ↓
Output in Terminal

Step-by-Step

1. Node reads the file.

2. Node sends JavaScript code to the JavaScript engine.

3. The engine executes the code.

4. Result appears in the terminal.

Building a Hello World Server

Printing text is useful, but backend developers create servers.

Let's create our first web server.

Create a file:

const http = require("http");

const server = http.createServer((req, res) => {
  res.end("Hello World");
});

server.listen(3000, () => {
  console.log("Server running on port 3000");
});

Understanding the Code

Import HTTP Module

const http = require("http");

Node provides a built-in HTTP module for creating servers.

Create Server

const server = http.createServer((req, res) => {
  res.end("Hello World");
});

Whenever a request arrives:

• req contains request information.

• res is used to send a response.

Start Listening

server.listen(3000);

The server starts listening on port 3000.

Running the Server

Execute:

node app.js

Output:

Server running on port 3000

Open your browser and visit:

http://localhost:3000

You will see:

Hello World

Your first Node.js server is now running successfully.

Node Execution Flow

The overall flow looks like this:

Browser Request
       ↓
Node.js Server
       ↓
Request Handler
       ↓
Response Sent
       ↓
Browser Displays Result

Most developers use built-in string methods every day. However, in frontend interviews, especially for JavaScript roles, interviewers often go one step further and ask:

"Can you implement this method yourself?"

This is where understanding string polyfills becomes valuable.

In this article, we'll learn what string methods are, why developers write polyfills, how common string utilities work internally, and some popular interview questions related to strings

The Problem

Imagine you're building a JavaScript application and need to check whether a string contains a specific word.

You can simply write:

const text = "JavaScript is awesome";

console.log(text.includes("awesome"));

Output:

true

Easy, right?

But what if this method didn't exist?

Could you build it yourself?

That's exactly what interviewers want to test.

They are not interested in whether you remember the method name.

They want to know whether you understand the logic behind it.

What Are String Methods?

String methods are built-in functions provided by JavaScript that allow us to manipulate and process text.

Examples:

let name = "Ashish";

name.toUpperCase();
name.toLowerCase();
name.includes("shi");
name.startsWith("A");
name.endsWith("h");
name.trim();
name.split("");

These methods help us perform common text operations without writing complex logic every time.

Why Developers Write Polyfills

A polyfill is custom code that replicates the behavior of a built-in JavaScript method.

Think of it as:

"If JavaScript didn't provide this method, how would I create it myself?"

Developers write polyfills to:

• Understand internal working of JavaScript methods

• Support older browsers

• Improve problem-solving skills

• Prepare for interviews

Many JavaScript interviews include questions like:

• Create your own includes()

• Implement startsWith()

• Build a custom trim()

• Create a custom split()

How Built-in Methods Work Conceptually

Let's understand the idea behind string processing.

String Processing Flow

Input String
      │
Character Traversal
      │
Condition Checking
      │
Result Generation
      │
Return Output

Almost every string method follows this pattern.

The method reads characters one by one, performs some checks, and returns a result.

Polyfill for includes()

Built-in Method

const text = "JavaScript";

console.log(text.includes("Script"));

Output:

true

Logic

1. Traverse the string.

2. Check every possible position.

3. Compare characters.

4. If all characters match, return true.

5. Otherwise return false.

Polyfill

String.prototype.myIncludes = function(search) {
  const str = this;

  for (let i = 0; i <= str.length - search.length; i++) {
    let match = true;

    for (let j = 0; j < search.length; j++) {
      if (str[i + j] !== search[j]) {
        match = false;
        break;
      }
    }

    if (match) {
      return true;
    }
  }

  return false;
};

Usage:

console.log("JavaScript".myIncludes("Script"));

Output:

true

Polyfill for startsWith()

Built-in Method

console.log("JavaScript".startsWith("Java"));

Output:

true

Logic

Compare characters from the beginning of the string

Polyfill

String.prototype.myStartsWith = function(search) {
  const str = this;

  for (let i = 0; i < search.length; i++) {
    if (str[i] !== search[i]) {
      return false;
    }
  }

  return true;
};

Usage:

console.log("JavaScript".myStartsWith("Java"));

Output:

true

Polyfill for endsWith()

Built-in Method

console.log("JavaScript".endsWith("Script"));

Output:

true

Logic

Start comparing from the end of both strings.

Polyfill

String.prototype.myEndsWith = function(search) {
  const str = this;

  if (search.length > str.length) {
    return false;
  }

  let start = str.length - search.length;

  for (let i = 0; i < search.length; i++) {
    if (str[start + i] !== search[i]) {
      return false;
    }
  }

  return true;
};

Polyfill for trim()

Built-in Method

const text = "   hello world   ";

console.log(text.trim());

Output:

hello world

Logic

Remove spaces from:

• Beginning

• End

Keep spaces in the middle unchanged.

Polyfill

String.prototype.myTrim = function() {
  let start = 0;
  let end = this.length - 1;

  while (this[start] === " ") {
    start++;
  }

  while (this[end] === " ") {
    end--;
  }

  return this.slice(start, end + 1);
};

Final Thoughts

Most developers use methods like includes(), startsWith(), and trim() every day without thinking about what happens internally.

However, understanding the logic behind these methods helps you become a stronger JavaScript developer and perform better in interviews.

The next time you use a built-in string method, ask yourself:

"If JavaScript didn't provide this method, could I build it myself?"

If your answer is yes, you're developing the kind of problem-solving mindset that interviewers look for.

Customers keep coming in and placing orders. One wants tea, another wants coffee, another wants a pizza, and someone else wants a burger.

Now imagine there is only one chef in the kitchen.

At first, this sounds like a disaster.

How can one chef handle so many orders at the same time?

Surprisingly, that's exactly how Node.js works.

Even though Node.js runs JavaScript on a single thread, it can efficiently handle thousands of requests. Let's understand how.

The Problem

Most beginners hear this statement:

"Node.js is single-threaded."

Then a question immediately comes to mind:

"If there is only one thread, how can Node.js serve hundreds or thousands of users simultaneously?"

To answer this, we first need to understand the difference between a thread and a process

Process vs Thread

Process

A process is an independent running program.

For example:

• Chrome browser

• VS Code

• Spotify

Each of these runs as a separate process.

Think of a process as an entire restaurant building.

Thread

A thread is a worker inside a process.

A process can have one thread or multiple threads.

Think of threads as chefs working inside the restaurant.

Many traditional servers create multiple threads to handle multiple requests.

Node.js takes a different approach.

Node.js is Single-Threaded

Node.js uses a single main thread to execute JavaScript code.

This means:

• One call stack

• One JavaScript execution thread

• One event loop

Only one JavaScript task runs at a time.

This sounds limiting, but Node.js becomes powerful because of its Event Loop.

The Chef Analogy

Let's return to our restaurant.

A customer orders pizza.

Instead of standing near the oven and waiting 20 minutes, the chef puts the pizza into the oven and starts taking another order.

While the oven is doing its work, the chef remains free.

When the pizza is ready, the chef serves it.

This is exactly how Node.js handles requests.

The main thread does not sit idle waiting for slow operations.

It delegates them and continues handling new requests.

What is the Event Loop?

The Event Loop is the heart of Node.js.

Its job is to continuously check:

1. Is there any task waiting to be executed?

2. Is the call stack empty?

3. If yes, move the next task to execution.

The event loop allows Node.js to manage many operations without creating a new thread for every request.

How Multiple Requests are Handled

Suppose three users send requests simultaneously.

app.get("/user", (req, res) => {
  fs.readFile("user.txt", (err, data) => {
    res.send(data);
  });
});

Step 1

Request A arrives.

Node.js starts reading the file.

Since file reading is an I/O operation, Node.js delegates it to the system.

Step 2

Instead of waiting, Node.js immediately becomes available.

Request B arrives.

Node.js starts processing Request B.

Step 3

Request C arrives.

Node.js processes Request C as well.

Step 4

When file reading completes, the callback is placed into a queue.

The Event Loop picks it up and executes it.

The response is then sent to the client.

As a result:

• Requests are not blocked

• The main thread remains free

• Many users can be served efficiently

Delegating Work to Background Workers

Node.js does not perform heavy I/O tasks itself.

Instead, it delegates work to:

• Operating System

• libuv Thread Pool

Examples:

• File system operations

• Database communication

• Network requests

• DNS lookups

• Some cryptographic operations

While these tasks are running elsewhere, the main JavaScript thread remains available

Event Loop + Worker Flow

Client Request
       |
       v
 Main Thread
       |
       v
 Delegates Task
       |
       v
 Worker Thread / OS
       |
       v
 Task Completed
       |
       v
 Callback Queue
       |
       v
 Event Loop
       |
       v
 Response Sent

Single Thread Handling Multiple Requests

Request A ----\
Request B ----- > Main Thread
Request C ----/
                    |
                    v
             Event Loop
                    |
                    v
              Send Responses

But there are two common ways to pass data:

• URL Parameters

• Query Strings

At first, they look similar, but they are used for completely different purposes.

Let’s understand them in a simple way.

The Problem

Imagine you are building a website like Instagram or an e-commerce app.

You need to:

• Show a user profile

• Search products

• Filter products by price or category

Now the question is:

How will the browser send this information to the server?

This is where URL Parameters and Query Strings come in.

1. What are URL Parameters?

URL parameters are used to identify a specific thing.

Think of it like:

“Give me THIS exact user”

Example:

/users/101

Here:

• 101 is the user ID

• It identifies a single user

So URL params are like identity tags

Real-life meaning:

• User profile page

• Product detail page

• Order details page

You are asking for ONE specific resource

In Express.js

app.get("/users/:id", (req, res) => {
  const userId = req.params.id;
  res.send(`User ID is ${userId}`);
});

Accessing params:

req.params

2. What are Query Strings?

Query strings are used to filter or modify data.

Think of it like:

“Give me users, but only filtered ones”

Example:

/users?role=admin&age=25

Here:

• role=admin → filter

• age=25 → filter condition

So query strings are like search filters

Real-life meaning:

• Search products

• Filter by price

• Sort data

You are asking for MULTIPLE or filtered results

In Express.js

app.get("/users", (req, res) => {
  const role = req.query.role;
  const age = req.query.age;

  res.send(`Role: \({role}, Age: \){age}`);
});

Accessing query:

req.query

3. Difference Between Params and Query Strings

4. When to Use What?

Use URL Params when:

• You want a specific item

• Like user profile, product page

Example:

/products/10

Use Query Strings when:

• You want to filter or search data

• Like sorting, filtering, pagination

Example:

/products?category=mobile&price=low

Diagram Idea (Mental Picture)

/users/101
      ↑
   PARAM (identity)

-----------------------

/users?role=admin&age=25
        ↑           ↑
      QUERY      QUERY (filters)

A user selects an image and clicks the Upload button.

The image successfully reaches your Express server.

Now a question arises:

Where should this uploaded file be stored?

And after storing it, how can other users view that image through a URL?

This is where file storage and static file serving come into the picture.

In this article, we'll understand how Express stores uploaded files, how static files are served, and some important security practices

The Problem

Suppose a user uploads a file.

User → Express Server → ?

The server receives the file, but where should it keep it?

If the server doesn't store the file anywhere, it will disappear after the request is completed.

So we need a place to save uploaded files and a way to access them later.

Example of the Problem

Let's say a user uploads:

profile-picture.jpg

The server receives the file.

Without storage:

User Uploads File
       ↓
Server Receives File
       ↓
   Request Ends
       ↓
   File Lost

We need permanent storage.

1. Local Storage

Files are stored inside the application's folder structure.

Example:

project/
│
├── uploads/
│   ├── image1.jpg
│   ├── image2.png
│   └── document.pdf
│
├── server.js
└── package.json

When a user uploads a file, it is saved inside the uploads folder.

Advantages

• Easy to implement

• Good for learning projects

• No additional services required

Disadvantages

• Limited storage

• Files may be lost if the server crashes

• Difficult to scale across multiple servers

2. External Storage

Instead of storing files on the local machine, files are stored on cloud services.

Examples:

• Amazon Web Services S3

• Cloudinary

• Google Cloud Storage

Flow:

User
  ↓
Express Server
  ↓
Cloud Storage

Advantages

• Highly scalable

• Better reliability

• Easy file sharing

Disadvantages

• Additional cost

• More setup required

Upload Storage Folder Structure

A common project structure looks like this:

project/
│
├── uploads/
│   ├── profiles/
│   │   ├── user1.jpg
│   │   └── user2.jpg
│   │
│   ├── documents/
│   │   ├── resume.pdf
│   │   └── report.pdf
│
├── routes/
├── controllers/
├── server.js
└── package.json

Organizing files into folders makes management easier.

Serving Static Files in Express

What is a Static File?

A static file is a file that is sent directly to the browser without processing.

Examples:

• Images

• Videos

• CSS files

• PDFs

• JavaScript files

Express provides middleware for serving static files.

const express = require("express");

const app = express();

app.use("/uploads", express.static("uploads"));

This tells Express:

"Whenever someone requests a file inside the uploads folder, serve it directly."

How Static File Serving Works

Flow:

Browser Requests Image
          ↓
      Express
          ↓
   uploads Folder
          ↓
     File Found
          ↓
     File Sent

Accessing Uploaded Files via URL

Suppose we have:

uploads/profile.jpg

And Express configuration:

app.use("/uploads", express.static("uploads"));

The file becomes accessible at:

http://localhost:3000/uploads/profile.jpg

Browser request:

GET /uploads/profile.jpg

Express:

Looks inside uploads folder
         ↓
Finds profile.jpg
         ↓
Returns file

The browser displays the image.

Complete Example

const express = require("express");

const app = express();

app.use("/uploads", express.static("uploads"));

app.listen(3000, () => {
  console.log("Server running");
});

Folder structure:

project/
│
├── uploads/
│   └── logo.png
│
└── server.js

URL:

http://localhost:3000/uploads/logo.png

Result:

Browser
   ↓
logo.png displayed

Security Considerations for Uploads

File uploads can be dangerous if not handled properly.

1. Validate File Types

Allow only specific file formats.

Example:

Allowed:

• jpg

• png

• pdf

Blocked:

• exe

• bat

• sh

2. Limit File Size

Prevent users from uploading huge files.

Example:

Maximum Size: 5 MB

This protects server resources.

3. Rename Uploaded Files

Avoid storing original filenames.

Bad:

resume.pdf

Good:

17123456789.pdf

Unique names prevent conflicts.

4. Store Uploads Outside Sensitive Directories

Never allow uploads inside source code folders.

Bad:

src/
 └── uploads/

Better:

uploads/

5. Scan Files if Possible

For production applications, scan uploaded files for malware before making them available.

6. Restrict Access

Not every uploaded file should be publicly accessible.

Examples:

• Public profile pictures → Public URLs

• User documents → Authenticated access only

Real-World Flow

User Uploads Image
          ↓
Express Receives File
          ↓
Validation
(File Type + Size)
          ↓
Store File
(Local Storage / Cloud Storage)
          ↓
Save File Path in Database
          ↓
Generate URL
          ↓
Browser Accesses URL
          ↓
Express Serves File

When learning JavaScript, you'll often see code like this:

function User(name) {
  this.name = name;
}

const user1 = new User("Ashish");

Many beginners use the new keyword without understanding what it actually does.

Questions like these are common:

• What does new do?

• Why do we use it before a function?

• How is an object created?

• What is the connection between constructors and prototypes?

In this article, we'll understand the new keyword step by step with simple examples.

The Problem

Imagine you want to create multiple users in your application.

Without a constructor function, you would have to create every object manually.

const user1 = {
  name: "Ashish",
  greet() {
    console.log("Hello");
  }
};

const user2 = {
  name: "Rahul",
  greet() {
    console.log("Hello");
  }
};

Notice the problem?

We are repeating the same structure again and again.

For a few objects this is fine, but for hundreds or thousands of objects it becomes difficult to maintain.

We need a way to create objects from a blueprint.

That's where constructor functions and the new keyword come in.

What is the new Keyword?

The new keyword is used to create an object from a constructor function.

It automatically creates a new object and connects it with the constructor.

Example:

function User(name) {
  this.name = name;
}

const user1 = new User("Ashish");

Output:

{ name: "Ashish" }

Here:

new User("Ashish")

creates a new object and assigns "Ashish" to its name property.

What is a Constructor Function?

A constructor function is a normal function that is intended to create objects.

By convention, constructor function names start with a capital letter.

function User(name, age) {
  this.name = name;
  this.age = age;
}

Creating objects:

const user1 = new User("Ashish", 25);
const user2 = new User("Rahul", 22);

console.log(user1);
console.log(user2);

Output:

User { name: "Ashish", age: 25 }

User { name: "Rahul", age: 22 }

The constructor acts as a blueprint.

What Happens When We Use new?

Many developers think new is magic.

Actually, JavaScript performs four important steps.

Let's understand them one by one.

Step 1: Create an Empty Object

When JavaScript sees:

new User("Ashish")

it first creates an empty object.

{}

Step 2: Link the Object to the Prototype

The newly created object gets connected to the constructor's prototype.

Conceptually:

obj.__proto__ = User.prototype;

This allows the object to access shared methods later.

Step 3: Bind this to the New Object

Inside the constructor:

function User(name) {
  this.name = name;
}

this now refers to the newly created object.

So JavaScript executes:

obj.name = "Ashish";

Result:

{
  name: "Ashish"
}

Step 4: Return the Object

Finally, JavaScript automatically returns the created object.

Equivalent behavior:

return obj;

So:

const user1 = new User("Ashish");

becomes:

{
  name: "Ashish"
}

Behind the Scenes

The code:

const user1 = new User("Ashish");

works roughly like this:

const obj = {};

obj.__proto__ = User.prototype;

User.call(obj, "Ashish");

return obj;

This is essentially what the new keyword does internally.

Adding Methods Using Prototype

Suppose we add a method directly inside the constructor.

function User(name) {
  this.name = name;

  this.greet = function () {
    console.log("Hello");
  };
}

Every object gets its own copy of greet.

This wastes memory.

A better approach is using the prototype.

function User(name) {
  this.name = name;
}

User.prototype.greet = function () {
  console.log(`Hello, ${this.name}`);
};

Now all objects share the same method.

const user1 = new User("Ashish");
const user2 = new User("Rahul");

user1.greet();
user2.greet();

Output:

Hello, Ashish
Hello, Rahul

How new Links Prototypes

Let's check it.

function User(name) {
  this.name = name;
}

const user1 = new User("Ashish");

console.log(
  Object.getPrototypeOf(user1) === User.prototype
);

Output:

true

This proves that the object is connected to the constructor's prototype.

Because of this connection:

user1.greet()

can access methods stored on:

User.prototype

Checking the Constructor

Every created object remembers which constructor created it.

function User(name) {
  this.name = name;
}

const user1 = new User("Ashish");

console.log(user1.constructor);

Output:

[Function: User]

This indicates that the object was created using the User constructor.

Constructor → Instance Creation Flow

Constructor Function

        │
        
       new

        │

 Creates Empty Object

        │
   Links Prototype

        │

     Binds this

        │

   Returns Object

        │

     Instance

Prototype Linking Flow

User Constructor
       │

User.prototype
       │

   __proto__
       │
       
     user1

Because of this link:

user1.greet()

can access methods from:

User.prototype

Imagine you order a pizza online.

You don't stand outside the restaurant and watch the chef make your pizza. Instead, you place the order and continue doing other things. When the pizza is ready, the delivery person calls you.

This "call me when you're done" idea is exactly how callbacks work in JavaScript.

Callbacks allow JavaScript to continue doing other work while waiting for a task to finish. When the task is completed, JavaScript calls a function that you provided earlier.

In this article, we'll understand what callback functions are, why they exist, how they are used in asynchronous programming, and the problems they can create.

Functions Are Values in JavaScript

Before understanding callbacks, we need to understand an important feature of JavaScript.

In JavaScript, functions are treated like values.

This means a function can:

• Be stored in a variable

• Be passed as an argument

• Be returned from another function

Example:

function sayHello() {
  console.log("Hello");
}

const greet = sayHello;

greet();

Output:

Hello

Here, the function is assigned to another variable and then executed.

Because functions can be passed around like values, callbacks become possible.

What Is a Callback Function?

A callback function is simply a function passed into another function as an argument.

The receiving function can execute it whenever needed.

Example:

function greet(name, callback) {
  console.log("Hello " + name);

  callback();
}

function sayBye() {
  console.log("Goodbye!");
}

greet("Ashish", sayBye);

Output:

Hello Ashish
Goodbye!

In this example:

• sayBye is passed as an argument.

• greet receives it.

• greet executes it later.

Therefore, sayBye is called a callback function.

Why Do Callbacks Exist?

Let's understand the problem first.

Imagine JavaScript is downloading data from a server.

This operation may take several seconds.

If JavaScript waits for the server response before doing anything else, the application will freeze.

That would create a poor user experience.

JavaScript solves this problem using asynchronous programming.

Instead of waiting:

1. Start the task.

2. Continue doing other work.

3. Execute a callback when the task finishes.

Simple Real-Life Example

Suppose you ask your friend to wash your bike.

Instead of standing beside them and waiting, you say:

"Call me when you're done."

That "call me later" instruction is the callback.

Flow:

Start bike washing
      |
      v
Do other work
      |
      v
Bike washing completed
      |
      v
Callback executes

The same concept is used in JavaScript.

Callback Example in Asynchronous Programming

Consider a timer.

console.log("Start");

setTimeout(function () {
  console.log("Task Finished");
}, 2000);

console.log("End");

Output:

Start
End
Task Finished

Why?

• JavaScript starts the timer.

• It doesn't wait for 2 seconds.

• It continues executing the next line.

• After 2 seconds, the callback function runs.

The function inside setTimeout is a callback.

Passing Functions as Arguments

Callbacks work because functions can be passed as arguments.

Example:

function performOperation(a, b, operation) {
  return operation(a, b);
}

function add(x, y) {
  return x + y;
}

const result = performOperation(10, 20, add);

console.log(result);

Output:

30

Here:

• add is passed as an argument.

• performOperation executes it.

• add acts as a callback.

Common Callback Use Cases

Callbacks are used in many places.

1. Timers

setTimeout(() => {
  console.log("Executed later");
}, 1000);

2. Event Handling

button.addEventListener("click", function () {
  console.log("Button clicked");
});

When the user clicks the button, the callback executes.

3. Array Methods

const numbers = [1, 2, 3];

numbers.forEach(function (num) {
  console.log(num);
});

Output:

1
2
3

The function passed to forEach is a callback.

4. API Calls (Older Style)

fetchData(function (data) {
  console.log(data);
});

After data arrives, the callback runs.

Imagine you are using an online shopping website.

You log in once, browse products, add items to your cart, and move between different pages without logging in again and again.

Have you ever wondered how the website remembers that you are already logged in?

This is where Sessions, Cookies, and JWT (JSON Web Tokens) come into the picture.

These are the most common authentication approaches used in modern web applications. Understanding them is important for every backend developer because almost every application needs a way to identify users after login.

In this article, we'll understand:

• What Sessions are

• What Cookies are

• What JWT Tokens are

• Stateful vs Stateless Authentication

• Session-based Authentication vs JWT Authentication

• When to use each approach

What Are Cookies?

A Cookie is a small piece of data stored in the user's browser.

When the browser sends future requests to the server, it automatically includes the cookie.

Example

After login, the server sends:

Set-Cookie: userId=123

Browser stores it.

Future requests:

Cookie: userId=123

Now the server can identify the user.

Cookie Flow

User Login
     |
     v
Server Creates Cookie
     |
     v
Browser Stores Cookie
     |
     v
Future Requests Include Cookie

What Are Sessions?

A Session is a server-side storage mechanism used to keep track of logged-in users.

Instead of storing user information directly in the browser, the server stores it in memory or a database.

The browser only receives a Session ID.

Example

User logs in:

Session ID = abc123

Server stores:

{
  "abc123": {
    "userId": 101,
    "username": "ashish"
  }
}

Browser stores only:

sessionId=abc123

When the user sends another request:

1. Browser sends Session ID.

2. Server finds matching session data.

3. User is authenticated.

Session Authentication Flow

User Login
     |
     v
Server Creates Session
     |
     v
Server Stores User Data
     |
     v
Session ID Sent To Browser
     |
     v
Browser Sends Session ID
     |
     v
Server Verifies Session

What Is JWT (JSON Web Token)?

JWT is a self-contained token that stores user information inside the token itself.

Unlike sessions, the server does not need to store user data separately.

After login:

eyJhbGciOi...

The token contains encoded information such as:

{
  "userId": 101,
  "name": "Ashish",
  "role": "user"
}

The browser stores this token and sends it with every request.

JWT Authentication Flow

User Login
     |
     v
Server Creates JWT
     |
     v
JWT Sent To Browser
     |
     v
Browser Stores JWT
     |
     v
JWT Sent With Requests
     |
     v
Server Verifies Signature

Stateful vs Stateless Authentication

Stateful Authentication

The server stores user information.

Examples:

• Sessions

• Session-based authentication

The server must remember every logged-in user.

Characteristics

• Server stores user state.

• Requires session storage.

• Easy logout implementation.

• More server memory usage.

Stateless Authentication

The server stores nothing about logged-in users.

Examples:

• JWT Authentication

All required information exists inside the token.

Characteristics

• No session storage required.

• Easier horizontal scaling.

• Less server memory usage.

• Token management becomes important.

Session-Based Authentication vs JWT Authentication

Real-World Examples

Session-Based Authentication

Commonly used in:

• Banking websites

• Admin dashboards

• Traditional server-rendered applications

• Enterprise applications

Reason:

The server has full control over user sessions.'

JWT Authentication

Commonly used in:

• REST APIs

• Mobile applications

• React applications

• Next.js applications

• Microservices architecture

Reason:

No server-side session storage is required.

Strings are one of the most commonly used data types in JavaScript. We use them to display messages, create dynamic content, build URLs, and much more.

Before ES6 (ECMAScript 2015), developers used string concatenation with the + operator to combine strings and variables. While it worked, it often made code difficult to read and maintain.

To solve this problem, JavaScript introduced Template Literals, a modern and cleaner way to work with strings.

The Problem with Traditional String Concatenation

Before template literals, strings were combined using the + operator.

Example

const name = "Ashish";
const age = 24;

const message = "My name is " + name + " and I am " + age + " years old.";

console.log(message);

Output

My name is Ashish and I am 24 years old.

Although this works, the code becomes harder to read when many variables are involved.

Another Example

const product = "Laptop";
const price = 50000;

const text =
  "The product name is " +
  product +
  " and its price is ₹" +
  price +
  ".";

console.log(text);

This looks messy and is difficult to maintain.

What are Template Literals?

Template literals are a modern way to create strings in JavaScript.

Instead of using single quotes (' ') or double quotes (" "), template literals use backticks ( `).

Syntax Text goes here

Example:

const message = Hello JavaScript;

console.log(message);

Embedding Variables in Strings

One of the biggest advantages of template literals is string interpolation.

We can insert variables directly inside a string using:

${variableName}

Example

const name = "Ashish";
const age = 24;

const message = `My name is \({name} and I am \){age} years old.`;

console.log(message);

Output

My name is Ashish and I am 24 years old.

The code is much cleaner and easier to understand.

Before vs After Template Literals

Traditional Concatenation

const city = "Pune";

console.log("I live in " + city + ".");

Template Literal

const city = "Pune";

console.log(`I live in ${city}.`);

The second approach is shorter and more readable.

Multi-Line Strings

Creating multi-line strings was difficult before template literals.

Old Way

const text =
  "JavaScript is powerful.\n" +
  "JavaScript is flexible.\n" +
  "JavaScript is popular.";

console.log(text);

Using Template Literals

const text = `
JavaScript is powerful.
JavaScript is flexible.
JavaScript is popular.
`;

console.log(text);

Template literals preserve line breaks automatically.

Expressions Inside Template Literals

We can even execute JavaScript expressions inside ${}.

Example

const a = 10;
const b = 20;

console.log(`The sum is ${a + b}`);

Output

The sum is 30

Another example:

const price = 1000;
const discount = 200;

console.log(`Final Price: ₹${price - discount}`);

Output

Final Price: ₹800