Shopifyアプリ開発向けBolt.new代替

Bolt.newが得意なこと

StackBlitzが作るBolt.newは、Webサイト、Webアプリ、モバイルアプリ向けのAIビルダーです。StackBlitzのWebContainers技術を使い、ブラウザの中で完全なNode.jsプロジェクトを動かすため、AIが書く様子をそのまま動かしながら見られます。プロジェクトはBolt自身のホスティングに公開したり、データベースに接続したり、GitHubと同期したりできます。

ランディングページ、社内ダッシュボード、手早いプロトタイプ、あるいは単独で動くWebアプリであれば、アイデアからクリックできるものまで最速で到達する方法の一つです。

この記事を書いている時点では、BoltのリリースノートにはSupabase、GitHub、Netlify、Figmaなどの連携が挙がっていますが、Shopify専用の連携はありません。BoltプロジェクトからShopifyのAPIを呼ぶこと自体は可能ですが、Shopify部分は自分で作る必要があります。

Shopifyアプリ開発が難しくなるところ

よくある最初の試みは「Admin APIトークンを使って自分のShopify商品を表示するダッシュボードを作って」というプロンプトです。これは動きます。問題が始まるのは、それを本物のShopifyアプリにしたいときです。

• トークンはサーバー側に置く必要がある。 Admin APIアクセストークンはストアを読み書きできます。ブラウザに渡してはいけませんし、ShopifyのAdmin APIはそもそもブラウザから呼ぶ設計になっていません。トークンをフロントエンドのコードに置くプロトタイプは、近道ではなくセキュリティ上の問題です。
• 本物のアプリはShopifyを通じてインストールされる。 つまりShopifyのOAuthフロー、マーチャントが承認するアクセス権限、Shopify管理画面へのエントリが必要で、別のログインを持つ独立したWebサイトではありません。
• 拡張機能はShopifyのツールを通じてデプロイする。 テーマアプリ拡張、チェックアウトUI拡張、Shopify FunctionsはShopify CLIで構築・登録します。ブラウザのサンドボックスはこのパイプラインの代わりにはなりません。
• アプリは動き続ける必要がある。 新規注文のWebhook、夜間のジョブ、Shopifyが必須とするプライバシーWebhookには、常時稼働するバックエンドが必要です。
• Shopifyは変化を続ける。 新しいAPIバージョンが四半期ごとに公開され、古いものはスケジュールに沿って廃止されるため、誰かがアプリを最新に保つ必要があります。

これらは汎用ビルダーでも不可能ではありません。ただ、指示しない限りビルダーが知らずにいる作業であり、それには自分がすでにShopifyアプリ開発を知っていることが前提になります。

AppFly：Shopifyのために作られたBolt.newの代替

AppFlyはAI Shopifyアプリビルダーです。Bolt.newの好まれている部分 — 説明し、作られる様子を見て、チャットで変更する — はそのまま残し、その下にShopifyプラットフォームを追加しています。

• 本物のShopifyアプリ。 アプリは通常のShopifyの手順でストアにインストールされ、管理画面に表示されます。AppFlyは各サーフェスが必要とする権限だけを要求し、それ以外は要求しません。
• 7つのサーフェスをネイティブに構築。 管理画面のページ、ストアフロントのブロック、割引ルール、チェックアウトのブロック、顧客アカウントのページ、Flowのステップ、POSのタイル。作れるものをご覧ください。
• 見られる本物のビルド。 コーディングエージェントが隔離されたコンテナにプロジェクトを書き、ファイル、コマンド、インストールが起きるたびに画面に流れます。
• 稼働を続けるホスティング。 デプロイしたアプリには専用のサブドメインと専用のPostgresデータベースが用意され、プラットフォームが定期ジョブとWebhookを動かし続けます。
• 自分のエージェントを使う。 すでに料金を払っているアカウントでClaude Code、Codex、OpenCodeを使えます。
• 保守のサポート。 App Doctorが停止したコンテナ、ずれた設定、コードと一致しなくなったスキーマを監視し、修正を提案します。

Shopify向け Bolt.new vs. AppFly

• 向いている用途。 Bolt.new：どんな種類のWebアプリ、サイト、プロトタイプにも。AppFly：Shopifyストアの中で動くアプリと拡張機能に。
• Shopifyの設定。 Bolt.new：OAuth、権限、Webhook、拡張機能を自分で組み立てる。AppFly：サーフェスごとに組み込み済み。
• 動く場所。 Bolt.new：構築中はブラウザ、その後は自社ホスティング。AppFly：構築中は隔離されたコンテナ、その後は専用のサブドメイン、データベース、Shopify管理画面のエントリ。
• プレビュー。 AppFlyは実際のストアに対してアプリをプレビューし、公開前に正確な差分を確認できるよう開発版と本番版を並べて管理します。
• コード。 どちらも本物のプロジェクトを渡してくれます。AppFlyのアプリはエクスポートして自分でホストできる普通のコードベースです。
• 料金。 AppFlyは1つのアプリの作成とプレビューが無料で、本番デプロイは月額$29からです。Boltの現在のプランはBoltのサイトでご確認ください。

どちらを使うべきか

マーケティングサイト、単独のツール、あるいは捨てるか開発者に渡すだけの手早いクリック可能なプロトタイプにはBolt.newを使いましょう。

必要なものがShopifyに属する場合 — 管理画面のチーム向けツール、ストアフロントのウィジェット、チェックアウトのブロック、割引、自動化 — にはAppFlyを使いましょう。他の方法の費用を検討しているなら、独自Shopifyアプリの費用のガイドで詳しく解説しています。

Shopifyアプリによく効くプロンプト

どのツールを使うにしても、Shopifyアプリのプロンプトは3つのことを指定するとうまくいきます — アプリの置き場所、使う人、扱うデータです。

• 「過去7日間の500ドル超の注文を一覧にする管理画面のページ。出荷担当リーダー向け。」
• 「午後2時の締め時間を基準にお届け予定日を表示する商品ページのブロック。」
• 「割引ルール：カートにSummerコレクションの商品が3点あれば10%オフ、5点で15%オフ。」

これらをプロンプト欄に入力してAppFlyの対応を確認するか、AIでShopifyアプリを作る方法で全体の方法を読んでみてください。

よくある質問

Bolt.newでShopifyアプリは作れますか？

Bolt.newはShopifyのAPIを呼ぶWebアプリを作れますが、この記事を書いている時点ではShopify専用の連携はありません。それをインストール可能なShopifyアプリ — OAuth、アクセス権限、拡張機能、Webhook — にするのは自分で行う作業です。

Shopify向けの最良のBolt.new代替は何ですか？

Shopifyストアの中で動くアプリや拡張機能には、AppFlyのようなShopify専用ビルダーがより適しています。ストアに本物のShopifyアプリをインストールし、サーフェスごとのプラットフォーム設定を行います。

Shopify Admin APIトークンをBolt.newプロジェクトに置いても安全ですか？

サーバー側のコードに置く場合のみ安全です。Admin APIトークンはストアを読み書きできるため、ブラウザで動くフロントエンドのコードに現れてはいけません。

AppFlyを使うのにプログラミングの知識は必要ですか？

いいえ。アプリと変更内容をすべて普通の言葉で説明するだけです。コードが少し読めると作られたものを確認しやすくなりますが、必須ではありません。