Wie man in 30 Minuten eine REST API mit TypeScript schreibt: für Anfänger

Einleitung

Moderne Webentwicklung ist ohne REST API undenkbar. Es ist das Fundament, auf dem mobile Apps, SPA-Frontends und Microservices aufgebaut werden. Wenn Sie ein Anfänger sind und schnell das Erstellen eines Backends erlernen möchten, dann ist die Kombination TypeScript + Express der ideale Start. TypeScript fügt JavaScript eine strenge Typisierung hinzu, was den Code zuverlässiger und verständlicher macht, besonders bei der Teamarbeit.

In dieser Anleitung erstellen wir in 30 Minuten eine vollwertige REST API zur Verwaltung einer Aufgabenliste (Todo-Liste). Sie lernen, wie Sie das Projekt einrichten, Datenmodelle beschreiben, Routen erstellen und eine Datenbank anbinden. Keine überflüssige Theorie – nur Praxis und startbereiter Code.

Es wird vorausgesetzt, dass Sie bereits Node.js (Version 18+) und npm installiert haben. Falls nicht, laden Sie diese von der offiziellen Website herunter.

1. Projektvorbereitung und Installation der Abhängigkeiten

Beginnen wir mit der Initialisierung eines neuen TypeScript-Projekts. Öffnen Sie das Terminal und führen Sie die folgenden Befehle aus:

mkdir my-todo-apicd my-todo-apinpm init -y

Installieren Sie nun die erforderlichen Pakete:

npm install expressnpm install -D typescript @types/node @types/express ts-node nodemon

Erstellen wir die TypeScript-Konfigurationsdatei:

npx tsc --init

Stellen Sie in der Datei tsconfig.json sicher, dass die folgenden Zeilen auskommentiert und konfiguriert sind:

{  "compilerOptions": {    "target": "ES2020",    "module": "commonjs",    "outDir": "./dist",    "rootDir": "./src",    "strict": true,    "esModuleInterop": true,    "skipLibCheck": true,    "forceConsistentCasingInFileNames": true  },  "include": ["src/**/*"],  "exclude": ["node_modules", "dist"]}

Erstellen Sie den Ordner src und die Datei src/index.ts – dies wird der Einstiegspunkt unserer Anwendung sein.

Fügen wir Skripte in package.json für einen einfachen Start hinzu:

"scripts": {  "dev": "nodemon --exec ts-node src/index.ts",  "build": "tsc",  "start": "node dist/index.js"}

2. Erstellen eines einfachen Express-Servers

Schreiben wir nun einen minimalen Server mit Express, der auf Port 3000 hört. Öffnen Sie src/index.ts und fügen Sie den folgenden Code hinzu:

import express, { Request, Response } from 'express';

const app = express();const PORT = 3000;

// Middleware zum Parsen von JSONapp.use(express.json());

// Basisroute zur Überprüfungapp.get('/', (req: Request, res: Response) => {  res.send('Todo API funktioniert!');});

app.listen(PORT, () => {  console.log(`Server gestartet auf http://localhost:${PORT}`);});

Starten Sie den Server mit dem Befehl npm run dev und öffnen Sie den Browser unter http://localhost:3000. Sie sollten die Meldung "Todo API funktioniert!" sehen.

3. Definition des Datenmodells und In-Memory-Speicher

Der Einfachheit halber werden wir nicht sofort eine Datenbank anbinden, sondern einen temporären Arbeitsspeicher verwenden. Erstellen Sie die Datei src/models/todo.ts:

export interface Todo {  id: number;  title: string;  completed: boolean;  createdAt: Date;}

export let todos: Todo[] = [  { id: 1, title: 'TypeScript lernen', completed: false, createdAt: new Date() },  { id: 2, title: 'REST API schreiben', completed: false, createdAt: new Date() },];

Beachten Sie die Verwendung des Interfaces Todo – dies stellt sicher, dass alle Objekte im Array die gleiche Struktur haben.

4. Implementierung der CRUD-Routen

Erstellen wir die Datei src/routes/todos.ts mit vollständigen Routen für die Operationen Create, Read, Update und Delete.

import { Router, Request, Response } from 'express';import { Todo, todos } from '../models/todo';

const router = Router();

// GET /api/todos — alle Aufgaben abrufenrouter.get('/', (req: Request, res: Response) => {  res.