> 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="https://3574406564-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MB_fx7PCUqvFEdrucJC%2Fuploads%2Fizk6Pen3IfyReMv6OSrL%2Fimage.png?alt=media&amp;token=4b64c9f6-6928-42ac-bdb3-d63fe0caf63a" 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="https://3574406564-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MB_fx7PCUqvFEdrucJC%2Fuploads%2FVuAA92lgzp2SXxAWwCmT%2Fimage.png?alt=media&amp;token=3e05ad4b-2d16-4f35-bd49-67a2a5d311db" alt=""><figcaption><p>Data App</p></figcaption></figure>

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

<figure><img src="https://3574406564-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MB_fx7PCUqvFEdrucJC%2Fuploads%2FydeMj9uwEY3F2Qpbnq58%2Fimage.png?alt=media&amp;token=cb87c808-ae87-4182-9cc0-e114c03b1db3" alt=""><figcaption><p>Create App</p></figcaption></figure>

<figure><img src="https://3574406564-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MB_fx7PCUqvFEdrucJC%2Fuploads%2FLN7GcS7MK0SyfJx1jGWG%2Fimage.png?alt=media&amp;token=c73f8476-6585-44de-9dce-56c966db9dcd" 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="https://3574406564-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MB_fx7PCUqvFEdrucJC%2Fuploads%2FwdK77xTwVXjfS4x07BTM%2FScreen%20Recording%202023-09-04%20at%204.52.33%20PM.gif?alt=media&amp;token=78eca452-7b2c-4457-8bc0-cb4dd557ef7b" alt=""><figcaption><p>Add elements to the page</p></figcaption></figure>

### 5. Select the resource

Select the resource data you added.

<figure><img src="https://3574406564-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MB_fx7PCUqvFEdrucJC%2Fuploads%2FEL5vQ1eSGhKmXTGOVFfs%2Fstart-app-table2.gif?alt=media&amp;token=6f14d0bf-1ea0-40d1-a9dc-32df01c4cc0e" 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="https://3574406564-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MB_fx7PCUqvFEdrucJC%2Fuploads%2Fl82wwIq1qCBsHMeau8VK%2Fpreview.jpg?alt=media&amp;token=f18d0d3a-0bc1-4e1f-b8bb-8e276168a846" alt=""><figcaption></figcaption></figure>

<figure><img src="https://3574406564-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2F-MB_fx7PCUqvFEdrucJC%2Fuploads%2FWgZgfMYdaNPXOry05JNg%2Fimage.png?alt=media&amp;token=b67b6af6-dd2e-4598-9f8f-20a27212fc54" 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 %}