Skip to content

Guides

Host an app made with Claude, with a database and login

Keep building in Claude, then give the app a web address, saved data and Google sign-in through Tofu. You do not need to open a hosting account, a Supabase account or a Google Cloud project.

Updated

The short answer

Add the Tofu connector to Claude and ask Claude to send the app it wrote to Tofu with a managed database. If the files are on your computer, connect a coding agent to Tofu and send the app’s folder instead. Tofu checks and builds the app, connects its database, adds Google sign-in when you ask for it and gives it an address. You approve creating the database for that app before it is made.

The app still needs code that saves records and handles sign-in. Its Google button can use Tofu's sign-in service, which brings people back with a session in the app's own database. That route needs no Google Cloud setup from you.

What you need

  • A Tofu account. The Free plan and the paid plans are open to everyone. The pricing page shows its current allowances.
  • The complete app. Its source files, images and build settings, rather than just a screenshot or a shared artifact link.
  • A way to send those files. The Tofu connector in Claude for files the chat writes, or a coding agent on your computer for a folder. Any coding agent connected to Tofu can send it.

Step by step

  1. Prepare the app’s saved data and sign-in

    In the conversation where the app was written, describe what must survive a page reload and which records each person may see. Ask for a working Google button and access rules for private data, as well as the screens.

    For a React and Vite app, the Supabase client reads VITE_SUPABASE_URL and VITE_SUPABASE_ANON_KEY. Tofu supplies those settings. The app's table definitions and access rules belong in supabase/migrations. The Database page's setup steps say whether Tofu applies those files or the app needs its own migration step.

  2. Connect Tofu in Claude, or in your coding agent

    On claude.ai, open the add-connector dialog with Tofu filled in, or open Customize → Connectors and add a custom connector named Tofu at https://app.trytofu.ai/mcp. Select Connect, sign in on Tofu's page and approve. Turn Tofu on in the chat's tools menu. On a team plan, an owner may need to allow the connector for the organisation.

    If the app lives in a local folder, use the agent setup page instead. Open that folder in your coding agent and approve its Tofu connection. Neither path asks you to paste a hosting token into the conversation.

  3. Put the app online with its database

    Ask for the app to go online on Tofu with a managed database, and approve creating that database. Tofu checks the code and builds it. Database timing depends on the app's hosting: a supported server app can receive it with the first deployment; an eligible Vite app on shared static hosting receives it after the app first goes live and needs another build to use the connection.

    Claude can send up to 500 files totalling 1536 KB. An attachment in Claude is not a Tofu upload: use the files the chat writes, a local folder or a GitHub import. If the answer says the build is still running, ask for its status. A second deployment is a new attempt.

  4. Finish Google sign-in

    Ask for Google sign-in for this app. The Google button needs to use Tofu's sign-in entry point and read the returned session. Tofu can also configure the app's own sign-in service and its sign-in email after you approve. Google shows Tofu's name on its consent screen; the person's account belongs to your app.

  5. Try the app as a visitor

    Once Tofu reports the app live, open its address, sign in and save a record. Reload, sign out and return to confirm it remains. Use a second account to check that private records stay private. Then share the address or connect your own domain.

What the app gets

The app needsTofu suppliesThe app’s code supplies
A web addressHosting and HTTPS once the build is published.A complete web app with its build settings and assets.
Saved dataA managed Postgres database and its connection settings, within the plan’s allowance.Tables, access rules and code that reads and writes records.
Google sign-inThe Google connection and a session in the app’s own sign-in service.A Google button and handling for the session returned to the app.
Sign-in emailThe sending setup, under the app’s name, when configured.The sign-in screens and the confirmation route for emailed links.

What Tofu does not do

  • Turn a preview into complete code. A working screen can still use sample data or services that only exist inside Claude. Those parts need ordinary app code before they can work on another host.

  • Move an existing database automatically. Creating a Tofu database does not copy records, accounts or uploaded files from another service. Moving them is a separate job.

  • Infer private-data rules from the design. A sign-in button identifies a person. The app’s server and database rules decide which records that person can read or change.

  • Merge a partial upload. An update replaces the app’s complete code. A file left out of the upload is left out of that version; the database and saved settings are separate.

Questions

Can this use the Free plan?

The Free plan and the paid plans are open to everyone. The Free plan's one app can have its own database and Google sign-in. The app's Database and Sign-in pages show what is available for its hosting. See plans and allowances.

Do I need a coding agent on my computer?

No. The connector works in Claude chats. For local files, any coding agent connected to Tofu can send the app's folder. You can also import a GitHub repository in the dashboard.

Can a shared Claude artifact link be imported?

A shared artifact link is not the app's source files. The artifact guide explains how to get a complete app and replace any features that depend on the original platform.

Why is the new database empty?

The app's own setup files create its tables. Check Setup steps on the Database page. Where Tofu applies migrations, they run before the build; elsewhere the app's build or your computer applies them. An empty database is not a copy of the data used in a preview.

Can Claude keep changing it later?

Yes. Send the complete updated app to the same Tofu app, preserving its address, settings and database. For code kept in GitHub, automatic updates can follow one branch. Restoring an earlier version changes the published code, not the database.