⚡Backend

Convex als Backend-Alternative

Reaktives Backend ohne Server-Code — April 2026

Convex ist ein Backend-as-a-Service, das reaktive Echtzeit-Daten liefert ohne dass du einen Server oder WebSockets einrichten musst. Du schreibst TypeScript-Funktionen, Convex hosted und skaliert alles. Wie Supabase, aber mit automatischem Echtzeit-Sync.

Pro-Tip — Der schnelle Weg

Convex-Queries sind automatisch reaktiv — wenn sich Daten ändern, updated dein Frontend sofort. Kein Polling, kein Refetch nötig.

Seite 1

Convex Projekt initialisieren

Installiere Convex und initialisiere es in deinem Next.js Projekt.

npm install convex
npx convex init

# Das erstellt einen convex/ Ordner
# mit schema.ts und Konfigurationsdateien

Schema und Query definieren

Definiere dein Datenmodell und schreibe deine erste Query-Funktion.

// convex/schema.ts
import { defineSchema, defineTable } from "convex/server";
import { v } from "convex/values";

export default defineSchema({
tasks: defineTable({
text: v.string(),
done: v.boolean(),
}),
});

// convex/tasks.ts
import { query, mutation } from "./_generated/server";
import { v } from "convex/values";

export const getAll = query({
handler: async (ctx) => await ctx.db.query("tasks").collect(),
});

export const create = mutation({
args: { text: v.string() },
handler: async (ctx, args) => {
await ctx.db.insert("tasks", { text: args.text, done: false });
},
});

Frontend einbinden — reaktiv

Nutze den Convex React-Hook und deine Daten updaten sich automatisch in Echtzeit.

// app/providers.tsx
import { ConvexProvider, ConvexReactClient } from "convex/react";
const convex = new ConvexReactClient(process.env.NEXT_PUBLIC_CONVEX_URL!);

export function Providers({ children }) {
return <ConvexProvider client={convex}>{children}</ConvexProvider>;
}

// components/tasks.tsx
import { useQuery, useMutation } from "convex/react";
import { api } from "@/convex/_generated/api";

export function Tasks() {
const tasks = useQuery(api.tasks.getAll);
const create = useMutation(api.tasks.create);
return tasks?.map(t => <div key={t._id}>{t.text}</div>);
}

Seite 2

Warum das funktioniert

Automatische Echtzeit-Updates ohne WebSocket-Setup oder Polling
TypeScript durchgehend: Tippfehler werden sofort erkannt
Null Server-Konfiguration: Convex hosted und skaliert automatisch
Transaktionale Mutations verhindern inkonsistente Daten

Tipps

Convex Free Tier reicht für Hobby-Projekte und MVPs locker aus
Mutations sind automatisch transaktional — kein manuelles Error-Handling nötig
File Storage ist eingebaut — Bilder und Dateien ohne extra Service hochladen
Scheduled Functions ersetzen Cron-Jobs für wiederkehrende Aufgaben
TypeScript End-to-End: Schema-Typen fließen automatisch bis ins Frontend

Seite 3

Bereit für den nächsten Schritt?

KIWorld VibeCoding Masterclass

Du willst nicht nur einzelne Tools einrichten, sondern wirklich lernen wie du mit KI komplette Apps, Websites und SaaS-Produkte baust? Über 700 Videos — von Anfänger bis Fortgeschritten — in jedem Bereich. Von der Idee bis zum fertigen Produkt, ohne eine Zeile Code selbst zu schreiben.

Jetzt Masterclass ansehen