> For the complete documentation index, see [llms.txt](https://docs.acho.io/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://docs.acho.io/app-builder/get-started.md).

# Get Started

To start building your first app, you can follow the following steps.

### 1. Connect with a data source as a [**Resource**](/acho-studio/resources.md)

Most data sources are supported here including flat files (.csv, xlsx, .txt, json), databases (MySQL, MongoDB, Snowflake, BigQuery, etc), and Applications (API, CRMs, ERPs, and more).

(Optional) Use [**Data Prep**](/acho-studio/data-prep-projects.md) to preprocess your data.

<figure><img src="/files/IN54w41BdnqFKOOX3ERk" alt=""><figcaption><p>Resourses</p></figcaption></figure>

### 2. Go to **App Builder (Data App)** and create a new app

Simply create a new app project in the “App Builder” section. Each app project would contain one unique application with a unique root URL, set of databases, front-end components, and services.&#x20;

<figure><img src="/files/6vDgsiVz9PHsBX4IH5tB" alt=""><figcaption><p>Data App</p></figcaption></figure>

### 3. Create a blank app, or build with a template.

<figure><img src="/files/CH1Fnniez7EGk9Nbjjxn" alt=""><figcaption><p>Create App</p></figcaption></figure>

<figure><img src="/files/BgARuZBm5QRAqHH6AiIT" alt=""><figcaption><p>The blank app you will generate if you choose blank app</p></figcaption></figure>

### 4. Construct pages

Next, you can construct the page layout by dragging any element from the **Create** panel and dropping it on the page. In this example, drag a table element to the page.&#x20;

<figure><img src="/files/LH8oxiW6Hy3jsjhKaI6W" alt=""><figcaption><p>Add elements to the page</p></figcaption></figure>

### 5. Select the resource

Select the resource data you added.

<figure><img src="/files/qKXKQAg5i40185fY47ca" alt=""><figcaption></figcaption></figure>

### 6. Preview

Click the [**Preview**](/app-builder/preview.md) button on the top right to see the result.

<figure><img src="/files/TXUJqCyO8kMKJ1jm2RlD" alt=""><figcaption></figcaption></figure>

<figure><img src="/files/kLXSaptIzvo7TmXfHLxi" alt=""><figcaption><p>Previewing the app</p></figcaption></figure>

### 7. Publish

Once your app is constructed, you can click the [**Publish**](/app-builder/publish.md) button to [publish](/app-builder/publish.md) your app and [share](/organization/share-your-apps.md) the link with other people. &#x20;

{% hint style="info" %}
Explore more detailed tutorial in [Popular Use Cases](/app-builder/popular-use-cases.md)
{% endhint %}