LU15c – Erster Express-Server mit Node.js

• Sie können einen einfachen Express-Server programmieren.
• Sie können den Server über das Terminal starten.
• Sie verstehen den Request-Response-Zyklus (app.get, res.send).
• Sie können erklären, warum dies kein klassisches Website-Frontend, sondern ein Backend-Server / API ist.
• Sie kennen nodemon und einfache npm scripts für einen komfortablen Entwicklungsablauf.

Öffnen Sie die Datei index.js und fügen Sie folgenden Code ein:

import express from 'express';
 
const app = express();
const port = 3000;
 
// Route für GET-Anfragen auf "/"
app.get('/', (req, res) => {
    res.send('test');
});
 
// Server starten und auf Port 3000 lauschen
app.listen(port, () => {
    console.log(`Example app listening on port ${port}`);
});

Was passiert in diesem Code?

• import express from 'express';

Lädt das Express-Framework aus node_modules.

• const app = express();

Erstellt eine neue Express-Anwendung – das ist Ihr Serverobjekt.

• const port = 3000;

Definiert den Port, auf dem der Server lauscht.

  ''http://localhost:3000/'' bedeutet: eigener Computer (localhost), Port 3000, Pfad ''/''.
* ''app.get('/', (req, res) => { ... });''  
  Definiert eine **Route**:
    * Wenn eine **GET-Anfrage** an ''/'' kommt,
    * führt Express die Callback-Funktion aus.
    * ''req'' = Request-Objekt (Infos über Anfrage),  
      ''res'' = Response-Objekt (Antwort, die Sie zurückschicken).
    * ''res.send('test');'' → sendet den Text ''test'' als Antwort.
* ''app.listen(port, () => { ... });''  
  Startet den Server und gibt im Terminal eine kurze Meldung aus.

1. Öffnen Sie in WebStorm das **Terminal** (Projektordner).
2. Starten Sie den Server mit:

node index.js

3. Im Terminal sollte erscheinen:
   *''Example app listening on port 3000''*

4. Öffnen Sie Ihren Browser und geben Sie ein:
   ''http://localhost:3000/''

5. Sie sollten nur das Wort **''test''** im Browser sehen.

6. Server stoppen:
   * Im Terminal ''Strg + C'' (Windows/Linux) oder ''ctrl + C'' (macOS) drücken.

Später werden Sie:

• statt einfachem Text JSON-Daten zurückgeben,
• mehrere Routen (z.B. /api/trips, /api/books) definieren,
• und diese mit Ihrer MySQL-Datenbank verbinden.

Wenn Sie nach jeder Codeänderung den Server mit node index.js neu starten müssen, ist das mühsam. Dafür gibt es zwei Hilfsmittel:

• npm scripts in package.json
• nodemon für automatischen Neustart

Installieren Sie nodemon als Entwicklungsabhängigkeit:

npm install --save-dev nodemon

Dadurch ergänzt npm Ihre package.json um einen Eintrag unter devDependencies für nodemon.

Öffnen Sie package.json und ergänzen Sie den Abschnitt scripts wie folgt (Beispiel):

"scripts": {
  "start": "node index.js",
  "dev": "nodemon index.js"
}

Sie können dann:

• mit npm start den Server einmalig starten,
• mit npm run dev den Server im Entwicklermodus mit automatischem Neustart starten.

Wenn Sie nun in index.js etwas ändern und speichern, startet nodemon den Server automatisch neu.

• Der Ordner node_modules/ kann sehr gross werden.

Er wird von npm automatisch verwaltet und muss nicht manuell bearbeitet werden.

• Für Abgaben (z.B. in Moodle) reicht meist:
  • Quellcode-Dateien (z.B. index.js)
  • package.json (und optional package-lock.json)
• In WebStorm können Sie bei Bedarf die Inlay-Hints (kleine Typ-Hinweise) deaktivieren, wenn diese Sie stören

(Settings → Editor → Inlay Hints).

In den nächsten Learning Units werden Sie:

• weitere Routen in Ihrem Express-Server anlegen,
• Daten nicht nur zurückgeben, sondern auch annehmen (POST, PUT, DELETE),
• Ihre persönlichen Use Cases (z.B. Reisedatenbank, Lieblingsfilme, Geburtstage) mit einer echten MySQL-Datenbank verbinden

und alle CRUD-Operationen über den Backend-Server ausführen.

M290 / BZZ (adapted)