概要
Billing SDKは次の機能を提供します:- Reactコンポーネント:Reactアプリケーション用の事前構築されたカスタマイズ可能な請求コンポーネント
- CLIツール:プロジェクトの初期化とコンポーネント管理のためのコマンドラインインターフェース
- フレームワークサポート:Next.js、Express.js、Hono、Fastify、Reactとの統合
- 決済プロバイダー:Dodo Paymentsとの完全統合
クイックスタート
数分でBilling SDKを始めましょう:1
CLIをインストール
インストールせずにnpxを使用してCLIを実行します:または、頻繁に使用するためにグローバルにインストールします:
2
プロジェクトを初期化
インタラクティブなセットアップを実行して新しい請求プロジェクトを作成します:次の選択を求められます:
- お好みのフレームワーク(Next.js、Express.js、Hono、Fastify、React)
- お好みの決済プロバイダー(Dodo Payments)
3
コンポーネントを追加
プロジェクトに個別の請求コンポーネントを追加します:
サポートされているフレームワーク
Billing SDKは、Dodo Paymentsとの包括的な統合を備えた複数のフレームワークをサポートしています:| フレームワーク | Dodo Payments |
|---|---|
| Next.js | ✅ はい |
| Express.js | ✅ はい |
| Hono | ✅ はい |
| React | ✅ はい |
| Fastify | ✅ はい |
CLIコマンド
@billingsdk/cli init
フレームワークの設定、Dodo Paymentsの統合、および必須の依存関係を含む完全なセットアップで新しい請求プロジェクトを初期化します。
何をするか:
- フレームワークの選択:お好みのフレームワークを選択します
- テンプレートのインストール:Dodo Payments統合を含むフレームワーク固有のテンプレートをダウンロードしてインストールします
- 依存関係の管理:必要な依存関係を自動的にインストールします
- ファイル生成:必要な設定ファイルとボイラープレートコードを作成します
@billingsdk/cli add
shadcn/uiレジストリシステムを使用して、既存のプロジェクトに個別の請求コンポーネントを追加します。
例:
- レジストリからコンポーネント設定をダウンロードします
components/billingsdk/ディレクトリにコンポーネントファイルをインストールします- 必要に応じてプロジェクト設定を更新します
- 追加の依存関係をインストールします
生成されたファイル構造
initを実行した後、次の内容を含む完全なプロジェクト構造が得られます:
- APIルート:チェックアウト、顧客、製品、サブスクリプション、およびWebhookのための包括的なエンドポイント
- フック:請求操作のためのReactフック(React/Next.jsを使用している場合)
- ライブラリファイル:決済プロバイダーのクライアント初期化とユーティリティ
- 環境設定:環境変数ファイルの例
Next.jsの例構造
環境設定
初期化後に環境変数を設定します:利用可能なコンポーネント
Billing SDKは、包括的なReactコンポーネントのコレクションを提供します:- 価格表:製品価格を表示するための複数のバリアント
- サブスクリプション管理:顧客のサブスクリプションを管理するためのコンポーネント
- 使用状況監視:使用ベースの請求を追跡するための視覚コンポーネント
- チェックアウトコンポーネント:事前構築されたチェックアウトフロー
- 顧客ポータル:顧客自己サービス用のコンポーネント
オープンソース
Billing SDKはオープンソースの原則に基づいて構築されています:- 🔍 透明性:コンポーネントの動作を完全に可視化
- 🤝 コミュニティ:開発者によって、開発者のために構築
- 🔒 セキュリティ:オープンコードはピアレビューによるより良いセキュリティを意味します
- 📈 イノベーション:コミュニティの貢献による迅速な反復
Billing SDKはGNU一般公衆ライセンス(GPL)の下でリリースされており、プロジェクトがオープンで自由であり続けることを保証します。
ヘルプを得る
Billing SDKに関して支援が必要ですか?- GitHub Issues: 問題を開く
- ドキュメント: billingsdk.com/docsを訪問
- LLMs完全ドキュメント: billingsdk.com/llms-full.txt
貢献
私たちは貢献を歓迎します!詳細については、貢献ガイドをご覧ください:- バグの報告
- 機能のリクエスト
- プルリクエストの提出
- 新しいコンポーネントの追加
- ドキュメントの改善