---
marp: true
theme: gaia
paginate: true
backgroundColor: #fff
header: "Web Engineering – DHBW Stuttgart"
footer: "Michael Czechowski – SoSe 2026"
---

<style>
:root {
  --color-foreground: #1a1a2e;
  --color-highlight: #005f8a;
  --color-dimmed: #4a6a7a;
}
section.invert {
  --color-foreground: #fff;
}
section {
  font-size: 1.7rem;
}
h1 {
  color: #005f8a;
}
section.invert h1 {
  color: #fff;
}
pre {
  background: #0f1e2e;
  color: #00b4d8;
  border-radius: 8px;
  border-left: 3px solid #005f8a;
}
pre code {
  background: transparent;
  color: inherit;
}
code {
  background: #1a3a4a;
  color: #00b4d8;
  padding: 0.15em 0.4em;
  border-radius: 4px;
}
a {
  color: var(--color-highlight);
}
</style>

<!-- _class: invert -->
<!-- _header: '' -->
<!-- _backgroundColor: #001520 -->

# node.js – Advanced

---

# node.js – Fun Facts

- Entwickelt von Ryan Dahl in 2009
- Erste serverseitige Laufzeitumgebung in JavaScript (C++)
- Inspiriert von Nginx (Non-blocking I/O)

**Alternativen heute:**
- **Deno** (2020): Rust, Tokio
- **Bun** (2022): Zig

---

# process – Prozess-Steuerung

```javascript
process.on("SIGINT", () => {
  console.log("Received SIGINT. Closing server...");
  server.close(() => {
    console.log("Server closed.");
    process.exit(0);
  });
});

// Signale
process.exit(0);  // Erfolgreich
process.exit(1);  // Fehler
```

---

# node.js Module System

```javascript
// ES Modules
import express from 'express';
import { port } from './src/config/constants.js';

// CommonJS
const fs = require('fs');
```

---

# HTTP Request mit node-fetch

```javascript
// Node.js 18+ hat fetch eingebaut
const res = await fetch('https://api.example.com/data');
const data = await res.json();

// Ältere Versionen: node-fetch
import fetch from 'node-fetch';
```

---

# Web Server, Builder, Bundler

```bash
# Boilerplates erstellen
npm create vite@latest my-app -- --template react
npm create svelte@latest
npm create astro@latest

# nuxt
npm install nuxt
npm run dev
```

---

<!-- _header: '' -->
<!-- _footer: '' -->

![bg fit](./assets/demos/js-frameworks-overview.png)


---

# Express – Grundlagen

```javascript
import express from 'express';
const app = express();

app.listen(port, () => {
  console.log(`Server läuft auf Port ${port}`);
});
```

---

# Express – Middleware

```javascript
app.use(express.json());

app.use('/api', (req, res, next) => {
  console.log('Time:', Date.now());
  next();
});

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

---

# Express – CRUD Routes

```javascript
app.get('/api/:key', async (req, res) => {
  const context = cache.get(req.params.key);
  res.json({ context });
});

app.post('/api/:key', async (req, res) => {
  const payload = req.body;
  res.json({ created: cache.set(req.params.key, payload) });
});

app.put('/api/:key', async (req, res) => {
  const payload = req.body;
  res.json({ updated: cache.update(req.params.key, payload) });
});

app.delete('/api/:key', async (req, res) => {
  cache.remove(req.params.key);
  res.json({ deleted: req.params.key });
});
```

---

# Express – server.listen

```javascript
const server = app.listen(port, () => {
  console.log(`Server läuft auf Port ${port}`);
});

server.on('error', (err) => {
  console.error('Server error:', err);
});

server.close(() => {
  console.log('Server geschlossen');
});
```

---

# WebSockets

```javascript
import { WebSocketServer } from 'ws';

const wss = new WebSocketServer({ port: 8080 });

wss.on('connection', (ws) => {
  console.log('Client verbunden');

  ws.on('message', (data) => {
    console.log('Empfangen:', data.toString());
    ws.send('Pong');
  });
});
```

---

<!-- _header: '' -->
<!-- _footer: '' -->

![bg fit](./assets/demos/ts-js-compilation.png)


---

<!-- _header: '' -->
<!-- _footer: '' -->

![bg fit](./assets/demos/docker-orchestration.png)


---

<!-- _header: '' -->
<!-- _footer: '' -->

![bg fit](./assets/demos/test-automation-trophy.png)


---

# Fragen?

1. Wozu dient `process.on('SIGINT')`?
2. Was macht `app.use(express.json())`?
3. Wie erstellst du einen GET-Endpoint mit Express?