「自分のライブやイベントのチケットをオンラインで販売したい」「既存のチケット販売プラットフォームの手数料が高いので自前で作りたい」「座席選択・Stripe決済・QRコード入場管理まで一括でできるシステムを開発したい」——そんな主催者向けのチケット販売システムの開発手順を解説します。本記事では、イベント登録・座席選択・Stripe決済・購入確認メール・QRコード発行・入場スキャンまでの一連のフローを、実際に動くデモを交えながら解説します。Next.js + Node.js + PostgreSQL + Stripe + SendGridの構成でSaaS化まで含めた実践的な内容です。
なぜ自前のチケット販売システムを作るのか
既存のチケット販売プラットフォーム（チケットぴあ・イープラスなど）は手数料が売上の10〜20%かかります。自前のシステムを構築すればStripeの決済手数料（3.6%）のみで済み、ユーザーデータも自社で保持できます。
| 比較項目 | 既存プラットフォーム | 自前システム |
|---|---|---|
| 手数料 | 売上の10〜20% | Stripe手数料3.6%のみ |
| 顧客データ | プラットフォームが保有 | 自社で保有・活用可能 |
| デザイン | テンプレート固定 | ブランドに合わせて自由 |
| 機能追加 | プラットフォーム依存 | 自由に追加可能 |
実際に動かしてみる（デモ）
以下は実際に動作するデモです。座席を選択して「購入へ進む」ボタンを押すと、確認画面・決済フロー・購入完了・QRコード発行までのシミュレーションを体験できます。
開発手順（8ステップ）
STEP 1：システム設計とアーキテクチャ
フロントエンドはNext.js 15（座席選択UI・購入フロー）、バックエンドはNode.js + Express（在庫管理・決済API）、データベースはPostgreSQL（イベント・チケット・注文・ユーザー管理）、決済はStripe Checkout、メール送信はSendGrid、QRコード生成はqrcodeライブラリ、ホスティングはVercel（フロントエンド）+ Railway（バックエンド・PostgreSQL）が推奨構成です。初期コストを抑えてMVPを作る場合、月額5,000円以下で運用できます。
STEP 2：データベース設計
PostgreSQLで4テーブルを設計します。eventsテーブル（イベント名・日時・会場・説明・画像URL）、ticket_typesテーブル（event_id・種別名・価格・在庫数・残席数）、ordersテーブル（user_id・event_id・合計金額・Stripe決済ID・注文番号・ステータス）、order_itemsテーブル（order_id・ticket_type_id・枚数・単価）です。
STEP 3：座席選択UIの実装
チケット種別（S席・A席・B席）の数量選択UIをReactで実装します。状態管理はuseStateでシンプルに実装し、合計金額はuseEffectまたはuseMemoで自動計算します。枚数上限（1注文4枚まで）をフロントエンドとバックエンド両方でバリデーションします。
STEP 4：Stripe決済の実装
Stripe Checkoutで決済を実装します。バックエンドでStripe APIを呼び出してCheckoutセッションを作成し、フロントエンドでStripe.jsのredirectToCheckoutでStripeの決済画面にリダイレクトします。テスト用カード番号（4242 4242 4242 4242）で本番前に動作確認します。
STEP 5：在庫管理と同時購入対策
PostgreSQLのSELECT ... FOR UPDATEでチケット在庫行をロックしてから在庫チェック→減算→コミットの順で処理します。Redisを使ったセッションベースの仮押さえ（10分間の座席確保→時間切れで自動解放）も実装できます。
STEP 6：QRコード発行とメール通知
qrcodeライブラリ（Node.js）でQRコードを生成します。QRコードには注文番号・イベントID・ユーザーID・発行日時をJSON形式でエンコードし、AES-256で署名して改ざんを防止します。SendGridで購入完了メールを送信します。
STEP 7：入場管理システムの実装
スタッフ用の入場スキャンアプリをReact Native + Expo（スマホカメラでQRスキャン）またはWebカメラを使ったWebアプリで実装します。スキャン時はQRコードの署名を検証→注文番号でDB照会→入場済みフラグを確認→未入場なら入場済みに更新の順で処理します。
STEP 8：イベント管理画面と収益化
主催者向けの管理画面をNext.jsで実装します。主な機能はイベント作成・編集・公開/非公開切り替え、チケット種別・価格・在庫の管理、リアルタイム販売状況の確認、購入者一覧・入場状況の確認、CSVエクスポートです。
開発・運用コストの目安
Next.js + Node.js + PostgreSQL + Stripe + SendGridの構成なら、座席選択・Stripe決済・QRコード発行の基本フローを備えたMVPを10万円程度から開発できます。
| フェーズ | 内容 | 費用目安 |
|---|---|---|
| フェーズ1（MVP） | 座席選択・Stripe決済・QRコード・確認メール | 10万〜30万円 |
| フェーズ2（機能追加） | 入場管理・在庫管理・管理画面・複数イベント対応 | 10万〜30万円 |
| フェーズ3（SaaS化） | マルチテナント・手数料課金・分析ダッシュボード | 10万〜50万円 |
| Stripe決済手数料 | 売上の3.6%（国内カード） | 売上連動 |
| SendGrid | 月100通まで無料 | 月0円〜5,000円 |
| サーバー（Vercel + Railway） | フロントエンド + バックエンド + DB | 月3,000円〜10,000円 |
| 月額運用費（目安） | サーバー + 保守 + サポート | 月3万〜10万円 |
よくある質問
同時アクセスが集中した場合の在庫超過はどう防ぎますか？
PostgreSQLのSELECT ... FOR UPDATEによる行レベルロックが基本対策です。さらにRedisで「仮押さえ」を実装し、Stripe Checkoutセッション作成時点で在庫を仮押さえ（有効期限10分）して決済完了後に確定、決済失敗・タイムアウト時は自動解放する設計が推奨です。
QRコードの偽造対策はどうすればいいですか？
QRコードに含めるデータをHMAC-SHA256で署名することで偽造を防げます。入場スキャン時にサーバー側で署名を検証し、一度スキャンしたQRコードをDB上で「入場済み」にマークして二重入場を防止します。
Apple Pay・Google Payにも対応できますか？
Stripe Checkoutを使えばApple Pay・Google Pay・コンビニ払い・銀行振込に自動対応します。
まとめ
Next.js + Node.js + PostgreSQL + Stripe + SendGridの構成でチケット販売システムをMVP10万円程度から開発できます。Stripeの決済手数料3.6%のみで運用でき、既存プラットフォームの10〜20%と比べて大幅にコストを削減できます。
開発のご相談や見積もりはお気軽にお問い合わせください。要件定義からリリースまで一貫してサポートします。