Skip to main content

Documentation Index

Fetch the complete documentation index at: https://help.teable.ai/llms.txt

Use this file to discover all available pages before exploring further.

Available on all Cloud plans; Self-Hosted requires Business or higher.
Teable App Builder allows you to turn your data bases into fully functional, customized web applications without writing code. By combining the power of your data structure with AI-driven design, you can launch internal tools, customer portals, and data dashboards in minutes.

ā€‹
Overview

The App Builder follows a ā€œPrompt to Appā€ workflow. You describe what you want, and AI builds the application structure, pages, and logic for you. You can then fine-tune every detail using the visual editor or code.
When to use App Builder vs AI Chat: Use App Builder to create custom interfaces and standalone apps. For interactive data analysis and ad-hoc questions inside the database, use AI Chat.

ā€‹
Creating an App

There are two main ways to create an app:
  1. From Base: In any Base, click ā€œCreate Appā€ to generate an application linked to your current data.
  2. From Chat: Open AI Chat and say ā€œCreate a CRM app for this customer tableā€.

ā€‹
The App Editor Interface

The App Builder provides a dual-interface for both non-technical users and developers.

ā€‹
1. Chat Interface (AI-Driven)

The command center for your app.
  • Natural Language Editing: Describe changes like ā€œMake the header blueā€ or ā€œAdd a submission form for new recordsā€.
  • Auto-Routing: The AI understands which component or page you are referring to and modifies it directly.
  • Clear Conversation: If the current conversation has drifted, click Clear Chat in the bottom-right corner of the panel to start a new session. This clears the chat history for the current conversation but does not delete the app itself. The first use shows a confirmation, and you can choose not to show it again next time.

ā€‹
2. Live Preview Panel

  • Multi-Device Simulation: Use the switcher at the top to toggle Desktop, Tablet, and Mobile views.
  • Instant Feedback: Changes render immediately.

ā€‹
3. Developer Mode (Code Editor)

For infinite customization, you have direct access to the code.
  • Monaco Editor: A VS Code-like experience right in the browser.
  • React Components: Edit the underlying React code, Tailwind CSS classes, and logic.
  • File Tree: Navigate through the project structure.

ā€‹
Download Code

You can download the entire app as a ZIP archive at any time:
  1. Switch to the Code tab in the editor.
  2. Click the ... menu in the tab bar.
  3. Select Download code to save a ZIP archive that includes all source files.
If the app uses custom environment variables, the downloaded archive can include a root .env file. Review it before sharing the ZIP.

ā€‹
Import Code

You can update the appā€™s code by importing a ZIP:
  1. Switch to the Code tab in the editor.
  2. Click the ... menu in the tab bar.
  3. Select Import code and choose a ZIP file (ā‰¤ 5 MB) containing your source files.
  • Include source files only ā€” do not include node_modules, .next, or other build artifacts.
  • Zip the outermost project folder itself (right-click the folder ā†’ compress), not files selected from inside it.
  • Import merges with the existing project and overwrites any files that share the same path.
  • A root .env file in the ZIP is read into the appā€™s custom environment variables. Other .env* variants, such as .env.local, are ignored.

ā€‹
Publishing & Management

ā€‹
Publishing Your App

When your app is ready, click the Publish button (arrow icon) in the top right corner.
  • Public URL: Teable generates a secure, publicly accessible URL for your app.
  • Custom Domain: Map your own domain to the app.

ā€‹
Custom Domains

Use Custom domain to bind a domain to the published app. A subdomain is recommended, such as app.yourdomain.com. After you enter the domain, Teable shows the DNS records to add. Add the records with your DNS provider, wait for propagation, then verify the domain in Teable. You can also use an available subdomain under teable.app, such as your-name.teable.app.

ā€‹
Version History & Rollback

Teable automatically tracks every deployment.
  • Click the History (clock icon) button to view a list of all deployed versions.
  • One-Click Rollback: If a new update causes issues, you can instantly revert the live app to any previous stable version.

ā€‹
Auto-fix

If your custom code changes cause a build error, the deployment will fail.
  • Teable provides an Auto-fix button alongside the error log.
  • Clicking this lets AI analyze the compilation error and automatically patch the code to resolve the issue.

ā€‹
Deleting an App

To delete an app, click the Settings (gear icon) button in the header and select Delete.

ā€‹
Best Practices

For prompt patterns, build tips, rollback advice, and common troubleshooting, see App Builder Practical Guide.

ā€‹
Self-Hosted Configuration

If you are running Teable self-hosted, follow the setup on the AI Settings page.
That page is the source of truth for AI Chat Runtime, Vercel deployment settings, public access testing, and the related troubleshooting notes for App Builder. Before publishing, make sure both your Teable instance and object storage (MinIO / S3) are publicly accessible. If you are unsure, use Test Public Access on the AI Settings page.
Last modified on April 30, 2026