メインコンテンツへスキップ
Billing SDKは、現代のWebアプリケーション向けの完全な請求インフラストラクチャを提供する包括的なオープンソースソリューションです。Reactコンポーネント、CLIツール、およびDodo Paymentsとの複数のフレームワークに対するフルスタック統合サポートが含まれています。

概要

Billing SDKは次の機能を提供します:
  • Reactコンポーネント:Reactアプリケーション用の事前構築されたカスタマイズ可能な請求コンポーネント
  • CLIツール:プロジェクトの初期化とコンポーネント管理のためのコマンドラインインターフェース
  • フレームワークサポート:Next.js、Express.js、Hono、Fastify、Reactとの統合
  • 決済プロバイダー:Dodo Paymentsとの完全統合

クイックスタート

数分でBilling SDKを始めましょう:
1

CLIをインストール

インストールせずにnpxを使用してCLIを実行します:
npx @billingsdk/cli --help
または、頻繁に使用するためにグローバルにインストールします:
npm install -g @billingsdk/cli
2

プロジェクトを初期化

インタラクティブなセットアップを実行して新しい請求プロジェクトを作成します:
npx @billingsdk/cli init
次の選択を求められます:
  • お好みのフレームワーク(Next.js、Express.js、Hono、Fastify、React)
  • お好みの決済プロバイダー(Dodo Payments)
3

コンポーネントを追加

プロジェクトに個別の請求コンポーネントを追加します:
npx @billingsdk/cli add pricing-table-one
npx @billingsdk/cli add subscription-management

サポートされているフレームワーク

Billing SDKは、Dodo Paymentsとの包括的な統合を備えた複数のフレームワークをサポートしています:
フレームワークDodo Payments
Next.js✅ はい
Express.js✅ はい
Hono✅ はい
React✅ はい
Fastify✅ はい

CLIコマンド

@billingsdk/cli init

フレームワークの設定、Dodo Paymentsの統合、および必須の依存関係を含む完全なセットアップで新しい請求プロジェクトを初期化します。 何をするか:
  1. フレームワークの選択:お好みのフレームワークを選択します
  2. テンプレートのインストール:Dodo Payments統合を含むフレームワーク固有のテンプレートをダウンロードしてインストールします
  3. 依存関係の管理:必要な依存関係を自動的にインストールします
  4. ファイル生成:必要な設定ファイルとボイラープレートコードを作成します
例:
npx @billingsdk/cli init

@billingsdk/cli add

shadcn/uiレジストリシステムを使用して、既存のプロジェクトに個別の請求コンポーネントを追加します。 例:
# 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
何が起こるか:
  1. レジストリからコンポーネント設定をダウンロードします
  2. components/billingsdk/ディレクトリにコンポーネントファイルをインストールします
  3. 必要に応じてプロジェクト設定を更新します
  4. 追加の依存関係をインストールします

生成されたファイル構造

initを実行した後、次の内容を含む完全なプロジェクト構造が得られます:
  • APIルート:チェックアウト、顧客、製品、サブスクリプション、およびWebhookのための包括的なエンドポイント
  • フック:請求操作のためのReactフック(React/Next.jsを使用している場合)
  • ライブラリファイル:決済プロバイダーのクライアント初期化とユーティリティ
  • 環境設定:環境変数ファイルの例

Next.jsの例構造

your-project/
├── app/api/
│   └── (dodopayments)/
│       ├── 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

環境設定

初期化後に環境変数を設定します:
# 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
APIキーは常に環境変数を使用して安全に保管してください。バージョン管理にコミットしないでください。

利用可能なコンポーネント

Billing SDKは、包括的なReactコンポーネントのコレクションを提供します:
  • 価格表:製品価格を表示するための複数のバリアント
  • サブスクリプション管理:顧客のサブスクリプションを管理するためのコンポーネント
  • 使用状況監視:使用ベースの請求を追跡するための視覚コンポーネント
  • チェックアウトコンポーネント:事前構築されたチェックアウトフロー
  • 顧客ポータル:顧客自己サービス用のコンポーネント

オープンソース

Billing SDKはオープンソースの原則に基づいて構築されています:
  • 🔍 透明性:コンポーネントの動作を完全に可視化
  • 🤝 コミュニティ:開発者によって、開発者のために構築
  • 🔒 セキュリティ:オープンコードはピアレビューによるより良いセキュリティを意味します
  • 📈 イノベーション:コミュニティの貢献による迅速な反復
Billing SDKはGNU一般公衆ライセンス(GPL)の下でリリースされており、プロジェクトがオープンで自由であり続けることを保証します。

ヘルプを得る

Billing SDKに関して支援が必要ですか?

貢献

私たちは貢献を歓迎します!詳細については、貢献ガイドをご覧ください:
  • バグの報告
  • 機能のリクエスト
  • プルリクエストの提出
  • 新しいコンポーネントの追加
  • ドキュメントの改善

さらに学ぶ