Claude CodeでShopifyアプリを作る:仕様駆動開発と料金設計

Dev.to / 2026/5/3

💬 オピニオンDeveloper Stack & InfrastructureTools & Practical UsageModels & Research

要点

  • 著者は、ソロ開発者としてClaude Codeを使ってShopifyアプリを作る手順を説明しており、200行以上の詳細な仕様書を書いたうえで生成されたコードは各行を必ずレビューします。
  • この投稿は「プロンプトで作ってもらう」のではなく、仕様駆動で開発する点を強調しており、GraphQLのどのミューテーションを使うか、課金ロジック、利用計測テーブルの配置、リトライやエラーハンドリングの方針といった設計判断まで著者が担います。
  • 課金システムについては、プラン比較(Free/Proと上限の具体値)、利用計測用のPrismaスキーマ、サブスクリプション検出のための正確なGraphQLクエリ、失敗時のルールや冪等性要件などを含む仕様が作られています。
  • 課金実装は複数回のレビューを要し、失敗時の再試行でクォータを回避できてしまう「計数基準の不一致」、リトライで二重計上が起きる「冪等性ガードの欠如」、意図したハードキャップではなくソフトキャップになっていた点などの問題を見つけて修正しました。
  • 全体として、実利用とエッジケースに基づいた制限・課金の挙動を丁寧に設計することで、ユーザーがコミット前にアプリを適切に試せることを目指しています。

これは、CSVを通じてメタオブジェクトを一括編集するShopifyアプリMetaBulkifyを作るシリーズのパート3です。

  • パート1: Excelによるデータ破損とGID/ハンドルの解決
  • パート2: Shopifyプラットフォームの落とし穴(スコープ、スロットリング、開発ストアの課金)

この記事では2つのことについて書きます。1つは、AIを使ってソロ開発者としてソフトウェアをどう作っているか。もう1つは、ユーザーがコミットする前にアプリを適切に試せるように、どのように料金設計したかです。

実際にどうやって物を作っているか

私は本業があります。本業の合間に、平日夜や週末にサイドプロジェクトを書いています。時間が最も貴重な資源です。

私のワークフローはこうです。詳細な仕様書を書いて、実装はClaude Codeに委譲します。プロンプトではありません。「アプリを作って」と言うわけでもありません。実際の仕様——データモデル、エッジケース、エラー処理、安全性に関する注意事項まで含めた、200行以上の指示ドキュメントです。

その後、Claude Codeがコードを書き、私はすべての行をレビューします。

これは「AIが私のアプリを書いた」ではありません。アーキテクチャの決定はすべて私が行います:

  • どのGraphQLミューテーションを使うか
  • 課金がどう動くか
  • 使用状況のトラッキングテーブルをどこに置くか
  • Cloud Tasksが失敗したジョブをリトライしたときにどうなるか
  • APIエラーのときにfail-openにするかfail-closedにするか

Claude Codeは速いペアプログラマで、疲れません。そして、私が「もう一度3回目の書き直しをして」と頼んだときに、食い下がってきません。

仕様書はどんな見た目か

課金システムについて、私の仕様には含まれていました:

  • プラン比較表(Free vs Pro、正確な上限)
  • 使用状況トラッキングテーブル用のPrismaスキーマ
  • サブスクリプション検知のための、正確なGraphQLクエリ
  • エラーハンドリングルール(fail-closed、成功ではなく試行回数を数える)
  • 冪等性の要件(Cloud Tasksのリトライで二重カウントしてはいけない)
  • 擬似コードでのUIモック(どのPolaris Web Componentsを使うか、どこにバナーを出すか)
  • テスト手順(「DBの値を9999に手動で設定してブロックされることを確認する」など)

Claude Codeが全部実装しました。私はレビューして、3つの問題を見つけて詳細なフィードバックを送りました。Claude Codeが修正。私はもう一度レビューし、さらに1つ問題を見つけてフィードバック。3回目の修正はクリーンで、リリースしました。

課金だけでレビュー3ラウンド。私が見つけたバグ:

  1. カウントの基準の不一致——ブロック判定は総行数に基づくのに、記録しているのは成功した行だけです。これにより、失敗したインポートを再試行することでクォータを回避できてしまいます。
  2. 冪等性ガードがない——Cloud Tasksのリトライによって使用量が二重カウントされ得ます。原子的なupdateManyのWHERE句で修正しました。
  3. ハードキャップではなくソフトキャップ——Proプランのクォータ超過は「警告のみ」になっていました。制限を強制しないのであれば、それは制限ではないため、ハードブロックに変更しました。

これらはすべてコーディングミスではなくプロダクト上の判断です。Claude Codeは、私が求めた内容を実装しました。私は間違ったものを指定していました。レビュー工程がそれを発見したのです。

仕様書駆動の利点

コーディングの前に仕様を書くことで、エッジケースを最初に考えることを強制されます。「使用量を記録した後、ジョブステータスを更新する前にインポートワーカーがクラッシュしたらどうなる?」という問いは、仕様を書くときに自然と出てきます。コードを書くときには、めったに出てきません。

さらに、仕様書は“証跡”も作ります。本番で何かが壊れたとき、仕様書を見れば、実装が計画から逸脱していたのか、それともそもそもの計画が間違っていたのかを判断できます。

そして率直に言うと、仕様を書く方がコードを書くより速いです。200行の仕様書なら私に2〜3時間かかります。実装はClaude Codeが20分です。レビューはさらに1時間。合計:手作業でコードを書くなら2〜3日かかるような機能を、約4時間で仕上げられます。

料金設計:コミットする前にユーザーに試させる

一括操作のアプリには、特有の課題があります。人々は毎日それを使いません。必要になったときに使うのです。料金はその現実を反映させる必要があります。

私の解決策:

Free Pro ($9.99/mo)
CSV Export 無制限 無制限
CSV Import 50行(ライフタイム) 10,000行/月

それぞれの判断の背景:

エクスポートは無料で無制限。 まずはリスクゼロでアプリを試してほしいです。データをエクスポートして、CSVの形式が自分のワークフローに合うか確認してください。もしうまくいかなければ、あなたは何も支払っていません。

無料のインポート行は50行。 実際のテストをするのに十分です。メタオブジェクトの種類を選び、いくつかのエントリをインポートして、ストアで期待通りに動くことを確認してください。何も支払う前に、アプリがフィールドの種類、参照フィールド、データ形式を正しく扱えているかを確かめられます。

Proには無料トライアルを設けない。 時計を気にして走るような時間制のトライアルの代わりに、無料プランは恒久的なサンドボックスを提供します。時間をかけてください。月曜日にテストして、木曜日に戻ってもう一度テストできます。プレッシャーはありません。

Proは月額$9.99。 これは一点に絞ったツールで、やることは1つです。価格もそれを反映しており、スイスアーミーナイフになろうとしていません。

数字

正直な話:

  • 売上: $9.99(サブスクリプション1件——料金検知のバグのせいで2時間後にアンインストールされました。価格の問題ではありません)
  • インフラコスト: 現在の規模では実質$0/月
  • 開発時間: 平日夜と週末で数週間
  • 仕様書を執筆: 実際のコードよりも、おそらく文字数が多い

テックスタック

気になる方へ:

  • React Router v7 + Shopify App Remix
  • Polaris Web Components(<s-banner>, <s-button>——Reactライブラリではありません)
  • Neon Postgres + Prisma
  • GCP Cloud Run + Cloud Tasks
  • JSONベースのi18n(英語+日本語)

インフラコストは現在の規模ではほぼゼロです。これが変わるなら、それはアプリが稼いでいるということを意味します——良い問題ですね。

別のやり方をするとしたら

  1. 最初から、Excelで編集したCSVでテストする。 正規化の問題(パート1)は、すぐに露呈していたはずです。
  2. 開発ストアではなく実際のストアで課金をテストする。 開発ストアの課金トラップ(パート2)のせいで顧客を失いました。
  3. より少ない機能で出荷する。 i18nは後回しでもよかったかもしれません。ドライランのプレビューは必須でした。その他は“あれば嬉しい”程度です。
  4. アプリが「完成」する前にマーケティングを始める。 完成なんて永遠にありません。もっと早くShopifyのコミュニティフォーラムやdev.toに投稿すべきでした。数週間前に。

MetaBulkifyを試してみる

ドライランのプレビュー付きで、CSVからShopifyのメタオブジェクトをエクスポート/インポートできます。

Shopify App StoreのMetaBulkify

無料プランには無制限のエクスポートと、インポート50行が含まれます。
返却形式: {"translated": "翻訳されたHTML"}私は開発者です。ご質問やフィードバックはコメント欄で歓迎します。