---
description: >-
  Connecting your project to a data source allows you to work with the
  information that you have stored in Airtable, Google Sheets, Webflow or a
  local table.
---

# Data Sources

## 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.&#x20;

You can choose one of the following data sources:

{% content-ref url="data-sources/data-sources" %}
[data-sources](data-sources/data-sources)
{% endcontent-ref %}

{% content-ref url="data-sources/data-sources-1" %}
[data-sources-1](data-sources/data-sources-1)
{% endcontent-ref %}

{% content-ref url="data-sources/data-sources-3" %}
[data-sources-3](data-sources/data-sources-3)
{% endcontent-ref %}

## 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.&#x20;
3. You can select from previously added data sources or add a new data source. Click **Create New**.
4. Follow the data source-specific instructions to complete the connection:\
   \- [Google Sheets](data-sources#connect-your-app-to-google-sheets)\
   \- [Airtable](data-sources-1#connect-your-app-to-airtable-by-api-key)\
   \- [Local Table](data-sources-3#create-a-local-data-source)

{% hint style="info" %}
You can also connect a data source in a data viewer's properties panel. Learn more here: [Data Viewer Components](../app-design/ui-components/data-components/data-viewers).
{% endhint %}

## Add Filter View

1. Open a data source.

<div align="left"><figure><img src="https://1223006790-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LAn5scXl2uqUJUOqkJo-84897653%2Fuploads%2FKckoonxK2W4LhH7ESPTs%2FScreenshot%202024-10-31%20152519.png?alt=media&#x26;token=a3f0e9e8-bcbe-40f6-a8b9-1682ce39d939" alt="" width="269"><figcaption></figcaption></figure></div>

2. Click **Add Filter View.**

<div align="left"><figure><img src="https://1223006790-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LAn5scXl2uqUJUOqkJo-84897653%2Fuploads%2FLO4qC24ZjMb9lcFMEwzM%2Ffilter2.png?alt=media&#x26;token=24c9464b-74c6-436f-8d5d-6b6d36bc7158" alt="" width="538"><figcaption></figcaption></figure></div>

3. Add one or more filter rules.

<div align="left"><figure><img src="https://1223006790-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LAn5scXl2uqUJUOqkJo-84897653%2Fuploads%2Fos4E3cjl1gCcNlJBHNqB%2Ffilter3.png?alt=media&#x26;token=d2df5e7f-25c9-4fa3-8dcd-e653bbcf17a4" alt="" width="538"><figcaption></figcaption></figure></div>

4. Click **Create Filter View.**

<div align="left"><figure><img src="https://1223006790-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LAn5scXl2uqUJUOqkJo-84897653%2Fuploads%2FK547koRmFXbtkm9UNMVL%2Ffilter4.png?alt=media&#x26;token=d3f6fe88-f216-442c-82f6-95a788fe2454" alt="" width="553"><figcaption></figcaption></figure></div>

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

<div align="left"><figure><img src="https://1223006790-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LAn5scXl2uqUJUOqkJo-84897653%2Fuploads%2FGR6wZnXzlBunR7WObDvp%2Ffilter%205.png?alt=media&#x26;token=8cee77ff-6a65-460e-8807-18be76eab652" alt="" width="225"><figcaption></figcaption></figure></div>

## Sort

1. Open a data source.

<div align="left"><figure><img src="https://1223006790-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LAn5scXl2uqUJUOqkJo-84897653%2Fuploads%2Fn0htbA5GAiiD5omkaqgJ%2Fsort1.png?alt=media&#x26;token=e39b7b14-986c-4089-8533-9d81a3990a57" alt="" width="563"><figcaption></figcaption></figure></div>

2. Click on a **Filter View.**

<figure><img src="https://1223006790-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LAn5scXl2uqUJUOqkJo-84897653%2Fuploads%2FLpwDS4lkghV1lIayQaXp%2Fsort2.png?alt=media&#x26;token=9eaf33d2-b613-49a4-b4d0-5f345cb8d32e" alt=""><figcaption></figcaption></figure>

3. Click Sort icon.

<figure><img src="https://1223006790-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LAn5scXl2uqUJUOqkJo-84897653%2Fuploads%2FbWO29yFNwOhkS4fxCjXT%2Fsort3.png?alt=media&#x26;token=affa5fbe-f976-40dc-99ee-1be7eb1d8850" alt=""><figcaption></figcaption></figure>

4. Select column.

<figure><img src="https://1223006790-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LAn5scXl2uqUJUOqkJo-84897653%2Fuploads%2FHvtIg2rmgpOltxKg5jaZ%2Fsort4.png?alt=media&#x26;token=bb24f9a0-2026-4da3-b8d7-917b0114e863" alt=""><figcaption></figcaption></figure>

5. Select **Ascending** or **Descending**.

<figure><img src="https://1223006790-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LAn5scXl2uqUJUOqkJo-84897653%2Fuploads%2FMKehPeVdHZuxrVsFMsKK%2Fsort6.png?alt=media&#x26;token=b520ba11-8d4d-4fd1-891b-8836c23b4c78" alt=""><figcaption></figcaption></figure>

## 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.\
   \
   ![](https://1223006790-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LAn5scXl2uqUJUOqkJo-84897653%2Fuploads%2FkQOB5WXy5kyk2qJlXvQ5%2Fdata%20source%20library%20w%3Ain%20project.png?alt=media\&token=09b1ec28-4f1e-4dd7-9636-d9c689d550b1)

### 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.\


    <figure><img src="https://1223006790-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-LAn5scXl2uqUJUOqkJo-84897653%2Fuploads%2FpdXRZ21NcFQ64zlwMRle%2Fdelete%20data%20source%20-%20projects%20page.png?alt=media&#x26;token=3167e5e2-2aab-43c6-a98d-df232ac265a2" alt=""><figcaption></figcaption></figure>

## 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.&#x20;

{% content-ref url="../app-design/ui-components/data-components/data-viewers" %}
[data-viewers](../app-design/ui-components/data-components/data-viewers)
{% endcontent-ref %}

### 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.&#x20;

{% content-ref url="../blocks/app-features/data-sources-blocks" %}
[data-sources-blocks](../blocks/app-features/data-sources-blocks)
{% endcontent-ref %}



***

{% hint style="success" %}
**Have feedback on this doc?** Please take a moment to share your feedback here: [Thunkable Docs Feedback](https://docs.google.com/forms/d/e/1FAIpQLSfCwn5L2xyla-LSLZX0DSWFcFeJ43qp-r1tELCacuVS2zduLA/viewform?usp=sf_link). Your valuable insights will help us improve and better serve you in the future.
{% endhint %}
