Billing SDK

Billing SDK ist eine Open-Source-Sammlung von React-Billing-Komponenten mit einer CLI, die dein Projekt mit Dodo Payments verbindet. Die CLI generiert die API-Routen, den React-Hook und den Dodo Payments-Client für dein Framework und fügt Komponenten wie Preistabellen und Nutzungszähler hinzu.

Übersicht

Billing SDK umfasst:

React-Komponenten: Vorgefertigte, anpassbare Billing-Komponenten für React-Anwendungen.
CLI-Tools: Eine Befehlszeilenschnittstelle, die Projekte initialisiert und Komponenten hinzufügt.
Framework-Unterstützung: Vorlagen für Next.js, Express.js, Hono, Fastify, NestJS und React.
Zahlungsanbieter: Vollständige Integration mit Dodo Payments.

Schnellstart

Um Billing SDK in einem bestehenden Projekt einzurichten, führe die CLI im Stammverzeichnis des Projekts aus:

Install the CLI

Führe die CLI mit npx aus, ohne sie zu installieren:

npx @billingsdk/cli --help

Oder installiere sie für die häufige Verwendung global. Die globale Installation fügt den Befehl billingsdk hinzu, zum Beispiel billingsdk init:

npm install -g @billingsdk/cli

Initialize a Project

Führe die interaktive Einrichtung aus, um Billing zu deinem Projekt hinzuzufügen:

npx @billingsdk/cli init

Die CLI fordert dich auf, Folgendes auszuwählen:

Dein Framework: Next.js, Express.js, React, Hono, Fastify oder NestJS. Die CLI erkennt dein Framework und markiert es als erkannt.
Deinen Zahlungsanbieter: Wähle Dodo Payments.

Add Components

Füge deinem Projekt einzelne Abrechnungskomponenten hinzu:

npx @billingsdk/cli add pricing-table-one
npx @billingsdk/cli add subscription-management

Unterstützte Frameworks

Billing SDK verfügt für jedes dieser Frameworks über eine Dodo Payments-Vorlage:

Framework	Dodo Payments
Next.js	Ja
Express.js	Ja
Hono	Ja
React	Ja
Fastify	Ja
NestJS	Ja

CLI-Befehle

`@billingsdk/cli init`

init richtet Billing in deinem Projekt ein: Die Framework-Vorlage mit der Dodo Payments-Integration sowie die von der Vorlage benötigten Abhängigkeiten werden installiert. Was es tut:

Framework-Auswahl: Du wählst dein Framework und deinen Zahlungsanbieter aus.
Vorlageninstallation: Die CLI lädt die Vorlage für dein Framework und deinen Anbieter aus der Billing-SDK-Registry herunter und installiert ihre Dateien.
Abhängigkeitsverwaltung: Die CLI installiert die Abhängigkeiten der Vorlage, z. B. dodopayments, standardwebhooks und zod, mit npm, pnpm, Yarn oder Bun.
Dateigenerierung: Die CLI schreibt die Konfigurationsdateien und den Boilerplate-Code. Für Express.js, Fastify, Hono und NestJS werden sie unter src/ geschrieben.

Beispiel:

npx @billingsdk/cli init

Um init ohne Eingabeaufforderungen auszuführen, übergib --framework, --provider und --yes, zum Beispiel npx @billingsdk/cli init --framework nextjs --provider dodopayments --yes. Füge --dry-run hinzu, um die Dateien aufzulisten, ohne sie zu schreiben, --no-install, um die Installation der Abhängigkeiten zu überspringen, oder --package-manager, um npm, pnpm, yarn oder bun auszuwählen.

`@billingsdk/cli add`

add installiert über das shadcn/ui-Registry-System eine einzelne Billing-Komponente in deinem Projekt. Dabei wird shadcn@latest add @billingsdk/<component> mit dem Runner deines Paketmanagers ausgeführt. Beispiele:

# Add a pricing table
npx @billingsdk/cli add pricing-table-one

# Add subscription management
npx @billingsdk/cli add subscription-management

# Add usage monitoring
npx @billingsdk/cli add usage-meter-circle

Was passiert:

Die shadcn-CLI lädt die Komponentenkonfiguration aus der Registry herunter.
Sie installiert die Komponentendateien in deinem components/billingsdk/-Verzeichnis.
Sie aktualisiert bei Bedarf die Konfiguration deines Projekts.
Sie installiert alle zusätzlichen Abhängigkeiten.

Struktur der generierten Dateien

Nachdem du init ausgeführt hast, enthält dein Projekt Folgendes:

API-Routen: Endpunkte für Checkout, Kunden, Kundenzahlungen, Produkte, Abonnements und Webhooks. Die React-Vorlage enthält keine API-Routen.
Hooks: Einen useBilling React-Hook für Billing-Operationen in React und Next.js.
Bibliotheksdateien: Die Einrichtung des Dodo Payments-Clients und Hilfsfunktionen unter lib/dodopayments.ts.
Umgebungskonfiguration: Eine Beispiel-Umgebungsdatei, .env.example.

Beispielstruktur für Next.js

Für Next.js schreibt init diese Dateien:

your-project/
├── app/api/
│   ├── checkout/route.ts
│   ├── customer/route.ts
│   ├── customer/payments/route.ts
│   ├── customer/subscriptions/route.ts
│   ├── product/route.ts
│   ├── products/route.ts
│   └── webhook/route.ts
├── hooks/
│   └── useBilling.ts
├── lib/
│   └── dodopayments.ts
└── .env.example

Umgebungskonfiguration

Lege nach der Initialisierung deine Umgebungsvariablen fest. Den API-Schlüssel erhältst du unter Developer → API Keys und den Webhook-Schlüssel unter Developer → Webhooks im Dashboard:

# DodoPayments
DODO_PAYMENTS_API_KEY=your_api_key_here
DODO_PAYMENTS_ENVIRONMENT=test_mode
DODO_PAYMENTS_WEBHOOK_KEY=your_webhook_key_here

# App URL
NEXT_PUBLIC_APP_URL=http://localhost:3000

Setze DODO_PAYMENTS_ENVIRONMENT auf test_mode oder live_mode. Der generierte Dodo Payments-Client löst bei jedem anderen Wert einen Fehler aus.

Speichere deine API-Schlüssel in Umgebungsvariablen. Übertrage sie niemals in die Versionsverwaltung.

Verfügbare Komponenten

Billing SDK stellt React-Komponenten in diesen Gruppen bereit:

Preistabellen: Acht Varianten, pricing-table-one bis pricing-table-eight, zur Anzeige von Produktpreisen.
Abonnementverwaltung: subscription-management sowie Karten und Dialoge zum Kündigen eines Abonnements oder Aktualisieren eines Plans.
Nutzungsüberwachung: Kreisförmige und lineare Nutzungszähler sowie Nutzungstabellen für nutzungsbasierte Abrechnung.
Checkout-Komponenten: Eine Auswahl für die Zahlungsmethode, Formulare für Zahlungsdetails und eine Karte für fehlgeschlagene Zahlungen.
Customer Portal: Billing-Einstellungen, ein Billing-Bildschirm, der Rechnungsverlauf und bevorstehende Belastungen für die Selbstverwaltung durch Kunden.

Eine Übersicht aller Komponenten mit Live-Vorschau findest du in der Komponentenbibliothek.

Open Source

Billing SDK ist Open Source:

Transparenz: Du kannst nachvollziehen, wie jede Komponente funktioniert.
Community: Entwickler entwickeln es für andere Entwickler.
Sicherheit: Jeder kann den Code auf Sicherheitsprobleme prüfen.
Innovation: Beiträge aus der Community beschleunigen die Entwicklung.

Billing SDK wird unter der GNU General Public License v3.0 (GPL-3.0) veröffentlicht, wodurch das Projekt offen und kostenlos bleibt.

Hilfe erhalten

Wenn du Hilfe zu Billing SDK benötigst, nutze diese Ressourcen:

GitHub Issues: Issue eröffnen
Dokumentation: Besuche billingsdk.com/docs
Vollständige Dokumentation für LLMs: billingsdk.com/llms-full.txt

Mitwirken

Billing SDK begrüßt Beiträge. Der Beitragsleitfaden erklärt, wie du:

Fehler meldest
Features anforderst
Pull Requests einreichst
Neue Komponenten hinzufügst
Die Dokumentation verbesserst

Mehr erfahren

Full Documentation

Vollständiger Leitfaden zu Billing SDK mit Beispielen und Best Practices

CLI Reference

Ausführliche CLI-Dokumentation für alle Befehle und Optionen

Component Library

Alle verfügbaren Komponenten mit Live-Beispielen durchsuchen

Getting Started

Features

Integrate

Merchant of Record

Miscellaneous

Übersicht

Schnellstart

Unterstützte Frameworks

CLI-Befehle

`@billingsdk/cli init`

`@billingsdk/cli add`

Struktur der generierten Dateien

Beispielstruktur für Next.js

Umgebungskonfiguration

Verfügbare Komponenten

Open Source

Hilfe erhalten

Mitwirken

Mehr erfahren

Full Documentation

CLI Reference

Component Library

​Übersicht

​Schnellstart

​Unterstützte Frameworks

​CLI-Befehle

​@billingsdk/cli init

​@billingsdk/cli add

​Struktur der generierten Dateien

​Beispielstruktur für Next.js

​Umgebungskonfiguration

​Verfügbare Komponenten

​Open Source

​Hilfe erhalten

​Mitwirken

​Mehr erfahren

Full Documentation

CLI Reference

Component Library

Übersicht

Schnellstart

Unterstützte Frameworks

CLI-Befehle

`@billingsdk/cli init`

`@billingsdk/cli add`

Struktur der generierten Dateien

Beispielstruktur für Next.js

Umgebungskonfiguration

Verfügbare Komponenten

Open Source

Hilfe erhalten

Mitwirken

Mehr erfahren