Day 03 - MERN: Arrow Functions, Express, and Your First Server

Welcome to Day 3, where we transition from foundational Node.js concepts to actually building a web server. Today, we will cover modern JavaScript syntax and launch our first Express application.

1. Modern JavaScript Functions

Backend development relies heavily on passing functions around. Understanding the modern syntax will make your Express code much cleaner.

  • Arrow Functions (=>): Introduced in ES6, these provide a shorter way to write functions. You will use them almost everywhere in your Express routes. ```javascript // Normal Function function greet() { console.log(“Hello”); }

// Arrow Function const greet = () => { console.log(“Hello”); };

// Single-line return (automatic return without brackets) const add = (a, b) => a + b;



* **Anonymous Functions:** Functions without a name. Because they have no name, they are usually passed directly as arguments to other functions.
```javascript
setTimeout(function() { 
    console.log("Running an anonymous function!"); 
}, 1000);

  • Callback Functions: A function passed into another function so it can be executed later. A common mistake is executing the function immediately instead of passing its reference. ```javascript function serverStarted() { console.log(“Server Running”); }

// Correct: “Here is the function, call it later.” app.listen(3000, serverStarted);

// Wrong: “Run this immediately.” app.listen(3000, serverStarted());




## 2. Setting Up Express

Before writing server code, you need to understand dependencies and the tools that make development easier.

* **Dependencies:** External packages your project needs (like a database driver or a framework). When you run `npm install express`, the code downloads into your `node_modules` folder and registers in your `package.json`.
* **Express.js:** A minimal and flexible backend framework for Node.js. It handles the heavy lifting of HTTP requests, routing, and APIs so you don't have to write it from scratch.
```javascript
const express = require("express");
const app = express(); // Initializes the Express application

  • Nodemon: A must-have development tool. Normally, every time you change your code, you have to manually stop and restart your Node server. Nodemon watches your files and restarts the server automatically whenever you hit save.

3. Firing Up the Server

To make your server accessible, you have to assign it to a specific port and tell Express to start listening.

  • Ports: Think of a computer’s IP address like an apartment building, and the port as a specific apartment number. Port 3000 is the standard convention for Node.js development.
  • app.listen(): This command boots up the web server and keeps it running, listening for incoming connections. ```javascript app.listen(3000, () => { console.log(“Server Started on port 3000”); });


* **Mock Servers:** If frontend developers are waiting on you to finish the backend, you can set up a "mock server." This is a temporary setup that returns predefined, fake data (like a hardcoded list of users) so the frontend team can keep working while you build the real database logic.

## 4. Express Routes

A route determines how your server responds when a user visits a specific URL.

* **Basic Routing:** Every route needs an HTTP method (like `GET`), a path, and a callback function handling the request (`req`) and response (`res`).
```javascript
app.get("/", (req, res) => {
    res.send("Welcome to Express!");
});

  • app.get(): Listens specifically for HTTP GET requests (what browsers use to load a page).
  • "/": The route path. This represents the root or home page (e.g., http://localhost:3000/).
  • req (Request): Contains everything sent by the client, such as URL parameters or form data.
  • res (Response): The object you use to send data, HTML, or JSON back to the client.
Share: X / Twitter LinkedIn Reddit WhatsApp

Comments

Questions, corrections, and practical takeaways are welcome here.