Floot について
Floot MCP Connectorは、ClaudeやChatGPTなどのMCPクライアントから、チャットでFlootのフルスタックアプリを作成・管理できるサーバーです。プロジェクト、データベース、デバッグ、公開のツールを備え、作業には接続したClaudeまたはChatGPTの利用枠を使います。
主な機能
- 01アプリのプロジェクトとファイルの作成・編集
- 02Postgresの用意とSQLの実行
- 03アプリのプレビューと公開
- 04ログの確認とテストの実行
- 05画像アセットの生成とアップロード
- 06組み込みの設計・開発ガイドの参照
活用シーン
- 01チャットからアプリを構築
- 02認証やデータベース連携フォームの追加
- 03ログとテストを使ったエラー調査
- 04プロジェクトを公開して公開URLを取得
MCP 対応
`https://mcp.floot.com/mcp`で稼働するリモートMCPサーバーで、OAuth 2.0によりFlootアカウントへのアクセスを認可します。MCPクライアントにアプリの構築、編集、テスト、公開ツールを提供します。
設定
ローカルサーバーの設定はどのクライアントでも共通です。コピーしてクライアントの MCP 設定ファイルに貼り付けてください。
ツール
ローカルサーバーのツールはマシン上で起動して初めて取得できます。メンテナーはまだツール一覧を提供していません。
詳細
Floot MCP コネクター
Claude と ChatGPT からフルスタックの Floot アプリを構築できます。
実際のデータベース、認証、メール機能を備えたフルスタックアプリを作成、編集、公開できます。
AI チャットを離れる必要はありません。Floot のクレジットではなく、お使いの Claude または ChatGPT のサブスクリプションで利用できます。
🔗 サーバー URL
https://mcp.floot.com/mcp
ヒント
URL の末尾は
/mcpにしてください。ルートドメインでは接続できません。
Model Context Protocol (MCP) を介して接続します。これは、AI アシスタントがツールにアクセスできるようにするオープン標準です。デザインの相談から、そのまま公開アプリの作成に進めます。
⚠️ 接続する前に
重要
接続したクライアントは、お客様の Floot アカウントを使って操作します。 まずこちらをお読みください。
| 🔓 アカウント全体へのアクセス | 接続すると、クライアントは単一のプロジェクトだけでなく、お客様の Floot アカウント内のすべてのプロジェクトを読み取り、変更できます。 |
| 📊 Claude または ChatGPT の利用枠を使用 | 構築、編集、公開は Claude または ChatGPT のサブスクリプションの利用枠に含まれ、Floot のクレジットは使用しません。画像生成のみ、少量の Floot クレジットを使用します。 |
| 🌐 公開するとアプリが一般公開されます | 公開すると一般公開の URLが発行され、リンクを知っている人なら誰でもアクセスできます。 |
| 🔒 シークレット情報は Floot 上で保護されます | API キーと認証情報を入力するのはfloot.com のみです。AI に表示されることはありません。 |
✅ 前提条件
| 要件 | 詳細 |
|---|---|
| Floot アカウント | 無料・有料を問わず、どの Floot アカウントでも利用できます。 |
| Claude | カスタムコネクターの追加には、Pro、Max、Team、または Enterprise プランが必要です。 |
| ChatGPT | コネクター／開発者モードを利用できるプランが必要です。 |
🔌 接続
サーバー URL を貼り付けて、Floot をカスタムコネクターとして追加します。以下からお使いのクライアントを選んでください。
- Claude で 設定 → カスタマイズ → コネクターを開きます。 (カスタムコネクターの追加には、Pro、Max、Team、または Enterprise プランが必要です。)
- **＋**をクリックして、カスタムコネクターを追加を選択します。
- Floot サーバー URL
https://mcp.floot.com/mcpを貼り付けて、追加をクリックします。 - Claude がブラウザーウィンドウを開きます。Floot にサインインして接続を承認します。
- 任意のチャットで ＋ → コネクターをクリックし、Flootを有効にします。
メモ
Floot は OAuth 2.0 を使用するため、Floot の認証情報が Claude と共有されることはありません。
Team または Enterprise をご利用ですか？ 組織のオーナーが 組織の設定 → コネクター → 追加 → カスタム → Web から Floot を一度追加すると、各メンバーは接続をクリックするだけで利用できます。
- ChatGPT で 設定 → コネクター を開きます（プランで必要な場合は、開発者モードを有効にしてください）。
- 追加 / 作成 → **カスタムコネクター（MCP サーバー）**を選択します。
- Floot サーバーの URL
https://mcp.floot.com/mcpを貼り付け、確定します。 - ブラウザーウィンドウが開きます。接続を認証するために、Floot にサインインしてください（OAuth 2.0）。
- チャットで Floot コネクターを有効にして、作成を始めましょう。
メモ
Floot が Claude と ChatGPT のディレクトリに掲載されると、「Floot」と検索してワンクリックで追加できるようになります。URL は不要です。
その他の MCP クライアント（Cursor、VS Code、Windsurf、…）
Floot は標準的なリモート MCP サーバーであるため、MCP 対応クライアントであれば接続できます。現在、Claude と ChatGPT を公式にサポートしており、今後さらに多くのクライアントに対応する予定です。
Cursor では現在、mcp-remote ブリッジが必要です。OAuth コールバックで使用されるカスタム URI スキームが、まだサーバーで受け付けられないためです。ブリッジは代わりに http://localhost 経由で認証します。clients/cursor-mcp-remote.json を ~/.cursor/mcp.json（グローバル）または .cursor/mcp.json（プロジェクトごと）に追加してください。
{ "mcpServers": { "floot": { "command": "npx", "args": ["-y", "mcp-remote", "https://mcp.floot.com/mcp"] } } }
ネイティブのリモート OAuth がすべての環境でサポートされるようになると、clients/cursor.json の直接設定と、以下のワンクリックインストールを利用できるようになります。
その他のクライアント用の貼り付け可能な設定ファイルは、clients/ にあります。
| クライアント | 設定 |
|---|---|
| VS Code（GitHub Copilot） | clients/vscode.json → .vscode/mcp.json |
| Windsurf | clients/windsurf.json → ~/.codeium/windsurf/mcp_config.json |
| Claude Desktop（設定ファイルでの代替方法） | clients/claude-desktop.json → claude_desktop_config.json |
| 任意の MCP クライアント | clients/generic.json |
🧰 Floot でできること
接続すると、AI アシスタントが以下のツールを代わりに使用できます。
| 📁 プロジェクトとコード | プロジェクトの作成、ファイルの読み取りと編集、コードベースの検索、依存関係の管理ができます。 |
| 🗄️ データベース | Postgres のプロビジョニング、SQL の実行、スキーマの確認、アプリのデータのクエリができます。 |
| 🚀 プレビューと公開 | ライブプレビュー URL の取得、公開 URL への公開、公開ステータスの確認ができます。 |
| 🐞 デバッグと検証 | ログの読み取り、型チェックとテストの実行、ブラウザーでの実行中のアプリの確認ができます。 |
| 🖼️ アセット | 画像の生成や、プロジェクトへのファイルのアップロードができます。 |
| 📚 ガイド | 組み込みガイドで、より質の高い出力を実現するために、Floot のデザインシステムとプリミティブをアシスタントに教えます。 |
💬 これらのプロンプトを試す
データベースに回答を保存するフォームを備えた、**「Feedback Hub」**という Floot アプリを作成してください。
Floot プロジェクトにログインページを追加してください。
プロジェクトを公開して、ライブ URL を教えてください。
アプリで何かが失敗しています。ログを読み取って修正してください。
🛠️ トラブルシューティングとよくある質問
「接続中に問題が発生しました」と表示される
URL の末尾が /mcp になっていることを確認してください。完全なアドレスは https://mcp.floot.com/mcp です。ルートドメインでは正しく接続できません。
Floot のツールが表示されない
Floot へのサインインが完了していることと、現在のチャットでコネクターが有効になっていることを確認してください（Claude：+ → コネクター）。必要に応じて、コネクターを削除してから追加し直し、再認証してください。
Floot クレジットを消費しますか？
いいえ。AI による処理はお使いの Claude または ChatGPT のサブスクリプションで実行されるため、アプリの構築や編集に Floot クレジットは消費されません。例外は画像生成で、少量のクレジットを使用します。(無料アカウントの上限は現在も調整中です。)
どのクライアントに対応していますか？
Claude（macOS／Windows のデスクトップ版および claude.ai）と ChatGPT に対応しています。Cursor など、その他の MCP クライアントは上記のブリッジを介して接続できます。より幅広いネイティブ対応も準備中です。
安定していますか？
コネクターはベータ版です。改善を進める中で、ツール名、パラメーター、動作が変更される場合があります。
📖 MCP とは？
Model Context Protocol は、AI アプリが単一のインターフェースを通じて外部ツールやデータに接続できるようにするオープン標準です。Floot MCP 接続を使うと、チャットから直接フルスタックアプリをひな形から作成し、構築、ホストするためのツールをアシスタントに提供できます。
📁 リポジトリの構成
clients/ Ready-to-paste config for MCP clients
mcp.json Generic MCP server definition
.cursor-plugin/plugin.json Cursor Marketplace plugin manifest
assets/logo.svg Logo
コメント
AI アプリケーションが外部のツールやデータソースに統一的な方法で接続するためのオープンなプロトコルです。クライアントはモデルとの対話を担い、MCP サーバーはツール・リソース・プロンプトテンプレートを提供します。標準メッセージでやり取りするため、1 つのサーバーを複数のクライアントで再利用できます。