ExpressJS Server Side Application

Express.js is een webframework voor Node.js waarmee je eenvoudig webapplicaties en API’s kunt bouwen. Om een ExpressJS applicatie te bouwen doorlopen we volgende stappen.

• Initialisatie van het project
• Folderstructuur voorzien
• Aanmaken van de express-applicatie
• Routes definiëren
• Middleware aanmaken
  • Voorbeelden Middleware

Initialisatie van het project

Start met het aanmaken van een nieuw Node.js-project. Maak een nieuwe folder en open deze locatie in de console. Gebruik vervolgens npm init om een package.json-bestand aan te maken.

/project-root/ npm init

Vervolgens installeer je Express (opens new window) met npm install express. Dit is een onafhankelijkheid voor het uitvoeren van je applicatie in een productieomgeving, dus dit zal geen devDependency, maar een “gewone” dependency zijn.

npm install express

Folderstructuur voorzien

Voor een Express.js-applicatie die alleen een API aanbiedt en geen front-end HTML-sjablonen voorzien we een gestructureerde folderindeling. We starten met een simpele structuur en maken een src-folder met hierin je hoofd-javascript bestand app.js. We breiden de structuur later uit door controllers, routes, … toe te voegen.

project-root
│
├── src
│   └── app.js
│
├── node_modules
├── package.json
└── .gitignore

• src: Hier bevindt zich de broncode van de applicatie
  • app.js: Dit bestand initialiseert en configureert de Express-applicatie. Hier worden de controllers, routes en middleware geïmporteerd en geïntegreerd.
• node_modules: Hier worden de externe modules geïnstalleerd via npm.
• package.json: Het configuratiebestand voor npm, waarin projectafhankelijkheden en scripts worden gespecificeerd.
• .gitignore: Specificeert bestanden die moeten worden genegeerd door Git, zoals de node_modules-map.

Aanmaken van de express-applicatie

Importeer het Express-framework in je project in app.js. Hiermee krijg je toegang tot alle functionaliteiten die Express biedt.

app.js

const express = require("express");

Maak een instantie van de Express-app. Dit is de centrale entiteit waarmee je routes, middleware en configuraties zult definiëren.

app.js

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

Nu kunnen we de server opstarten, dit proces zal blijven draaien tot we dit handmatig afsluiten. De app.listen()-functie in Express.js wordt gebruikt om de webserver te starten en naar inkomende verzoeken te luisteren op een opgegeven poort.

app.js

const express = require("express");
const app = express();
const poort = 3000; // process.env.PORT

app.listen(poort, () => {
  console.log(`Server gestart op poort ${poort}`);
});

Om de server te starten voeren we het app.js bestand uit.

node app.js

Tip

Je moet de server opnieuw opstarten bij het doorvoeren van een wijziging. Wil je dat de server automatisch heropstart bij het doorvoeren van een wijziging, dan kan je deze taak automatiseren met een library zoals Nodemon (opens new window).

nodemon --watch src app.js

Routes definiëren

Vervolgens moeten we kunnen reageren op de HTTP-verzoeken die onze server zal ontvangen. Hiervoor maken we routes aan.

Definitie

Een route is een associatie tussen een URL en een functie die wordt uitgevoerd wanneer die URL wordt aangevraagd.

Je definieert routes met behulp van Express-methoden zoals app.get(), app.post(), app.put(), … Elk van deze methoden accepteert een URL-pad en een callbackfunctie die wordt uitgevoerd wanneer de bijbehorende HTTP-methode wordt aangeroepen op dat pad.

app.js

app.get("/", (req, res) => {
  res.send("Welkom op de hoofdpagina!");
});

// Definieer een API-route die alle boeken retourneert
app.get("/api/books", (req, res) => {
  res.json(books);
});

req en res zijn de parameters die worden doorgegeven aan de callbackfunctie die wordt opgeroepen bij het verwerken van een HTTP-verzoek.

• Request: req

  req vertegenwoordigt het HTTP-verzoekobject en bevat informatie over de clientaanvraag, zoals parameters, querystrings, headers en het verzoeklichaam (bij POST- of PUT-verzoeken).

  Bijvoorbeeld, req.params geeft toegang tot de URL-parameters, req.query geeft toegang tot querystring-parameters, en req.body bevat gegevens van het verzoeklichaam bij POST-verzoeken.

• Response: res

  res staat voor het HTTP-antwoordobject en wordt gebruikt om het antwoord van de server naar de client te sturen.

  • Met res.send() kan je eenvoudig tekst, HTML, of JSON als antwoord versturen.
  • res.json() wordt vaak gebruikt om een JSON-antwoord te verzenden.

  Andere methoden zoals res.status() stellen de statuscode van het antwoord in, terwijl res.sendFile() wordt gebruikt om een bestand naar de client te sturen.

Middleware aanmaken

Middleware is code dat dient als een tussenlaag tussen verschillende applicaties, systemen of services.

In Express.js zal het functionaliteit toevoegen aan het verwerkingsproces van HTTP-verzoeken. Het wordt toegepast tussen het ontvangen van een verzoek en het verzenden van een reactie.

Middleware-functies hebben toegang tot het verzoekobject (req), het antwoordobject (res), en de volgende functie (next).

Ze kunnen taken uitvoeren, het verzoek wijzigen, de respons aanpassen, of eenvoudigweg doorgeven aan het volgende middelware of routefunctie met next().

Voorbeelden Middleware

Hiermee wordt CORS ingeschakeld, waardoor verzoeken van verschillende domeinen mogelijk zijn.

const cors = require("cors");

// Middleware voor Cross-Origin Resource Sharing (CORS)
// Middleware op de volledige app, en dus alle verzoeken.
app.use(cors());

// Route-handler die kan worden aangeroepen vanuit verschillende domeinen
app.get("/public-data", (req, res) => {
  res.json({ message: "Openbare gegevens beschikbaar" });
});

We kunnen alle verzoeken loggen.

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

const myLogger = function (req, res, next) {
  console.log("LOGGED");
  next();
};

// Middleware op de volledige app, en dus alle verzoeken.
app.use(myLogger);

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

app.listen(3000);

Je kan controleren dat enkel een geauthenticeerde gebruiker toegang heeft tot de API.

const authenticateMiddleware = (req, res, next) => {
  // Voer hier je authenticatielogica uit
  if (req.headers.authorization === "geheime_sleutel") {
    next(); // Geautoriseerd, ga door naar de volgende functie
  } else {
    res.status(401).send("Niet geautoriseerd"); // Niet geautoriseerd
  }
};

// Middleware op de volledige app, en dus alle verzoeken.
app.use("/api", authenticateMiddleware);

// Route-handling
// ...

Als je middleware alleen op een specifieke route wilt toepassen, kun je dat als volgt doen:

// Voorbeeld van middleware die alleen wordt toegepast op de "/api/users" route
const specificRouteMiddleware = (req, res, next) => {
  // Voeg hier je middleware-logica toe die specifiek is voor deze route
  console.log(`Middleware toegepast op de /api/users route`);
  next(); // Ga door naar de volgende functie in de stack
};

// Voeg de middleware toe aan de specifieke route
app.get("/api/users", specificRouteMiddleware, (req, res) => {
  // Route-handler logica hier
  res.json({ message: "Gebruikersgegevens opgehaald" });
});