Vertrag zuerst: Neue Art des Vibe-Codings

Contract First und @feelai/contract: Ein neuer Ansatz für typsichere Anwendungsentwicklung

In der modernen Softwareentwicklungswelt ist die Gewährleistung der Konsistenz zwischen Client und Server eine nicht zu unterschätzende Herausforderung. Der Contract First-Ansatz hat sich als effektive Lösung erwiesen und wird nun durch die Bibliothek @feelai/contract stark unterstützt.

Contract First: Der Ansatz der Vertragsdefinition im Voraus

Contract First ist eine Methode der Softwareentwicklung, bei der die Definition der Application Programming Interface (API) festgelegt wird, bevor die Details implementiert werden. Anstatt zuerst Code zu schreiben und dann die API zu definieren, verlangt dieser Ansatz:

Klare Definition von Endpunkten, Eingaben und Ausgaben
Erstellung eines Vertrags (Contract) zwischen Client und Server
Parallele Entwicklung beider Seiten basierend auf dem definierten Vertrag

Die Vorteile von Contract First umfassen:

Minimierung von Kommunikationsfehlern zwischen Teams
Ermöglicht parallele Entwicklung von Frontend und Backend
Gewährleistet Datentypskonsistenz
Einfache Tests und Erstellung von Mock-Daten

@feelai/contract: Eine TypeScript-Bibliothek für Contract First

@feelai/contract ist eine npm-Bibliothek, die die Implementierung des Contract First-Ansatzes in TypeScript-Projekten erleichtert. Die Bibliothek bietet Werkzeuge zur typsicheren Definition von API-Verträgen, die client- und serverseitig geteilt werden können, ohne Zirkelabhängigkeiten zu verursachen.

Hervorgehobene Merkmale

Typsicherheit: Verwendet typebox zur Definition von Schemata
Zentrale Vertragsdefinition: Verwaltung von API-, Stream- und Socket-Verträgen an einem einzigen Ort
Statische Typableitung: Extrahiert TypeScript-Typen aus der Laufzeit-Vertragsdefinition
Trennung von Belangen: Trennt die API-Definition von der Implementierungslogik

Installation

bun add @feelai/contract
# oder
npm install @feelai/contract
# oder
yarn add @feelai/contract

Praktische Anwendung

Hier ist ein Beispiel für die Definition eines Vertrags für eine Aufgabenverwaltungsanwendung:

import { Contract, defineApiMap, defineSocketMap } from "@feelai/contract";
import { Type } from "typebox";

// Definiert das Schema
export const TaskSchema = Type.Object({
  id: Type.String(),
  title: Type.String(),
  completed: Type.Boolean(),
  createdAt: Type.Number(),
});

// Definiert API-Endpunkte
const api = defineApiMap({
  getTasks: {
    output: Type.Array(TaskSchema),
  },
  createTask: {
    input: Type.Object({
      title: Type.String(),
    }),
    output: TaskSchema,
  },
});

// Definiert Socket-Ereignisse
const socket = defineSocketMap({
  taskUpdates: {
    client: {
      subscribe: Type.Object({}),
    },
    server: {
      taskCreated: TaskSchema,
      taskUpdated: TaskSchema,
    },
  },
});

// Erstellt und exportiert den Vertrag
export const todoListContract = new Contract().api(api).socket(socket);
export type TodoListContract = typeof todoListContract;

Typableitung

Eine der Stärken von @feelai/contract ist die automatische Typableitung:

import { StaticApiMap, StaticSocketMap } from "@feelai/contract";
import { todoListContract } from "./todoListContract";

// Typen für die API-Implementierung
export type ApiTypes = StaticApiMap<typeof todoListContract>;

// Typen für die Socket-Implementierung
export type SocketTypes = StaticSocketMap<typeof todoListContract>;

Vorteile der Nutzung von @feelai/contract

Parallele Entwicklung: Frontend- und Backend-Teams können unabhängig voneinander basierend auf dem definierten Vertrag arbeiten.
Fehlerreduzierung: Typprüfung zur Kompilierungszeit hilft, Fehler frühzeitig zu erkennen.
Automatische Dokumentation: Der Vertrag dient als lebende Dokumentation für die API.
Einfache Wartung: API-Änderungen werden zentral an einem Ort verwaltet.

Fazit

Der Contract First-Ansatz in Kombination mit der @feelai/contract-Bibliothek bietet einen systematischen Ansatz für die moderne Webanwendungsentwicklung. Mit seiner Fähigkeit, durchgängige Typsicherheit zu gewährleisten, Kommunikationsfehler zwischen Client und Server zu minimieren und parallele Entwicklung zu unterstützen, ist dies ein wertvolles Werkzeug für TypeScript-Projekte mittlerer bis großer Größe.

Weitere Informationen zu @feelai/contract finden Sie unter: https://www.npmjs.com/package/@feelai/contract