At Thunkable, our mission is to empower creators of all experience levels to build real-world apps—faster and more intuitively than ever before. With our new Generative AI tools, you can turn your ideas into fully functioning apps using nothing but plain language—no coding required.

Here’s what makes it stand out:

• Free to use: Gen AI tools are available to all Thunkable users, including those on the free plan.

• Rapid prototyping: Simply describe what you want—say, “a fitness tracker app with a timer and stats”—and our AI generates screens, components, and logic to match your vision.

• No code necessary: Customize and refine your app using Thunkable’s visual design canvas and blocks-based logic builder.

• Real apps, not demos: Build apps you can preview on devices, test across platforms, and publish—fully functional on iOS, Android, and the web.

Joining millions of creators who solve real problems with Thunkable, our Gen AI tools are designed for students, entrepreneurs, designers, and anyone with an idea—and the will to build it today.

Thunkable is a drag-and-drop platform that allows anyone to design, develop, and deploy powerful mobile and web apps — all without writing code.

Whether you're a student, educator, entrepreneur, or hobbyist, you can bring your app ideas to life using intuitive visual tools and powerful logic blocks.

Create Your First App

When you open your Projects Page in Thunkable, you’ll see two ways to get started:

1. Use the AI Template Generator ✨ (Recommended)

The fastest way to jumpstart your project. Just describe what you want to build — for example, “a task manager for students” or “a recipe app that filters by ingredients” — and the AI Template Generator will create a starter app with:

• Screens and layouts

• Functional components

• Basic logic

After your prompt previews your starting point, you can immediately start to customize and expand the project as much as you like.

📘 See our AI Project Generator Docs

2. Start from Scratch

If you want complete creative control or already know how you want your app to work, start with a blank project. You’ll build your UI, add logic, and connect data sources step by step.

The Thunkable Design + Blocks Interface

Thunkable’s editor has two key areas:

• Design Tab: Drag and drop components like buttons, images, lists, maps, and more to visually build your app’s UI.

• Blocks Tab: Add logic to your app using code blocks — no syntax required.

You can switch between these tabs anytime as you build.

The Design Editor

Designing the visual aspect of your app is accomplished with screens, user interface (UI) components, and navigators. You can combine, style and customize them to give your app personality and style that best suits your brand.​

The Blocks Editor

Thunkable blocks are the building blocks of a great experience for your app users. Every component has its own set of blocks to start or trigger an event and set and change properties.

Preview and Test Your App

As you build, you can preview your app in real time:

• Use the Live Test button in the top-right corner to open a web preview.

• Download the Thunkable Live mobile app on iOS or Android to test directly on your phone.

• You can also your app to the web or to app stores once it’s ready.

Next Steps

Here are some great ways to keep learning:

• 📘 View tutorials in the Thunkable Academy

• 💬 Join the Community Forums

• 📺 Check out our YouTube page

Overview

Keyboard shortcuts improve efficiency by enabling faster task execution, boosting productivity, and streamlining workflows. There are keyboard shortcuts available for the Thunkable Design Tab and Blocks Tab.

Design Tab

Blocks Tab

Keyboard Shortcuts

Sign Up

To get started with Thunkable, visit our sign up page.

You can sign up with a Google account or an Apple ID and sign in immediately, or you can enter your email address and be sent a magic sign-in link.

We recommend using a Google or Apple account, which will make testing your app easier.

If you choose to sign up with email, you will be sent an email like the image below.

Pressing the Click to Sign In button will open your new Thunkable account and keep you signed in for 30 days, unless you choose to sign out sooner.

Sign In‌

Returning users can go directly to our sign in page to sign back into their Thunkable account.

Again, you can sign in with Google, Apple, or your email address.

Sign in with Google

This button will sign you in automatically with your Google account.

Sign in with Apple

This button will sign you in automatically with your Apple ID account.‌

Sign in with Email

If you click Sign in with email you will be invited to type your email address in a text input.

When you click Email me the link we will send you a link that will sign you back into your account.

Overview

There are two ways to test and preview your Thunkable app: Web Preview in your computer's browser or on your mobile device with the Thunkable Live app. These tools aren't designed to check for errors but to allow you to preview your app's design and test its functionality in real time.

Web Preview

You can test and preview your project directly within your browser. This is a great option when designing your app's user interface and building out the app's functionality with blocks.

It is important to note, however, that Web Preview does not support some app features. This is because some app features require functionality only available on a mobile device, such as push notifications, accelerometer, and Bluetooth low energy. For a full list of features that cannot be tested with Web Preview, please see here: Publish as a Web App.

You can also preview any public app, directly from the app's Project Detail Page.

Thunkable Live App

The Thunkable Live app connects the projects in your web browser to your mobile device. It allows you to preview and test your projects directly on your device. Any changes you make in your browser are displayed on your device immediately. You can also take your project on the go and show it off with the Thunkable Live app.

Video Tutorial

How to Test and Troubleshoot with Thunkable Live App

In this tutorial, you’ll learn how to test and troubleshoot your project using the Thunkable Live app on your device.

Download the Thunkable Live App

Links to download Thunkable Live for Android and iOS are available here: https://thunkable.com/mobile

If you don't have an iOS or Android device, you can also set up an emulator on your computer that mimics what you would see on an actual device.‌

Testing and Previewing with Thunkable Live

1. Open your project in your web browser.

2. Click the Live Test on Device icon.
3. If you're signed in to Thunkable with Google:

   1. Open the Thunkable Live app on your device.

   2. Sign in with the same Google account.

4. If you're signed in to Thunkable with email:

   1. Click Enter my code.

   2. Open the Thunkable Live app on your device.

5. Select the app you want to open from your list of Thunkable projects.

Troubleshooting Thunkable Live

If your app is not working as expected on Thunkable Live, it may be the result of one of the following. Ensure that your project adheres to the following before testing with Thunkable Live again:

• Variable names can only contain alphanumeric characters and underscore.

• You cannot add a border to an image component containing a .gif asset.

• If your app sets a text input's text to upper case, test with a device other than Samsung.

• If you have added a navigator to your app, ensure screens are nested underneath it in the component tree. If your screens are not nested, drag and drop to nest them within the navigator.

• Ensure your blocks are connected without errors.

• Ensure you're logged into the same account on your web browser and the Thunkable Live app.

• You may have an event triggered by a Screen. Start block, which may be causing the screen to crash.

If changes that you make cause the app to crash...

• Close the app and reopen it.

If an image is not showing up on your device...

• You may have the image's height or width set to Fit contents. Try changing this and try again.

Overview

Thunkable’s versioning functionality allows you to preserve a version of your drag and drop project at a point in time. Project versioning provides a better way to organize and manage multiple versions of your projects, allowing you to easily find past iterations and revert back to previous versions if you make changes to the original version that you end up disliking.

There are two forms of versioning available, auto-versioning and manual versioning, both of which are available to our Builder and Advanced Creators.

Accelerate and Builder plans allow for 10 manual versions per project, and Advanced plans allow for 50 versions per project. Overall storage limits remain the same and each saved version counts towards the account’s limit, meaning if a creator makes one version of a 50MB project they will be using 100MB of account storage. For more on plan limits please see here: .

Video Tutorial

How to Save Versions of Your Thunkable Project

In this tutorial, we’ll show you how to use Thunkable’s versioning functionality to preserve a version of your project at a point in time.

Auto-versioning

Never worry about losing your app progress with auto versioning. Thunkable automatically backs up your projects every few hours.

To access the two most recent auto versions of your project:

1. Access the Design tab of your project.

2. Click the Version History clock icon in the upper right.

Each auto version’s name reflects the date and time the version was created.

Version actions

Click the version’s vertical ellipsis to access its version actions.

Restore

The Restore option reverts your current project to this version.

Manual versioning

Create an app version

To save a version of your project:

1. Access the Design tab of your project.

2. Click the Version History clock icon in the upper right.

3. Click Create Version. A new version of the project is created with the default version name reflecting the date and time the version was created.

Version actions

Click the version’s vertical ellipsis to access its version actions.

Restore

The Restore option reverts your current project to this version.

Save As

The Save As option saves that version as a new project. Select a name for your new project and then click Create. The newly created project is now available on your Projects Page, and the version will remain within the existing project.

Delete

The Delete option will permanently delete the selected version. This action can’t be undone.

Additional considerations

• If you downgrade your subscription plan, you will lose your oldest versions up to your new limit.

• Creating a new version of a project makes a full copy of the project, including project settings such as name, project privacy, data, etc. Restoring a version will also restore those settings.

Overview

When a data source powers your app, you can continuously update your app contents without having to republish it. It allows you to build a dynamic app that can create, read, update, and delete data.

You can choose one of the following data sources:

Connect Your App to a Data Source

1. Click the data icon in the left side panel to access your data source library.

2. Click the plus sign at the top of the panel.

3. You can select from previously added data sources or add a new data source. Click Create New.

Add Filter View

1. Open a data source.

1. Click Add Filter View.

1. Add one or more filter rules.

1. Click Create Filter View.

1. Select the Filter View in a data viewer's properties panel.

Sort

1. Open a data source.

1. Click on a Filter View.

1. Click Sort icon.

1. Select column.

1. Select Ascending or Descending.

Delete a Data Source

There are multiple methods to delete a data source.

Method 1 - project's data source library

1. Open the project.

2. Click the data icon in the left side panel to access your project's data source library.

3. Click the trash can icon next to a data source you want to delete.

Method 2 - account's data source library

1. Access your Projects Page.

2. Click Data Sources in the left sidebar.

3. Click the trash can icon next to a data source you want to delete.

Related Docs

Data Viewer Components

Once you have connected your project to a data source, you can use the data viewer components as a presentation layer to display the data in your data source.

Data Sources Blocks

To access the data sources blocks, you must first connect a data source. Then, by incorporating the data source blocks into your app, you can allow users to create, read, update, and delete data in your data source when they interact with the data viewer.

Thunkable is a no-code platform that empowers anyone to design, build, and publish native mobile and web apps—without writing a single line of code. Whether you’re launching your first idea, prototyping a product, or teaching app development, Thunkable gives you all the tools to create and deploy functional apps quickly and visually.

Build Apps with AI

Thunkable now includes AI-powered app generation to help you get started faster than ever. Just describe what you want to build—like:

“A journaling app that tracks moods and sends daily reminders.”

Thunkable will instantly generate a working app project for you. The result includes:

• Pre-built screens and UI layouts

• Customizable components and design

• A fully editable project you can test, refine, and publish

You can jump in immediately to personalize the app using Thunkable’s drag-and-drop interface and visual logic editor.

Why Thunkable?

Thunkable combines the ease of visual design with the power of native app functionality. It’s built to support everything from early prototypes to full production apps, all in one platform.

• Visual UI design – Build interfaces with drag-and-drop components

• Logic blocks – Add behavior and interactivity without code

• Native features – Access the camera, sensors, notifications, maps, and more

Who Uses Thunkable?

Thunkable is designed for creators of all backgrounds:

• Students and educators who want to learn app development

• Designers and solopreneuers who need to prototype ideas quickly

• Non-technical makers who want to build real apps without writing code

What Can You Build?

Thunkable supports a wide variety of app types:

• Productivity tools and business apps

• Educational and learning apps

• AI-enhanced utilities and chatbots

• Media players and creative tools

How It Works

Getting started with Thunkable is simple—even if you’ve never built an app before:

1. Describe your app idea Start by writing a short prompt that describes what you want to build. For example: “I want to build a task tracker that sends daily reminders.”

2. Thunkable creates a working project Based on your description, Thunkable generates a complete, editable app. It includes screens, UI elements, and logic that match your idea.

3. Customize your app Open the project in the Thunkable Builder and personalize it. Use drag-and-drop tools to rearrange components, change styles, and update logic—all visually.

Additional Help Options

We are proud to offer you the following resources:

1. Not sure where to get started? Check out the Thunkable Academy!

2. Want to connect with other Thunkable Creators? Ask a question and join the conversation in the Community!

3. Enjoy instructional videos? Check out our library of tutorials available on YouTube.

Pricing and Membership

You can get started building with Thunkable today for free. As you progress as a Creator with Thunkable, we offer different membership tiers, allowing you to build and do more. This includes:

🤖 Generative AI Tools 💰 Showing AdMob ads in your app 🙈 Making private apps ⚡ Expedited publishing 📢 Adding push notifications to your app 📱 Creating a personalized splash screen

Thunkable offers plans to suit individual and business needs. Learn more about the memberships we offer here: .

Help Options

We are proud to offer you the following resources:

1. Thunkable Academy Not sure where to get started? Check out the Thunkable Academy!

2. Want to connect with other Thunkable Creators? Ask a question and join the conversation in the Community!

3. Enjoy instructional videos? Check out our library of tutorials available on YouTube.

4. Contact our Support Team Creators on our paid plans can click the chat icon in the upper right corner of any Thunkable Project page to connect with our Support team.

Overview

In Drag and Drop projects, you have the ability to undo and redo actions within the Design Tab. This powerful feature in our Design Editor lets you easily reverse or reapply recent changes, giving you greater control over your design process.

Keyboard Shortcuts

The AI Editor in Thunkable is available in both the Design tab and the Blocks tab, helping you build screens and generate logic with ease.

The AI Editor on the Blocks tab in Thunkable is a fast and convenient way to build your app by generating blocks using natural language. Powered by ChatGPT, this feature helps you quickly create functionality without manually searching for each block, so you can focus more on your app’s logic and design.

What is the AI Blocks generation?

AI Blocks Generation is an in-app tool that lets you describe what you want your app to do, and it automatically creates the necessary blocks for you. Integrated directly into the Thunkable platform, it uses ChatGPT to understand your requests and generate working blocks in real-time.

The AI Chatbot in Thunkable is a fast and convenient way to get answers to your questions about app development using the Thunkable platform. Powered by ChatGPT, this tool provides real-time responses to help you keep building without delays.

What Is the AI Chatbot?

The AI Chatbot is an in-app feature that connects you with ChatGPT, trained to understand and answer questions related to Thunkable. It’s designed to assist with how the platform works, provide block suggestions, and clarify app development concepts.

Overview

These new AI features accelerate your app development process. They can assist with understanding how Thunkable works, suggest useful block combinations, help design screens, or identify problems in your blocks.

AI Chatbot Helper

The AI Chatbot, powered by ChatGPT, can answer questions related to app development, Thunkable blocks, and general platform usage.

To use the AI Chatbot:

1. Open your project

2. On the Design or Blocks tab, click the icon

3. Enter your question in the chat window.

AI Debugger

The AI Debugger helps identify and explain issues within your blocks. It provides feedback and suggestions to improve your logic or fix errors.

To use the AI Debugger:

1. Open your project

2. Go to the Blocks tab

3. Click the icon

4. Turn the AI Debugger switch to true

Token Usage

All AI-powered features require tokens to operate. The number of tokens available depends on your . You can see how many tokens you have used in the bottom, after selecting an AI tool.

Overview

This new AI feature accelerates your app development process by generating text and images throughout your apps.

AI Text Generator

Get a first draft of your app's text fast with AI text generation.

Generate AI Text Directly in the Designer

1. Drag a label component onto a project screen.

2. Click the AI Text Editor icon

3. In the provided text input, type a description of the text you want to generate.

4. Click the upward arrow to submit your prompt.

For more on working with the label component, see here: .

AI Image Generator

With a simple text prompt, generate one-of-a-kind illustrations, images, or art to use as assets in your project.

Generate an AI Image Directly in the Designer

1. Drag an image component onto a project screen.

2. Click the Generate Image icon

3. In the provided text input, type a description of the image you want to generate.

4. Click the upward arrow to submit your prompt.

For more on working with the image component, see here: .

AI Image Editor

With a simple text prompt, edit an image in your project.

Edit an Image Directly in the Designer

1. Drag an image component onto a project screen.

2. Select a Picture from the Assets or use AI to generate an image.

3. Click the AI Image Editor

4. In the provided text input, type a description of the image you want to generate.

Overview

Prompt engineering is the practice of designing clear and effective instructions or questions for an AI system to improve the quality of its responses. It involves choosing the right words, structure, and context to help the AI better understand what is being asked and provide accurate, relevant answers.

Prompt engineering helps Thunkable AI tools generate more accurate and relevant outputs based on user input. By crafting effective prompts, users can improve app functionality and create more intuitive user experiences.

Inline AI Generator

There are two ways to access the inline AI generator for both image and text generation.

1. Omnibar: In the Design tab, click the AI tools icon on the Omnibar and select Edit Image or Edit text.

2. Component Selection: Click directly on the relevant component in your app.

   • For generating text, use components like Labels, click the AI Text Editor icon and enter your prompt in the pop-up.

See the example images below (from left to right): the AI tools on the Omnibar, a Label component example, and an Image component example.

Generation

When generating text or images with AI in Thunkable, the more detail you provide, the better the results. You don’t need perfect grammar or full sentences—just focus on clearly describing your idea.

Project Generation

When generating a project, it's important to have a clear understanding of your app's concept. To get the most out of the AI project generator tool, describe the main purpose of the app in the prompt field, and specify the types of screens you want included—such as a sign-in screen, home screen, or any other key interfaces.

📘 For more information on creating a project with AI, see our

Project collaboration is the ability for multiple users to work on the same app project together. Working together has many benefits that help teams unlock the potential of multiple skill sets while turning ideas into apps.

The Thunkable Community is an excellent place to discuss, collaborate, and learn from Thunkable Staff and other users!

You can make a copy of our spreadsheet here:

Utilizing public or sample projects streamlines the creation process and allows you to focus on features specific to your app! In this tutorial, you’ll learn how to make a public Thunkable project your own.

If you have questions about the tutorial’s content, head over to the Thunkable Community post specific to this tutorial here:

Head here to learn more:

If you have questions about the tutorial’s content, head over to the Thunkable Community post specific to this tutorial here:

Template app:

In this tutorial, you’ll learn what an API is, connect a Thunkable project to a web API, retrieve and parse the relevant data from the API, and use Thunkable blocks to modify the API URL that is called.

Sign up for free:

Download the Thunkable Live app to live test your app on a device:

Sign up for free:

Download the Thunkable Live app to live test your app on a device:

In this video, we’ll hop into the blocks tab and define the app’s behavior using Thunkable’s no code, drag and drop block technology.

Sign up for free:

Download the Thunkable Live app to live test your app on a device:

Sign up for free:

Download the Thunkable Live app to live test your app on a device:

Sign up for free:

Download the Thunkable Live app to live test your app on a device:

Sign up for free:

Download the Thunkable Live app to live test your app on a device:

When you are done building, you’ll have an exciting app to help you learn a new language!

Learn more about Hour of Code here:

When you are done building your app, you can check off each item in the list by taking pictures on your mobile device.

Learn more about Hour of Code here:

The Omnibar is your all-in-one access point for Thunkable’s AI-powered tools, designed to help you build and edit your app faster and more intuitively. Located inside the Project Editor, the Omnibar consolidates key AI features like StyleAI, AI Debugger, AI Chat Helper, and Rewrite This into a single, easy-to-access menu.

Whether you're looking to generate content, redesign a screen, debug app behavior, or refine copy, the Omnibar brings these capabilities together so you can stay focused and productive. This guide will walk you through what each icon in the Omnibar does and how to use them effectively in your project.

Using the Omnibar: Design vs. Blocks Tab

The Omnibar adapts depending on whether you’re in the Design or Blocks tab of the Project Editor. While the Design tab focuses on layout and visual components, the Blocks tab enables AI-assisted block generation.

Omnibar in the Design Tab

Icon Overview

In the Design tab, clicking the AI tools icon , opens a menu of AI tools focused on layout, UI, and content creation:

Each tool is optimized for visual creation — no code required.

Omnibar in the Blocks Tab

When you're in the Blocks tab, clicking the AI Tools icon opens an AI prompt field to help generate blocks with natural language.

How it works:

1. Click the icon to open the AI input box.

2. Type a prompt describing what you want your app to do. Example:

   • Text: when the screen opens, set its background color to green

Tell us what you want to build — we’ll show you how to start.

Skip the blank screen and get building faster. The AI Project Generator jumpstarts your app by creating a set of screens and logic based on your idea — no setup required. Just describe what you want to make, and we’ll turn your concept into a working app in seconds.

Whether you’re a first-time creator or looking to save hours of setup, the AI Project Generator helps you explore what’s possible and brings your vision to life instantly.

What Is the AI Project Generator?

Thunkable's AI Project Generator is a tool that creates a multi-screen app based on a short text description. You tell us what kind of app you want to build, and we generate a fully editable starting point you can customize.

Think of it as an instant launchpad for your ideas.

Key Benefits

• Removes the blank page problem — Ideal for beginners and non-technical users.

• Saves hours of work — Quickly generates multiple screens with example layouts and blocks for logic.

• Sparks inspiration — See what’s possible and get ideas for features and flows.

How It Works

1. Go to the Thunkable project dashboard

Go to your .

2. Describe Your App Idea

Type a short, clear description of what you want to build. For best results, be specific about the app’s purpose or features.

Examples:

• “A to-do list app with reminders and categories”

• “A fitness tracker for logging workouts and viewing progress”

• “A travel planner with a home screen, calendar, and checklist”

🔍 The more detail you give, the better your project will match your idea.

3. Let AI Do the Work

Click Generate Project and wait a few seconds. Thunkable’s AI will analyze your idea and build a project with multiple screens, components, and sample logic.

4. Review and Customize

Explore your new app:

• Review the structure and layout

• Rename screens and components

• Add your own data and branding

• Review or logic blocks to add new features

This is your app — the AI just got you started.

Tips for Better Results

• Use simple, specific language: “A budgeting app with charts” works better than “Something for money.”

• Mention the screens you want: For example, “A login screen, a dashboard, and a settings page.”

• Start small: You can always expand your app after generation.

Frequently Asked Questions

Can I edit everything the AI creates?

Yes! Everything is fully customizable — screens, components, design, and blocks.

What if the generated app doesn’t match what I wanted?

You can regenerate the project with a revised description, or start from the generated screens and modify them to fit your needs.

How many screens does the AI generate?

Typically 3–5 screens, depending on the complexity of your prompt.

Can I use this on a Free plan?

Yes, AI-generated projects are available on all plans, though usage limits may apply.

What’s Next?

Once your AI-generated app is created, you can:

• Add more to your project

• Add more or additional

• Connect to

The AI Project Generator is designed to give you momentum. Start with an idea — end with an app.

👉

Thunkable Inventory - Inventory Management

Book Reviews

Event Planner

Sign In + Sign Out

Web API - Weather App

ThunkableDoodle - drawing app

Image Recognizer

Flashcard App

The app for this activity will display a table of different charities that support refugees, but you can also follow along using a data table of your choice.

Copy a Data Table of your choice to use in your project here: https://thunkable.com/#/hourofcode

Learn more about Hour of Code here: https://hourofcode.com

See the Thunkable Docs for a list of supported text-to-speech languages: https://docs.thunkable.com/blocks/app-features/speech#supported-text-to-speech-languages

Sign up for free: https://x.thunkable.com/signup

Download the Thunkable Live app to live test your app on a device: https://thunkable.com/#/mobile

Upgrade Your Account

To upgrade your account:

1. Click your account avatar in the upper right.
2. Select Membership.

3. Click Change Plan.

4. Choose your new plan.

5. Confirm your selection.

Downgrade Your Account

To downgrade your paid account plan to free:

1. Click your account avatar in the upper right.
2. Select Membership.

3. Click Change Plan.

Change Account Email Address

Changing the email address associated with a Thunkable account is not possible.

Instead, transfer your existing projects to an account with a different email address:

1. In your old account, generate share links for the projects you want to transfer. Learn more here:

2. Use a private or incognito browser window to create a new Thunkable account with the desired email address.

3. Open the share links in the private or incognito browser window.

Access Invoices

The process for obtaining your invoices depends on your payment method.

Credit Card

1. Click your account avatar in the upper right.

2. Select Membership.

3. In the Billing history section, click PDF to view and/or print your monthly invoices.

PayPal

1. Sign into your PayPal account.

2. Navigate to your PayPal dashboard.

3. Click to view and/or print your monthly invoices.

Request a Refund

To be eligible for a refund, you must:

• Have not published an app to iOS, Android, or the web during that billing period.

• Provide reasoning as to why you are requesting a refund.

​To request a refund, email . Refunds are assessed on a case-by-case basis and are not guaranteed.

Change Platform Language

You can interact with the Thunkable platform in English or Chinese. To change the platform language:

1. Click your account avatar in the upper right.
2. Select Settings.

3. Select from language options.

Overview

When a data source powers your app, you can continuously update your app contents without having to republish it. It allows you to build a dynamic app that can create, read, update, and delete data. This doc covers creating a local table as the data source.

Overview

When a data source powers your app, you can continuously update your app contents without having to republish it. It allows you to build a dynamic app that can create, read, update, and delete data. This doc covers connecting your app to Webflow as the data source.

When using Webflow as the data source for your Thunkable app, you’ll connect to a Webflow CMS or Content Management System collection. To connect your Webflow CMS to your Thunkable project, you have two options:

• API Key

• OAuth

Video Tutorial

How to Connect Your Thunkable App to a Webflow Data Source

In this tutorial, we’ll connect a Thunkable app to Webflow as a data source and display the data in our app.

Connect Your App to Webflow by API Key

1. In Thunkable, click the data icon in the left side panel to access your data source library.

2. Click the plus sign at the top of the panel.

3. You can select from previously added data sources or add a new data source. Click Create New.

Connect Your App to Webflow by OAuth

1. In Thunkable, click the data icon in the left side panel to access your data source library.

2. Click the plus sign at the top of the panel.

3. You can select from previously added data sources or add a new data source. Click Create New.

Display the Data in Your App

Once you've connected a data source, you can display the data in your app with a data viewer component. Learn more about data viewer components here:

Overview

When a data source powers your app, you can continuously update your app contents without having to republish it. It allows you to build a dynamic app that can create, read, update, and delete data. This doc covers connecting your app to Google Sheets as the data source.

In Google Sheets, the entire document is considered to be the data source. To use a Google Sheet as a data source, the following must be true:

Overview

When a data source powers your app, you can continuously update your app contents without having to republish it. It allows you to build a dynamic app that can create, read, update, and delete data. This doc covers connecting your app to as the data source.

Overview

Thunkable's organizations are a set of administration and collaboration capabilities that allow multiple team members to work on a single project. Creators can jointly design and develop a single, shared project asynchronously.

A single Creator can edit the project at a time, and their changes are available for other members to view when they refresh their page.

Organization Management

Thunkable Creators have:

• roles with the organization (Admin or Member)

• permissions within a project (Project Owner, Editor, or Viewer)

• modes when actively within a project (Editing or Viewing)

Roles and Permissions Summary

Admin Dashboard

The Organizations Admin Dashboard is available for an organization’s Admins. This is where they can add, remove, and modify members' roles.

Access Admin Dashboard

1. Click your profile image in the upper right.

2. Select Organizations.
3. The Organizations page lists the organizations for which you hold admin status.

View Organization

1. Click an organization name.

2. The Members tab lists the organization’s members.

3. The Projects tab lists the organization’s projects.

Add Member

1. Click Add Member.

2. Input the invitee’s email address.

3. Indicate their role (Admin or Member).

Modify a Role

1. Navigate to the Members tab of the organization’s page.

2. Click the role dropdown associated with the member.

3. Select the appropriate role (Admin or Member).

Remove a Member

1. Navigate to the Members tab of the organization’s page.

2. Click the role dropdown associated with the member.

3. Select Remove.

Assigning a Project to an Organization

Creating a New Project in an Organization

When creating a new project, organization members can assign it to their own personal projects or the organization.

Projects assigned to the organization can be collaborated on by members of the organization.

Once a project is assigned to an organization, it cannot be converted into a personal project. It remains part of the organization and cannot be moved to any one Creator’s personal projects, including the admin of the organization.

Projects created within an organization cannot be shared with users outside of the organization.

Duplicate into an Organization

The owner of a personal project can make a copy of the project in an organization in which they are a member. To do this, as the project's owner:

1. On the project's Design tab, click the Project Actions icon.

2. Select Duplicate into...
3. In the modal provided, give the project a name.

Viewing and Editing Modes

When accessing organization projects, members are in one of two modes: editing or viewing. There can only be one project member in editing mode at any given time – all other organization members remain in viewing mode.

Members accessing the project in viewing mode cannot make active changes to the shared project.

Sharing and Updating Permissions

To share a project with a user in your organization:

1. Click the Share icon.

2. Select Project Sharing.

3. Enter the email address of the user you want to add to the project

To update the permissions of a user in your organization:

1. Click the Share icon.

2. Click the user's existing permission level (EDITOR or VIEWER) and select Editor, Viewer, or Remove.

Collaborating with Comments

Organization members can collaborate on projects by adding comments to UI components.

Add Comments

To add a comment to a UI component:

1. Access the project’s Design tab.

2. Ensure you’re in Editing mode.

3. Click the Comment icon to open the comment panel on the right.

View Comments

To view comments on a UI component:

1. Access the project’s Design tab.

2. Click the Comment icon to open the comment panel on the right.

3. Comments are grouped with the UI component they were added to.

Delete Comments

You can delete your own comments. To delete a comment:

1. Access the project’s Design tab.

2. Ensure you’re in Editing mode.

3. Click the Comment icon to open the comment panel on the right.