Claude Code からアプリをデプロイする方法

Claude Code から一度のセッションでアプリを公開。MCP かプラグインで Fine Structure に接続し、ホスティング、データベース、認証、ドメインまで揃えます。

このガイドの対象者

Claude Code で作業していて、いま作ったばかりのプロジェクトを、ホスティングとデータと認証まで整った状態で公開したい作り手。

このガイドで得られるもの

- Claude Code から公開 URL まで、一度のセッションで通るデプロイ経路

- プラットフォームが何をホストしてくれるのかの明確な把握: ページ、データベース、認証、ドメイン

- 静的ホストのほうが向いているのはいつかを見極める正直な判断基準

Claude Code からデプロイするとは実際どういうことか

Claude Code からアプリをデプロイするには、それをホストできる runtime に Claude を接続します。Fine Structure には入口が 2 つあります。claude.ai の設定で https://finestructure.ai/api/mcp をカスタムコネクタとして追加し OAuth を承認する方法と、オープンソースのプラグインを /plugin marketplace add finestructure-ai/claude-plugin に続けて /plugin install finestructure@finestructure で導入する方法です。そのあと Claude は create_app で完成したアプリを生成するか、既存プロジェクトをファイル単位でプラットフォームの runtime へ移植します。結果はホスティングされた React ページとして動き、マネージドなデータベース、認証、独自ドメイン、保存版へのロールバックが付きます。無料枠にカードは不要で、生成はクレジットを消費しますが、編集と公開とドメインは無料です。

Claude Code はアプリを作るのがとても得意で、動かすことはまったくできません。セッションが終わると、ディスクにフォルダが残ります。React のコンポーネント、会話しながら形になったデータモデル、そしてサーバーがどこかにある前提の認証フロー。デプロイとは、そのフォルダが URL とデータベースを手に入れ、自分以外の人でも通れるログインを備える瞬間です。

この段階の定番の答えは配管作業です。リポジトリに push し、CI をつなぎ、別の場所にデータベースを用意し、認証サービスを足し、DNS を向け、証明書を待つ。ひとつずつは妥当でも、合計すると午後がまるごと消えます。もうひとつの答えは、必要な部品をすでに備えた runtime へ Claude Code に直接アクセスさせることです。そうすればデプロイは同じ会話のなかの 1 回のツール呼び出しになります。

正直な言い方: 私たちのプラットフォームは、既存のスタックにねじ止めするデプロイボタンではありません。これは runtime であり、アプリはその中へ引っ越します。これは本物の取引です。ホスティング、データベース、認証、ドメインを自分で組み立てずに手に入れ、そのかわりサーバー層の主導権を手放します。

Claude を Fine Structure につなぐには

経路は 2 つ、行き先は同じです。同じアカウント、同じアプリ群。作業の大半が claude.ai で進むならコネクタを選んでください。ターミナルに住んでいて、デプロイのコマンドをコードのそばに置きたいならプラグインを選んでください。

経路 1: MCP コネクタ: claude.ai で設定を開き、Add custom connector を選び、URL に https://finestructure.ai/api/mcp を貼り付けて OAuth を承認します。クリック 1 回で完了し、API key も、設定ファイルに住み着く環境変数も要りません。以降 Claude はおよそ 70 個のツールを見ます。アプリ作成、ファイル書き込み、entities、公開、ドメイン、分析です。

経路 2: オープンソースの Claude Code プラグイン: /plugin marketplace add finestructure-ai/claude-plugin を実行し、続けて /plugin install finestructure@finestructure を実行します。これでセッションに /deploy、/fs-status、/fs-domain が加わります。ソースは公開されているので、説明文を信じるかわりに、入れる前に何を送信するのか自分で読めます。

ディレクトリ掲載について: 各ディレクトリへの申請は審査中です。それが終わるまで、コネクタやプラグインを公式、認証済み、掲載済みとは呼びません。導入する理由は、URL が公開されていてソースが読めることであって、名前の横のバッジではありません。

Claude に新規生成させるか、既存プロジェクトを移植するか

デプロイのモードは 2 つあります。ひとつは 1 文から始まります。create_app は短い指示を受け取り、ページ、entities のスキーマ、認証の配線、動作する URL を備えた完成したアプリを作ります。アイデアがまだ柔らかく、理解する一番速い方法が見ることである場合の近道です。生成はクレジットを消費し、この流れで唯一計測される部分です。

2 つ目のモードは、すでに手元にあるプロジェクトを移植します。Claude はあなたのファイルを読み、ひとつずつプラットフォームの runtime へ書き直します。ページはプラットフォームのページに、データモデルは entities に、認証の呼び出しはプラットフォームの認証になります。これは移植であって、盲目的なアップロードではありません。自分の管理下のサーバーを前提にしていたファイルはすべて runtime に合わせて書き直され、まさにそこで Claude Code が力を発揮します。

現実的な最初のセッションの姿: まず Claude にアプリを作ってもらい、プレビューを開き、ページが意図どおりになるまで同じ会話のなかでファイルを直し続けます。ファイル編集と公開はクレジットを消費しないので、生成後の改善ループは無料です。よさそうに見えたら公開し、ドメインをつなぎ、TLS は自動で片づくのを待ちます。

静的ホスティングへのデプロイとの違いは

静的ホストは自分の得意分野でとても優秀です。成果物がフロントエンドのバンドルだけなら、私たちより速く、安く、大きなエコシステムとともに配信してくれます。比較が面白くなるのは、アプリが状態とユーザーと戻り道を必要とし始めてからです。

アプリに必要なもの | Fine Structure | 静的デプロイ先

ホスティング | プラットフォームの runtime から配信されるホスト済み React ページ | フロントエンドの素の速度は最良、エコシステムも最大

データベース | マネージドな entities、最初のデプロイ前から利用可能 | 自前で用意し、別途構築して接続する

認証 | 標準搭載。セッションとアプリごとのユーザー付き | 自前の認証サービスか外部プロバイダを用意する

ドメイン | 自動 TLS 付きの独自ドメイン | 自動 TLS 付きの独自ドメイン、成熟した手順

ロールバック | アプリの保存済みバージョンを復元する | 以前の build を再デプロイするか commit を戻す

エージェント | スケジュールに沿って働き続ける AI エージェント | 含まれない。どこか別の場所で動かす

私たちが正解ではない場面: 別の道具のほうがよい場面が 3 つあり、それははっきり言います。自前でなければならないサーバー runtime、たとえば Go のバイナリや特定のシステムライブラリを要求する Python の worker。書き直すつもりのない独自バックエンドを抱えた monorepo。そして大規模な純粋静的ホスティング、つまりデータベースなしの CDN が勝つ領域です。

最初のデプロイのあとに得られるもの

デプロイは仕事の終わりではありません。アプリが意見のかわりに事実を生み出し始める地点です。そこで 4 つのことが使えるようになり、どれも会話の外に出る必要はありません。

人が驚くのはエージェントの部分です。ここでのエージェントは、ページに貼り付けたチャットのウィジェットではありません。アプリに紐づいた働き手で、ノートパソコンを閉じたあともスケジュールに沿って動き続け、アプリ自身のデータを読み、検証済みのオーナーへ WhatsApp やメールで連絡できます。こちらが見に行くのを待つのではなく、アプリのほうが何かが起きたと教えてくれます。

生成のあとはすべて同じ Claude のセッションのなかで完結します。ファイルを直し、公開し、ドメインを確認し、分析を読み、エージェントを調整する。無料枠はカードを求めないので、これを正直に評価する方法は、小さくても本物のアプリを 1 つ Claude に任せ、どこまで到達するかを見ることです。

よくある質問

Claude Code は単独でアプリをデプロイできますか

単独ではできません。Claude Code はファイルを書いて編集するだけで、それをホストできる先が必要です。私たちの MCP コネクタを追加するかプラグインを入れると、デプロイはツール呼び出しになります。アプリ作成、ファイル書き込み、公開、ドメイン接続です。

Fine Structure の MCP サーバーの URL は何ですか

https://finestructure.ai/api/mcp です。claude.ai で設定を開き、Add custom connector を選び、この URL を貼り付けて OAuth を承認してください。コピーする API key はなく、以降 Claude はおよそ 70 個のツールを見ます。

Claude Code のデプロイ用プラグインはどう入れますか

/plugin marketplace add finestructure-ai/claude-plugin を実行し、続けて /plugin install finestructure@finestructure を実行します。/deploy、/fs-status、/fs-domain が使えるようになります。プラグインはオープンソースで、ディレクトリ申請は審査中のため、公式であるとは主張しません。

無料枠はありますか。クレジットカードは必要ですか

無料枠はあり、カードは求めません。アプリの生成はクレジットを消費します。ファイル編集、公開、独自ドメインは消費しません。

新規生成ではなく既存の React プロジェクトをデプロイできますか

できます。Claude がファイル単位でプラットフォームの runtime へ移植します。ページはプラットフォームのページになり、データモデルは entities になり、認証の呼び出しは書き直されます。アップロードではなく移植なので、ファイルの形が変わることは想定してください。

プラットフォームは HTTPS と独自ドメインを扱いますか

はい。独自ドメインを追加すると TLS は自動で発行されます。ターミナルから /fs-domain を使うか、MCP コネクタ経由で Claude に頼んでください。

デプロイでアプリが壊れたらどうなりますか

保存済みバージョンを復元します。ロールバックはアプリを以前の保存状態に戻すもので、本番の変更を診断するより速いことが多く、比較のための動く基準も手に入ります。

これが適さないのはどんなときですか

自前でなければならないサーバー runtime が必要なとき、たとえば Go のバイナリや特定のシステムライブラリを要求する Python の worker です。monorepo が独自のバックエンドを持ち続けるとき。あるいは大規模な純粋静的ホスティングが欲しいとき、つまりデータベースなしの CDN が勝つ場面です。