# Concepts and Use Cases

In this Module, we present some important UI-related concepts to be familiar with. The main usage areas of each of them are explained, and we also provide a link to relevant articles as well as examples in Showroom.

We assume familiarity with all topics of the Appfarm Fundamentals module [User Interface Fundamentals](/appcademy/appfarm-fundamentals/user-interface-fundamentals.md).

### Container usage: Scrolling, Hover-events and Loaders

The Container is a multi-purpose UI Component. In fact, it's a `<div>` tag in HTML. First of all, it is used to divide the view into sections and control margin & alignment. It may also be used to create custom buttons or styling elements, and it may be used to create slidable lists/tiles or repeating constructions such as rows, tiles or multidimentional matrices (such as a calendar). All scroll settings are done on the Container as well.

**Articles**:

* [Container article](/library/ui-components/container.md) including info on Scroll and Hover and File-drop

**Showroom examples**:

* [Loader ](https://showroom.appfarm.app/ui-components/loader)
* [Hover and File-drop](https://showroom.appfarm.app/ui-components/hover)
* [Infinity Scroll](https://showroom.appfarm.app/use-cases/infinity-scroll)
* [Scroll to top](https://showroom.appfarm.app/use-cases/scroll-to-top) (or to anchor)

### Container usage: Multidimentional tables and swipeable lists

You may use the Container to create custom multidimentional tables, such as a Calendar or Data grids with repeating columns. You may also change the iteration variant of the container to allow for Swipeable lists or Recursive tree structures.

**Articles:**

* [Build a Drag & Drop Calendar](/how-to/user-interface/drag-and-drop-calendar.md)

**Showroom examples:**

* [Calendar with Drag & Drop](https://showroom.appfarm.app/use-cases/calendar)
* [Create a Data grid](https://showroom.appfarm.app/use-cases/data-grid) using Containers
* [Swipeable list](https://showroom.appfarm.app/ui-templates/tiles-swipe)

### Drag & Drop

Drag & Drop is a nice feature in some contexts, such as when creating a Trello-like kanban.

**Articles**:

* [Configure Drag & Drop](/how-to/user-interface/drag-and-drop.md)
* [File Drop on a Container](/library/ui-components/container.md#hover-and-file-drop-zones)

**Showroom examples**:

* [Drag & Drop Kanban](https://showroom.appfarm.app/drag-and-drop-kanban)
* Example of File drop in Showroom on the [Create File Object](https://showroom.appfarm.app/action-nodes/create-file-object) example and the [Hover ](https://showroom.appfarm.app/ui-components/hover)example


---

# 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.appfarm.io/appcademy/appfarm-professional/user-interfaces/concepts-and-use-cases.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.