# Build UI

The next step is to start building your UI. For this purpose, you can use a variety of components available in the **Components** tab of the left side panel. Simply drag the component you need and drop it to the working area. One of the most common cases is using the **Table** component together with the **Form**.

{% embed url="<https://demo.arcade.software/P6UC9vxnRHknzTbpTShK?embed=&embed_desktop=inline&embed_mobile=tab&show_copy_link=true>" %}

When you select a component, you can access its **properties** displayed in the right side panel. Here, you can change any properties you want, for example, adjust table height, hide, delete or change the order of table columns, and so much more. You can also specify the settings for each specific column, as shown in the screen below.

<figure><img src="https://837703843-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FUX6zPRMFFK0yrTghj7cY%2Fuploads%2FwVtGDpKCZI1WxMFcpMny%2FCleanShot%202024-11-29%20at%2016.30.05%402x-min.png?alt=media&#x26;token=881efeef-615b-4166-b215-aebe273be1d8" alt=""><figcaption></figcaption></figure>

Now, if you're ready to proceed, move on to the [next step](https://docs.uibakery.io/build-from-scratch/getting-started/link-components) then. If you'd prefer not to for now, check out the section below :point\_down:

<details>

<summary><mark style="color:blue;">Mocking data</mark></summary>

In our flow here, as you've probably noticed, we haven't connected our data source yet. We first started building UI, and the components we added are not displaying the data from our data source.

And we want you to know that it's totally okay :slight\_smile: \
Sometimes, you may not want to immediately connect your data source to UI Bakery. There could be various reasons for this, such as the data source not being publicly accessible, having certain security restrictions, or simply feeling a bit lazy. We completely understand these situations as we've experienced them ourselves!&#x20;

If that is the case for you, have a look at a couple of [common methods](https://docs.uibakery.io/build-from-scratch/getting-started/build-ui/mocking-data) demonstrating how you can mock your data in UI Bakery.

</details>


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://docs.uibakery.io/build-from-scratch/getting-started/build-ui.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
