# Floot — full documentation > Floot turns a plain-language description into a real, deployed full-stack app — React + TypeScript frontend, serverless TypeScript endpoints, Postgres database, authentication, file storage, and email — hosted on Floot's infrastructure with a live URL. You can build in Floot's own editor, or from Claude and ChatGPT/Codex through Floot's remote MCP server. Floot is a remote MCP (Model Context Protocol) server as well as a web app. An MCP client can create, edit, run, and publish a complete Floot project without a browser. - MCP endpoint: https://mcp.floot.com/mcp (streamable HTTP, OAuth) - Registry name: com.floot/floot in the official MCP registry - One-click connect in Claude: https://claude.ai/directory/connectors/floot-mcp-updated - One-click install in ChatGPT: https://chatgpt.com/plugins/plugin_asdk_app_6a500d350f8c819194e30335a7b134af - Discovery manifest: https://floot.com/.well-known/mcp.json When connected over MCP, the model does the reasoning and token spend happens on the client's side (Claude or ChatGPT), not in Floot credits — building this way is free on Floot. Image generation is the exception and uses a small number of Floot credits. What a Floot project is made of: page, component, helper, and endpoint files in TypeScript/React, plus static assets. Backends are serverless HTTP endpoints (GET/POST) with no filesystem or in-memory persistence between requests; persistent state goes in the provisioned Postgres database or object storage. Projects can also be published as native iOS and Android apps. This file is the complete contents of https://floot.com/docs (22 pages) as Markdown. The curated index is at https://floot.com/llms.txt. --- # Editor and preview > A tour of the Floot editor, how the live preview works, and how to publish. Source: https://floot.com/docs/getting-started/editor-and-preview This guide walks you through the Floot editor and how to preview your app before publishing it to the world. ## Editor overview ### Chat panel The main way to build your app. Describe what you want in your own language and Floot builds it. You can attach images, PDFs, CSVs, and other files to a message when it helps explain what you mean. Two tools at the top-left of the preview make your intent unmistakable: - **Select** — Click any element in the preview to point Floot at it — or edit its text directly. - **Annotate** — Take a screenshot of the preview and draw on it. Circling the problem is usually faster than describing it. ### Preview panel See your app update in real time as you make changes. This is a live preview of what your users will experience — the same code, just not published yet. ### Data, resources, and logs The right pane holds more than the preview. Open **Data** to browse your Postgres tables and run queries, and to download a `pg_dump` backup. Connected services (API keys, OAuth providers, databases) live under resources, and backend logs are available when something misbehaves — you can also just ask Floot to read the logs for you. ### Project settings Access project settings via the project name dropdown → **Project Settings**. - **Project name** — The name of your project. - **Project icon** — Used for the favicon and the mobile app icon. - **System prompt** — High-level context or standing instructions about the project. Keep it short — it is included with every change. - **Design prompt** — Design-specific instructions and brand direction. - **Project visibility** — Make the chat history and source code of your project public or private. All projects — including free ones — are private by default. ## Preview vs. publish | Mode | What it shows | Who can see it | | --- | --- | --- | | **Preview** | Latest changes in the editor | Only you and your collaborators | | **Published** | The live version of your app | Anyone with the published link | ### How to preview Your preview updates automatically as you chat with Floot. Toggle the mobile and fullscreen views with the top-right buttons to check the published experience on smaller screens. **Tips for previewing:** - Test all user flows — sign up, login, and your main features - Check different screen sizes with the mobile toggle or your browser dev tools - Verify that forms and buttons actually do what they should ### How to publish 1. **Click Publish** The **Publish** button lives in the top-right corner of the editor. 2. **Choose your domain** Use the free `*.floot.app` subdomain, or connect a custom domain. 3. **Go live** Click **Publish**. Your app is now accessible to anyone with the URL. > **Published means public:** Anyone with the link can open your published app. If you want to restrict access, ask Floot to add authentication to your app. ### Updating a published app After publishing, new changes appear in preview only. To update your live app, click **Publish** again. ## Common questions ### How do I know what my users will see? The preview panel shows exactly what users will see. If you have already published, visit your live URL to see the current public version. ### Can I undo changes? Yes. Use the restore button in the chat pane to revert to any previous version. You can also ask Floot to save a named checkpoint before a risky change, then restore to it by name later. ### Can I edit the code directly? Yes. Press `Cmd + P` (or `Ctrl + P` on Windows) in the editor and search for a file by name. Most people never need to — but the code is yours, and it is right there. --- # Plan, Discuss, and Build > Three ways to talk to Floot — think it through first, ask questions, or ship the change. Source: https://floot.com/docs/getting-started/chat-modes Not every message should write code. Floot has three modes, and picking the right one is the single easiest way to get better results. - [Plan](#plan-mode): Shape the idea before a single file is written. Floot asks questions, then writes a plan you can edit. - [Discuss](#discuss-mode): Ask questions about your project without changing it. Nothing is built until you turn Discuss off. - [Build](#build-mode): The default. Describe a change and Floot makes it, one focused step at a time. ## Plan mode Choose **Plan first** instead of Build when you start a new project and you want to think before you ship. Floot interviews you about the app — who it is for, what the core flows are, what can wait for version two — and then writes a plan into your project. The plan appears on the right as it is written. You can keep chatting to refine it: add a feature, cut a screen, change the data model. Nothing is built yet. When you are happy, click **Build Plan**. Floot switches into build mode and uses the plan as the blueprint for the initial build. > **Vague prompts route here automatically:** If you start with something broad like "build me a game", Floot may take you to planning on its own — a two-minute conversation up front saves a lot of rework. ## Discuss mode Toggle **Discuss** in the chat pane to ask questions without changing anything. Use it to: - Understand how something in your app currently works - Weigh two approaches before committing to one - Work out why a feature behaves the way it does - Sanity-check an idea that might be a big change Floot knows your project and its own capabilities far better than a general-purpose chatbot does. When you have settled on an approach, turn Discuss off and ask for the change. ## Build mode The default. Describe one change and Floot makes it. Keep each prompt to a single feature, change, or fix so you can verify it before moving on — see [Prompting tips](https://floot.com/docs/best-practices/prompting-tips). > **A rhythm that works:** Plan the app → build one feature → test it in the preview → build the next. Handle visual polish last, using the Annotate tool. --- # Prompting tips > How to write prompts that get you what you actually wanted. Source: https://floot.com/docs/best-practices/prompting-tips Floot is only as clear as your prompt. These four habits make the biggest difference. ## Include enough context Be specific and descriptive about what you want Floot to change. When something is broken, do not just say “it doesn't work” — describe what you did, what you expected to happen, and what actually happened. Use the **Select** or **Annotate** tool to point at the exact element you mean. For example, select a Submit button and say: ``` When I click the Submit button, a dialog should open, but nothing happens. ``` That works far better than “that button doesn't work”. ## Keep it focused Ask for **one thing** per prompt. Bundling several changes together means you cannot verify any of them cleanly, and if something goes wrong you have to untangle which change caused it. > **One feature, one fix, one prompt:** Build it, check it in the preview, then move on to the next thing. ## Don't use AI to write your prompts Pasting a prompt written by ChatGPT or another AI usually backfires. Those prompts tend to be verbose and full of invented technical details that pull Floot in the wrong direction. Write it yourself, in your own words. Use another AI to brainstorm or research if it helps — just **avoid copying and pasting** the result. Better still, turn on [Discuss mode](https://floot.com/docs/getting-started/chat-modes) and hash out the details with Floot directly. Floot knows your project and its own capabilities; an outside chatbot knows neither. ## Describe outcomes, not implementations Say what the app should do for the person using it. Naming specific libraries, frameworks, or database tricks usually constrains Floot for no benefit — it already knows the stack it is building on. --- # Building tips > Working habits that keep a Floot project moving. Source: https://floot.com/docs/best-practices/building-tips Short answers to the questions people ask most often when they are starting out. ## How do I write a good initial prompt? Focus on core features and functionality. Do **not** mention specific technologies or programming languages — Floot picks the stack. Keep it concise; you will add detail as you go. If the idea is still fuzzy, use [Plan mode](https://floot.com/docs/getting-started/chat-modes) instead of trying to write the perfect prompt. ## Any general build tips? - Use **Discuss** mode for planning; turn it off when you want to actually build - Feed Floot smaller, focused prompts rather than one giant brief - **Test a lot** — after each change, click through the flow in the preview - Handle UI polish last, and use the **Annotate** tool for visual changes - Ask for a named checkpoint before a risky change so you can jump back ## Should I try Floot before committing? Yes. Use your free credits to see how far you get — and reach out if you get stuck. Free accounts can keep up to 2 projects with 1 published app; upgrade when you need more. ## Will Floot perfectly match a complex design? Not always. For the best results, attach design images and detailed notes about what should change. Iterating on one screen at a time beats asking for a whole redesign in a single prompt. ## What if Floot keeps going in circles? If the same error survives three attempts, stop and change the approach — restore to an earlier checkpoint, or switch to Discuss mode and work out what is really going on. See [Troubleshooting](https://floot.com/docs/faqs/troubleshooting-and-support-flow). --- # What's built in > The services every Floot app gets for free — database, auth, AI, storage, email, realtime, and jobs. Source: https://floot.com/docs/integrations/whats-built-in A lot of what you would normally wire up yourself is already part of every Floot project. Ask for the feature and Floot uses the built-in service — no accounts, no API keys, no setup. | Service | What it gives you | | --- | --- | | **Floot Database** | A managed Postgres database. Browse tables and run queries from the Data tab, or download a `pg_dump` any time. | | **Authentication** | Sign-up, login, and sessions out of the box. Add Google, Apple, Microsoft, or any custom OAuth provider on top. | | **Floot AI** | Text generation, image generation, and embeddings with no provider account. Billed in Floot credits — or bring your own key if you prefer. | | **Floot Storage** | File uploads and downloads for your users — documents, photos, contracts — served from Floot's CDN. | | **Email** | Send transactional email from your app, and receive email into it, without signing up for a mail provider. | | **Floot Realtime** | Live updates over WebSockets — presence, collaborative screens, dashboards that move on their own. | | **Scheduled jobs** | Run backend work on a cron schedule: nightly cleanups, weekly digests, morning reports. | | **Background jobs** | Kick off work that outlives the request — fan-out, delayed jobs, and schedules your app creates at runtime. | | **Push notifications** | Send notifications to your users' phones and browsers. | | **Analytics** | Built-in visitor tracking: page views, traffic sources, and trends. | | **Hosting & CDN** | Globally distributed hosting with automatic SSL and scaling. See [Reliability and limits](https://floot.com/docs/platform/reliability-and-limits). | > **You don't have to choose these by name:** Describe the outcome — "let users upload a profile photo", "email me when someone books" — and Floot reaches for the right service. ## Agents and chatbots Floot can build conversational agents into your app: a support bot, an assistant that uses your data, or a background agent that works on a schedule. Conversation history, tool calling, memory, and streaming responses are all handled for you — just describe what the agent should be able to do. ## Bringing your own services Built-in does not mean locked in. If you already use Stripe, Twilio, Resend, Mapbox, an external Postgres database, or your own AI provider key, Floot connects to those instead. Browse the full directory on the [integrations page](https://floot.com/integrations). --- # Connecting external services > How Floot apps talk to third-party APIs, webhooks, and email providers. Source: https://floot.com/docs/integrations/overview Floot apps can connect to almost any external service over its API. This page covers how that works, and where the edges are. ## API integrations Describe the integration you want and Floot builds it. **Works best with:** - Well-documented APIs - APIs with clear authentication (API keys, OAuth) - Established APIs that have been around a while **For newer or niche APIs:** if the documentation is online, Floot can research it. Otherwise, paste the relevant docs into the chat so Floot can learn the endpoints and data shapes. > **Never paste API keys into the chat:** Floot opens a secure dialog to collect keys and secrets. They are stored encrypted, injected into your backend at runtime, and never shown to the AI. ### Example ``` Implement the product checkout flow using Stripe. ``` Floot will: 1. Set up the API connection 2. Ask for your API key in a secure dialog and store it safely 3. Build the endpoints and screens your app needs ## Webhooks Webhooks let external services push data into your Floot app when something happens — a payment succeeds, a form is submitted, a delivery status changes. 1. **Ask Floot for an endpoint** ``` Create a webhook endpoint that handles payment events. ``` 2. **Publish your app** The webhook URL is a real, public URL on your published app. 3. **Register the URL with the service** Paste it into the external service's webhook settings and send a test event. ## Email Floot apps can send and receive email with no third-party account — see [What's built in](https://floot.com/docs/integrations/whats-built-in). If you would rather use your own provider, Floot integrates with Resend, SendGrid, Mailgun, Postmark, Amazon SES, and Mailchimp: ``` Set up SendGrid to send welcome emails when users sign up. ``` ## Things to know Floot backends are serverless, which shapes a few design decisions: - **No local filesystem or in-memory state** — Anything that has to survive between requests belongs in the database or in Floot Storage — not on disk or in a variable. - **No always-on custom server process** — Long-running or recurring work runs as a scheduled or background job instead of a daemon you keep alive. - **Heavy scraping belongs elsewhere** — For large-scale web scraping, use a dedicated service such as ScrapingBee and have your app call it. > **Background work and realtime are supported:** Scheduled jobs, background jobs, and WebSocket-based realtime used to be gaps. They are all built in now — see [What's built in](https://floot.com/docs/integrations/whats-built-in). --- # Build from Claude & ChatGPT > Connect Floot to your AI chat over MCP and build full-stack apps without leaving it. Source: https://floot.com/docs/integrations/build-from-claude-and-chatgpt The Floot connector lets Claude, ChatGPT, Codex, and other MCP clients create, edit, debug, and publish your Floot apps directly from the chat you already use. It runs on your existing Claude or ChatGPT subscription rather than Floot credits — the AI does the thinking, Floot provides the database, authentication, hosting, and everything else. ## Connecting 1. **Claude** Add Floot in one click from the [Claude connector directory](https://claude.ai/directory/connectors/floot-mcp-updated), then sign in to Floot when prompted — no URL to copy. On Team or Enterprise, an organization Owner enables it once and each member clicks **Connect**. 2. **ChatGPT and Codex** Install Floot in one click from the ChatGPT app directory — no URL to copy. Once installed in ChatGPT it is available in Codex too, since they share one account. 3. **Any other MCP client** Cursor, VS Code, Zed, CLIs — anything that supports remote MCP servers over Streamable HTTP works. Add the Floot server URL and authorize with OAuth. Full setup instructions, the server URL, and a client picker live on the [connector page](https://floot.com/integrations/mcp). ## Before you connect A connected client acts with your Floot account. Four things to know: - **It can reach all your projects** — The connector can read and edit any project in your account. - **It runs on your Claude or ChatGPT usage** — Building through the connector does not consume Floot credits. Image generation is the exception and uses a small number of credits. - **Publishing is public** — Anyone with the live link can open your published app. - **Credentials stay on Floot** — API keys you add stay on Floot and are never shown to the AI. ## Prompts to try Replace `xxx` with your project's name. On Claude, mention **with Floot**; on ChatGPT, add Floot from the **+** menu or type **@Floot**. - Build me a working feedback hub with Floot — a form that saves responses to a database and a page to browse them - Show a preview of my Floot project xxx - Add a login page to my Floot project xxx - Publish my Floot project xxx and give me the live URL - Something's failing in my Floot project xxx — read the logs and fix it > **Pick a capable model:** The connector is only as good as the model driving it. Use your client's strongest available model for building work. --- # Reliability and limits > The infrastructure behind your published app, and the limits that apply to it. Source: https://floot.com/docs/platform/reliability-and-limits Floot is built for production apps. Your site runs on the same AWS infrastructure that powers enterprise software — with no DevOps required from you. ## What's included with every app | Feature | Description | | --- | --- | | **Database** | Managed Postgres for your app's data | | **Backend** | Highly scalable serverless backend on AWS Lambda | | **Authentication** | User sign-up, login, and session management | | **Hosting** | Globally distributed content delivery built on AWS CloudFront | | **File storage** | CDN-backed storage for user uploads and assets | | **Email** | Send and receive email from your app | | **Realtime** | WebSocket-based live updates and presence | | **Jobs** | Scheduled cron jobs and background work | | **Custom domains** | Connect your own domain on a paid plan | | **Security** | Encrypted data in transit and at rest — see [Security and data](https://floot.com/docs/platform/security-and-data) | ## Hosting infrastructure - Automatic scaling based on traffic — no capacity planning - Global CDN for fast load times worldwide - SSL certificates (HTTPS) issued and renewed automatically ## Uptime and reliability Floot aims for high availability on all published apps. Since founding, sites hosted on Floot have not been disrupted other than during the [October 2025 AWS outage](https://www.thousandeyes.com/blog/aws-outage-analysis-october-20-2025). If you experience downtime or performance issues, reach out via the support chat and we will respond quickly. ## Usage limits Every paid plan includes a monthly hosting allowance that covers most apps comfortably. Usage beyond the allowance is billed pay-as-you-go — see [Hosting](https://floot.com/docs/faqs/hosting). Free accounts can keep up to 2 projects and 1 published app on a free `*.floot.app` subdomain. Extra projects, extra published apps, and custom domains all need a paid plan. > **Runaway traffic gets throttled, then a phone call:** If unusual traffic patterns show up — usually a bug or an infinite loop rather than real users — we throttle temporarily to protect your site and contact you right away to sort it out. ## Monitoring your usage Track credits on the [billing dashboard](https://floot.com/dashboard/billing) and traffic on the [hosting dashboard](https://floot.com/dashboard/hosting). You can also just ask Floot about your hosting usage — it can read the numbers and suggest ways to bring them down. --- # Security and data > How Floot handles your code, your data, and your users' data. Source: https://floot.com/docs/platform/security-and-data This page covers data ownership, the security measures behind the platform, and who can see what. ## Data ownership **You own 100% of your app:** - **Code** — Complete code ownership. - **Data** — All app data belongs to you. - **IP** — Full intellectual property rights. You can export your database at any time, and code download is included on every paid plan — see [Code, data, and exports](https://floot.com/docs/faqs/code-data-and-exports), or [Self-hosting](https://floot.com/docs/projects/self-hosting) if you want to run the app yourself. ## Security measures - **Encrypted in transit** — All traffic is served over HTTPS/TLS. - **Encrypted at rest** — Stored data is encrypted on disk. - **Secret handling** — API keys and secrets are collected through a secure dialog, stored encrypted, and never shown to the AI or included in chat history. - **Access controls** — Role-based access to internal systems. ## Privacy and visibility ### Your projects | Setting | Who can see it | | --- | --- | | **Private** (default) | Only you, your collaborators, and authorized Floot staff for support | | **Public** | Anyone — and other users can remix it | For a private project: - Code and prompts are not visible to other users - It cannot be remixed by anyone else - Access is limited to you, your collaborators, and Floot staff as needed for support > **Project visibility is not app visibility:** Making a project public exposes its source and chat history — it does not change your published app's URL. A published app is reachable by anyone with the link either way, unless your app requires login. ### Your app's user data Data your app collects — accounts, form submissions, uploads — is: - Stored securely in your app's database and file storage - Accessible to you, and to the Floot AI agent when your prompts require it - Your responsibility to handle in line with applicable law ## Handling sensitive data If your app handles healthcare, financial, or otherwise regulated data: 1. Consult legal counsel about your compliance requirements 2. Contact Floot to discuss your specific needs before you launch --- # Sharing your projects > Collaborators, handing a project to another account, and making a project public. Source: https://floot.com/docs/projects/sharing-your-projects There are three ways to share a Floot project: add collaborators, send the project to another account, or make it public. ## Add collaborators Invite others to view or edit your project while you keep ownership. 1. **Open the project menu** Click the **project name dropdown** in the top-right of the editor. 2. **Select Collaborators** Enter the email address of the person you want to invite. They must already have a Floot account. 3. **They're in** Access is granted right away — Floot does not send an email invitation, so tell them yourself. ### What to know - Collaborators get full read/write access. They can chat with Floot, and it consumes **your** credits as the owner. - You can remove a collaborator at any time in the same dialog, which revokes their access immediately. - Only one person can make changes at a time. Others need to refresh the page to see new changes. ## Send project to another account Copy a project to a different Floot account. ### When to use it - Handing a finished project off to a client - Moving a project to a team or company account - Consolidating projects under one account ### How it works 1. **Open Send project** Click the **project name dropdown** in the top-right, then **Send project**. 2. **Enter the destination email** The recipient does not need a Floot account until they accept. Optionally add a message, or charge them credits for the project. 3. **They accept or decline** Floot emails a link. If they accept, they receive a full copy — code, database, and resources — but **not** your API keys, which they will set up themselves. 4. **Credits change hands** If you set a credit charge, the recipient pays it and you receive that amount minus 5,000 credits. > **You keep your copy:** Sending a project copies it. Your original project stays in your account, untouched. ## Make a project public Let anyone view your project's chat history and source code, and let other Floot users remix it. 1. **Open Project Settings** Click the **project name dropdown** in the top-right, then **Project Settings**. 2. **Switch visibility to Public** Change **Project visibility** to **Public**. You can switch it back at any time. ### What happens - Anyone can view your chat history and source code - Other Floot users can remix your project as a starting point - Your published app URL is unchanged — this affects the project, not the live app - You keep full ownership and can go private again whenever you want ### When to use it - Sharing a template or example with the community - Open-source work you want others to learn from - Showcasing a build in your portfolio ## Which option should I choose? | Scenario | Recommended option | | --- | --- | | Working together on a project | Add collaborators | | Client needs to watch progress | Add collaborators | | Handing a finished project to a client | Send project | | Moving a project to another account you own | Send project | | Sharing a template with the community | Make public | | Open-source or portfolio project | Make public | > **Private by default:** All projects — including free ones — are private until you change the setting. See [Security and data](https://floot.com/docs/platform/security-and-data). --- # How to add a custom domain > Point your own domain at your Floot app, step by step, including the DNS gotchas. Source: https://floot.com/docs/custom-domains/how-to-add-custom-domain Connect a domain like `yourapp.com` to your Floot app to give it a professional, branded URL. 1. **Add your domain in Floot** 1. Click the **Publish** button in the top-right of the editor 2. Click **Add Custom Domain** 3. Enter your domain name (for example, `yourapp.com`) 2. **Add the DNS records to your domain** Floot shows you the exact DNS records to add. They are generated for your project — there are no generic values to copy from a guide. > **Add ALL the records shown:** Every record Floot lists is required. Skipping one is the most common reason a domain never verifies. **Where to add them:** - Log into your DNS provider (Namecheap, GoDaddy, Cloudflare, and so on) - Go to DNS settings and add the records exactly as shown in Floot **Important notes:** - On **Cloudflare**, turn the proxy **off** (grey cloud, not orange) for these records - Copy values exactly — they are case-sensitive - If a record already exists and blocks the new one, delete the old record first - Delete all other `A` records on the "@" root before adding the one from Floot 3. **Continue in Floot — do not skip this** 1. After adding the DNS records, click **Continue** in Floot 2. Floot verifies your DNS is correct — this can take up to 15 minutes 3. Once verified, the domain is attached to your app 4. **Your domain is live** - Your app is served from your custom domain - Both `yourapp.com` and `www.yourapp.com` work - HTTPS is set up automatically > **DNS propagation takes time:** It can take up to 24 hours for your domain to resolve everywhere, though it is usually much faster. That is normal and depends on your DNS provider. If it takes longer, contact support. > **Custom domains need a paid plan:** The free `*.floot.app` subdomain works on any plan; connecting your own domain requires a paid one. --- # Self-hosting > Export your code and database and run your Floot app on your own infrastructure. Source: https://floot.com/docs/projects/self-hosting You own 100% of your Floot app's code and data. If you want to host it yourself, you can export everything and deploy it wherever you like — code download is included on every paid plan. ## When to self-host - You need to meet specific compliance or data residency requirements - You want full control over your infrastructure - You are migrating away from Floot - You need to run the app in an air-gapped environment ## What you can export | Asset | How to export | | --- | --- | | **Code** | Project name dropdown → **Get Code** (included on paid plans) | | **Database** | Right pane → Data → Floot database → cog icon → download `pg_dump` | ## How to self-host 1. **Export your code** Open your project, click the **project name dropdown**, choose **Get Code**, and download the zip containing your full source. Code download comes with every paid plan — if you are on the free plan, upgrading unlocks it. 2. **Export your database** In the right pane click **Data**, select **Floot database**, click the **cog icon**, and download the `pg_dump` file. 3. **Set up your own database** Restore the `pg_dump` into a PostgreSQL database you control, then note its connection string. Managed options like Supabase, Neon, AWS RDS, or Railway all work. 4. **Configure environment variables** The exported code includes an `env.json` file. For security it is not pre-populated — you supply the values. **JWT secrets** — generate one with: ```bash node -e "console.log(require('crypto').randomBytes(32).toString('hex'))" ``` **Database connection** — fill in your own PostgreSQL connection string. Floot's database is not reachable from self-hosted environments. **External services** — paste in the API keys for any third-party services your app uses. 5. **Build and run** The export is a Node.js application: ```bash npm install -g pnpm pnpm install pnpm vite build pnpm tsx server.ts ``` Adjust freely to fit your own framework or deployment target. ## Floot-managed services Some built-in services are tied to Floot's infrastructure and **will not work** once you self-host. If your app uses any of them, migrate before or after exporting — you can ask Floot to do the migration for you while the project is still on Floot. | Service | What to do instead | | --- | --- | | **Floot OAuth** | Configure your own auth provider | | **Floot Storage** | Migrate to an object storage provider like Cloudflare R2, S3, or Cloudinary | | **Floot AI** | Use your own API key with the AI provider of your choice | | **Floot Realtime** | Use a pub/sub service (Pusher, Ably, Redis pub/sub) or drop the feature | | **Floot Email** | Point the app at your own provider — Resend, SendGrid, Postmark, SES | | **Scheduled & background jobs** | Run them with your platform's scheduler (cron, EventBridge, a queue worker) | ## Things to consider - **API keys** — You will need to set up your own keys for every third-party service. - **Updates** — Self-hosted apps do not receive updates from Floot. Maintaining the code is on you. - **Support** — Floot support covers the Floot platform, not self-hosted deployments. --- # Creating mobile apps > Turn your Floot project into real iOS and Android apps you can install and ship. Source: https://floot.com/docs/mobile-apps/creating-mobile-apps-in-floot Floot converts your project into native iOS and Android apps — the same app you built, wrapped so it can be installed from a device, submitted to the App Store, or published on Google Play. > **Requires the top-tier plan:** Mobile app builds are available on Floot's highest plan (Power, or a legacy 100k plan). See [pricing](https://floot.com/pricing). ## How it works 1. **Build your app as usual** Everything you build for the web comes along. Floot detects features that need native permissions — camera, location, notifications — and wires up the right entitlements automatically. 2. **Enable mobile builds** Click **Publish**, switch to the **Mobile** tab, turn on **Build mobile apps**, and click **Publish & Generate**. This takes several minutes. 3. **Install or submit** Android installs straight from a QR code or download link. iOS goes through Xcode on a Mac. Both can be submitted to their app stores. ## Platform guides - [Installing your iOS app](https://floot.com/docs/mobile-apps/installing-ios-app): Download the project, open it in Xcode, run on a simulator or iPhone, and submit to the App Store. - [Installing your Android app](https://floot.com/docs/mobile-apps/installing-android-app): Scan a QR code to install the APK, or build a signed release for Google Play. - [Add to the home screen](https://floot.com/docs/mobile-apps/add-project-to-home-screen): No app store needed — put your published project on a phone's home screen in three taps. > **Store submissions are yours to make:** Floot does not submit apps or handle store reviews. You need your own Apple Developer and Google Play accounts, and any publishing support comes from them. --- # Installing your iOS app > Run your Floot app on the iOS Simulator or a real iPhone, and publish it to the App Store. Source: https://floot.com/docs/mobile-apps/installing-ios-app Floot can convert your project into a native iOS app. Here is how to get it running on your iPhone or the simulator. ## Prerequisites - A Mac running macOS - Xcode installed — free from the [Mac App Store](https://apps.apple.com/us/app/xcode/id497799835) ## Getting your iOS app 1. **Generate the mobile apps** 1. Open your Floot project and click the **Publish** button 2. Switch to the **Mobile** tab 3. Make sure **Build mobile apps** is enabled 4. Click **Publish & Generate** 2. **Download the iOS project** 1. In the Mobile tab, select **iOS** 2. Click **Download** 3. Unzip the downloaded file 3. **Install Node.js dependencies** Install Node.js if you do not have it, then run this in the unzipped folder: ```bash npm install -g pnpm pnpm install ``` 4. **Install Homebrew** Skip this if you already have it. ```bash /bin/bash -c "$(curl -fsSL https://raw.githubusercontent.com/Homebrew/install/HEAD/install.sh)" ``` 5. **Install CocoaPods** ```bash brew install cocoapods ``` 6. **Install the native dependencies** ```bash cd ios/App pod install --repo-update ``` 7. **Open the project in Xcode** 1. Navigate to the unzipped folder 2. Go to `ios/App` 3. Double-click `App.xcworkspace` to open it in Xcode > **Open the workspace, not the project:** `App.xcworkspace` is the one you want — `App.xcodeproj` will not have the CocoaPods dependencies. ## Running in the iOS Simulator 1. At the top of Xcode, find the device selector dropdown next to the app name 2. Select a simulator device (for example, "iPhone 17 Pro") 3. Click the **▶ Play** button, or press `Cmd + R`, to build and run 4. The simulator launches with your app running ## Installing on a real iPhone 1. Connect your iPhone to your Mac via USB 2. Select your iPhone from the device dropdown in Xcode 3. Configure code signing — this requires an Apple Developer account 4. Click **▶ Play** to install and run on your device After making changes in Floot, download the project again and click **▶ Play** to refresh the installed app. ## Troubleshooting - **"No provisioning profiles found"** — This happens when running on a physical device. Set up code signing in Xcode under **Signing & Capabilities**. - **"Build failed" errors** — Clean the build folder — **Product → Clean Build Folder**, or `Cmd + Shift + K` — then build again. - **Simulator not appearing** — Make sure iOS simulators are installed. In Xcode, go to **Settings → Components** to download them. ## Publishing to the App Store 1. **Create an Apple Developer account** Enroll in the Apple Developer Program ($99 per year). 2. **Confirm the app installs on your iPhone** Follow the steps above first — if it will not install on your own device, it will not pass review either. 3. **Add push notification capability, if you use it** 1. Click the App target in the left pane 2. Click **App** under TARGETS 3. Open the **Signing & Capabilities** tab 4. Click **+ Capability** 5. Search for "Push Notifications" and add it 4. **Upload to App Store Connect** Go to **Product → Archive**, then click **Distribute app**. Head to [appstoreconnect.apple.com](https://appstoreconnect.apple.com) and fill in the required information to submit for review. For full detail, see [Apple's publishing guide](https://developer.apple.com/app-store/submitting/). ## Shipping an update 1. Make your changes in Floot and publish them 2. Download the updated iOS project (same steps as the initial setup) 3. Open it in Xcode, select your app target, and open the **General** tab 4. Increase **Build** by 1 (for example `1` → `2`) and update **Version** (for example `1.0.0` → `1.1.0`) 5. Archive and submit as above > **Floot does not handle store submissions:** You need your own Apple Developer account to publish, and Apple handles any review or publishing support. --- # Installing your Android app > Install your Floot app on an Android device, and publish it to the Google Play Store. Source: https://floot.com/docs/mobile-apps/installing-android-app Floot can convert your project into a native Android app. You can install it directly on your device — no developer tools required. ## Getting your Android app 1. **Generate the mobile apps** 1. Open your Floot project and click the **Publish** button 2. Switch to the **Mobile** tab 3. Make sure **Build mobile apps** is enabled 4. Click **Publish & Generate** This takes several minutes. 2. **Download it to your phone** In the Mobile tab, select **Android**. You have two options: **Option 1 — scan the QR code.** Point your Android camera at it and follow the prompt to download and install. **Option 2 — copy the link.** Click **Copy download link for Android**, open the link on your device, and install the APK. > **Unknown sources:** Android may ask you to allow installation from unknown sources. This is expected for an APK installed outside the Play Store. 3. **Install it** 1. Once downloaded, open the APK file 2. If prompted, enable "Install from unknown sources" for your browser 3. Tap **Install** 4. Your app is ready to use ## Troubleshooting - **How do I install the APK after downloading?** — Android usually offers to install it right away. If not, open your Files app and tap the APK you downloaded. - **"Can't install from this source"** — Go to **Settings → Security → Install unknown apps** and enable it for your browser or file manager. - **QR code not working** — Use "Copy download link" instead and paste the link into your Android browser. ## Publishing to the Google Play Store 1. **Create a Google Play Developer account** Sign up at the [Google Play Console](https://play.google.com/console) — a $25 one-time fee. 2. **Download the Android project** 1. Open your project and click **Publish** 2. Switch to the **Mobile** tab 3. In the Android section, expand **Want to publish to the Google Play Store?** 4. Click **Download Android project** 3. **Install dependencies** Install Node.js, then run this in the unzipped folder: ```bash npm install -g pnpm pnpm install ``` 4. **Generate a signed release build** - Navigate to the `android` folder - Follow the [Android signing guide](https://developer.android.com/studio/publish/app-signing) to create a keystore and sign your app - Build a release AAB with `./gradlew bundleRelease` 5. **Upload to the Play Console** - Create a new app in the console - Complete the store listing — description, screenshots, icon - Upload your signed AAB from `android/app/build/outputs/bundle/release/` - Complete the content rating questionnaire - Set pricing and distribution 6. **Submit for review** Google typically reviews apps within 1–3 days. For more detail see [Google's publishing guide](https://developer.android.com/studio/publish) and [Capacitor's Android documentation](https://capacitorjs.com/docs/android) — Floot uses Capacitor to build the native app. ## Shipping an update 1. Make your changes in Floot and publish them 2. Download the updated Android project 3. Open `android/build.gradle` 4. Increase `versionCode` by 1 (for example `1` → `2`) 5. Update `versionName` (for example `"1.0.0"` → `"1.1.0"`) 6. Rebuild, sign, and submit as above > **Floot does not handle store submissions:** You need your own Google Play developer account to publish, and Google handles any review or publishing support. --- # Add your project to the home screen > One-tap access to your published app — no app store, no downloads, works on any phone. Source: https://floot.com/docs/mobile-apps/add-project-to-home-screen Once your project is published, you or your users can add it straight to a phone or tablet home screen. No app store download required. If you have enabled **Instant Mobile App** in your project, it can even look and feel native — launching in its own window with no browser toolbar in sight. ![A Floot project shortcut sitting on an iPhone home screen](https://floot.com/_cdn/static/63413225-794c-4088-aca7-5eda2161913b-docs-iphone-app-home-screen.png) ## iPhone and iPad Safari is the only browser on iOS that can add a website to the home screen — Chrome and others do not offer the option. 1. **Tap the Share button in Safari** Open your published project URL in Safari, then tap the share icon — the square with an upward arrow — at the bottom of the screen. ![Tapping the share button in Safari](https://floot.com/_cdn/static/ff9276e7-a969-4984-8264-28aabdc59377-docs-ios-safari-share-button.png) *Tap the share button.* 2. **Choose "Add to Home Screen"** In the share sheet, scroll down and tap **Add to Home Screen**. If it is not there, scroll to the bottom and tap **Edit Actions** to enable it. ![The "Add to Home Screen" option in the iOS share sheet](https://floot.com/_cdn/static/c0adec5f-e2eb-4f76-bea4-10f513b1df93-docs-ios-add-to-home-screen.png) *Tap "Add to Home Screen."* 3. **Name the shortcut and confirm** Give it a name — or keep the default — then tap **Add** in the top-right corner. ![Editing the shortcut name before adding it](https://floot.com/_cdn/static/40fe2370-e022-49ca-97fb-d1f52b41e900-docs-ios-edit-name-and-add.png) *Edit the name and tap "Add."* Your project now sits on the home screen alongside regular apps. You can rearrange it or drop it into folders, though it will not show up in the App Library. > **With Instant Mobile App enabled:** The shortcut launches in its own standalone window — no browser toolbar or address bar — instead of opening as a Safari tab. ## Android Android is more flexible: several browsers support home screen shortcuts. Here are Chrome and Firefox. ### Google Chrome 1. **Open the browser menu** Navigate to your published project URL in Chrome, then tap the three-dot icon in the top-right corner. ![Tapping the menu icon in Chrome for Android](https://floot.com/_cdn/static/83ff2b83-4a14-4fdd-9ea9-a758fda0a348-docs-android-chrome-menu.png) *Tap the menu icon.* 2. **Choose "Add to Home Screen"** ![Selecting "Add to Home Screen" in the Chrome menu](https://floot.com/_cdn/static/b3d86614-88c4-4b1a-887d-ac31c210b5ab-docs-android-chrome-add-to-home.png) *Select "Add to Home Screen."* 3. **Name the shortcut and tap "Add"** ![Editing the shortcut name in Chrome](https://floot.com/_cdn/static/f012f019-ddfb-434f-a9ea-cdfbe3ac8b6f-docs-android-chrome-edit-name.png) *Edit the name and tap "Add."* 4. **Place it on your home screen** Your launcher shows a confirmation. Either drag the icon where you want it, or tap **Add to Home Screen** to place it automatically. ![Confirming placement on the Android home screen](https://floot.com/_cdn/static/1ff58493-94c1-404b-a335-0d7f88c055fc-docs-android-chrome-add-confirm.png) *Tap "Add to Home Screen."* ### Mozilla Firefox In Firefox, tap the three-dot menu, open the **More** section, then choose **Add to Home Screen**. !["Add to Home Screen" in Firefox for Android](https://floot.com/_cdn/static/c978a4b8-1d21-4524-b479-7e48bf7e7808-docs-android-firefox-add-to-home.png) *Tap "Add to Home Screen" in Firefox.* Just like Chrome, you can rearrange the shortcut or put it in a folder. It will not appear in the app drawer — only on the home screen. > **Chrome may offer to install instead:** With **Instant Mobile App** enabled, Chrome can prompt you to **Install** the app — it then runs in its own window and appears in the app drawer alongside your other apps. Firefox does not support this. > **Want a real native app instead?:** This is the lightweight option. For an app you can ship to the App Store or Google Play, see [Creating mobile apps](https://floot.com/docs/mobile-apps/creating-mobile-apps-in-floot). --- # Billing, credits, and plans > How credits work, what rolls over, and what happens when you upgrade. Source: https://floot.com/docs/faqs/billing-credits-and-plans Credits are how building in the Floot editor is metered. Here is how they behave. ## How can I see how many credits I've used? Refresh the [billing dashboard](https://floot.com/dashboard/billing) after sending a message to see the credits it consumed. ## Where can I see how many credits I have left? On the same [billing dashboard](https://floot.com/dashboard/billing). ## Do credits roll over? Yes — unused monthly credits roll over to the next month so you have more time to use them. - You have one month to use rolled-over credits. If your billing period was Oct 25 → Nov 25, those credits are usable until Dec 25. - Rollover credits are spent first, then your monthly quota, then bonus credits. - A paid plan is required to use rolled-over credits. Once your plan renews, rollover credits appear on your [billing page](https://floot.com/dashboard/billing). ## What happens if I run out and upgrade mid-month? You only pay the difference, and the extra credits land instantly. Upgrading from $25 to $50, for example, adds 25,000 credits right away. ## What are the limits on the free plan? Free accounts can keep up to **2 projects** and **1 published app**, on a free `*.floot.app` subdomain. Existing projects are never taken away — you just cannot add more until you upgrade or free up a slot. Custom domains require a paid plan. ## Do I need credits to build from Claude or ChatGPT? No. Building through the [MCP connector](https://floot.com/docs/integrations/build-from-claude-and-chatgpt) runs on your Claude or ChatGPT subscription, not Floot credits. Image generation is the one exception and uses a small number of credits. ## Do you give free credits for referrals or social posts? Yes — see the [referrals page](https://floot.com/dashboard/referrals). --- # Hosting > How hosting is billed, where to watch usage, and how to take a site down. Source: https://floot.com/docs/faqs/hosting ## How does hosting billing work? Hosting is billed pay-as-you-go based on usage. Every paid plan includes a monthly hosting allowance covered by your subscription — you are only charged for usage beyond it. The allowance is larger on higher plans. ## Where can I see my hosting usage? On the [hosting dashboard](https://floot.com/dashboard/hosting). You can also ask Floot about your hosting usage in the chat — it can read the numbers and suggest ways to bring costs down. ## What drives hosting costs up? - Large images and video served on every page load - Polling loops that hit your backend far more often than they need to - Runaway client-side effects that fire requests in a tight loop If something unusual shows up, Floot throttles temporarily to protect your site and gets in touch — see [Reliability and limits](https://floot.com/docs/platform/reliability-and-limits). ## How do I unpublish my site? Top-right **Publish** → cog icon on the domain → **Delete domain**. --- # Code, data, and exports > Getting your code and database out of Floot — and what cannot come in. Source: https://floot.com/docs/faqs/code-data-and-exports ## How do I download or export my code? Project name dropdown → **Get Code**. The download includes instructions for running it, and comes with every paid plan. If you plan to host it yourself, read [Self-hosting](https://floot.com/docs/projects/self-hosting) first. ## Can I import an existing codebase into Floot? No. Floot does not handle arbitrary existing codebases well, and rebuilding from scratch gives much better results. You can absolutely bring your data, designs, and content across. ## Can I export my database? Yes. Right pane → **Data** → **Floot database** → **cog icon** → download a `pg_dump`. ## Can you send me a full database export? Yes — we can provide a `pg_dump` on request, though the cog icon above is faster and available any time. ## Do I own the code? Completely — code, data, and IP. See [Security and data](https://floot.com/docs/platform/security-and-data). --- # APIs, scraping, and mobile > Quick answers on external APIs, web scraping, and native apps. Source: https://floot.com/docs/faqs/apis-scraping-and-mobile ## Do you support APIs? Yes — especially well-documented ones. For newer or niche APIs, paste the documentation into the chat so Floot can learn the endpoints. See [Connecting external services](https://floot.com/docs/integrations/overview). ## How should I do web scraping with Floot? Use a dedicated scraping service such as ScrapingBee and have your Floot app call it. Running scrapers directly from a serverless backend is fragile and gets blocked quickly. ## Can Floot build native mobile apps? Yes. Floot builds real iOS and Android apps from your project — installable on a device and submittable to the App Store and Google Play. This is available on the top-tier plan; see [Creating mobile apps](https://floot.com/docs/mobile-apps/creating-mobile-apps-in-floot). If you just want one-tap access without an app store, [add the project to a home screen](https://floot.com/docs/mobile-apps/add-project-to-home-screen) instead. ## Can my app run background work or realtime updates? Yes to both. Scheduled cron jobs, background jobs, and WebSocket-based realtime are all built in — see [What's built in](https://floot.com/docs/integrations/whats-built-in). --- # Troubleshooting and support > What to try first, what to send us, and when to stop and ask. Source: https://floot.com/docs/faqs/troubleshooting-and-support-flow Most issues resolve faster with a bit of context. Here is what helps. ## What details do you need to investigate an issue? Share the full details of what you are seeing and your project link with live chat support. What you did, what you expected, and what actually happened covers most of it. ## Can I send a screenshot to help debug? Yes — and better still, use the **Annotate** tool inside your project to circle the problem area. That gives Floot the screenshot and the context together. Screenshots in live chat are helpful too. ## What if the AI keeps looping on the same error? Stop after three attempts and change the approach rather than trying a fourth time: 1. Restore to a checkpoint from before the change went sideways 2. Switch to [Discuss mode](https://floot.com/docs/getting-started/chat-modes) and work out what is actually happening 3. Ask Floot to read the backend logs before suggesting another fix 4. Contact support with your project URL > **About looping credits:** We typically do not refund credits spent on a loop, but we will step in and investigate. Include your project URL when you reach out. ## My published app looks different from the preview Preview shows your latest changes; the published app shows the last version you published. Click **Publish** again to push your changes live — see [Editor and preview](https://floot.com/docs/getting-started/editor-and-preview). --- # Community and links > Where to find the Floot community, updates, and support. Source: https://floot.com/docs/community/links Come build with other people who are building on Floot. - [Discord](https://discord.gg/sUFNJ3FW8G): The fastest place to get an answer from other builders and the Floot team. - [LinkedIn](https://www.linkedin.com/company/floothq/): Company updates and what we are shipping. - [X / Twitter](https://x.com/floothq): Follow @floothq for releases and build highlights. - [Gallery](https://floot.com/showcase): Real apps built on Floot — remix any of them as a starting point. ## Getting support For anything account- or project-specific, live chat is the fastest route — click the support button in the bottom-right on [floot.com](https://floot.com). Have your project URL ready.