> Portal Navigation:
> 
> - Append `.md` to any URL under `https://dev.wix.com/docs/` to get its markdown version.
> - Pages are either content pages (article or reference text) or menu pages (a list of links to child pages).
> - To get a menu page, truncate any URL to a parent path and append `.md` (e.g. `https://dev.wix.com/docs/sdk.md`, `https://dev.wix.com/docs/sdk/core-modules.md`).
> - Top-level index of all portals: https://dev.wix.com/docs/llms.txt
> - Full concatenated docs: https://dev.wix.com/docs/llms-full.txt

## Resource: Connect a Dynamic Repeater to a Collection

## Article: Connecting a Repeater to a Database Collection

## Article Link: https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/cms-collections-in-blocks/connect-a-dynamic-repeater-to-a-collection.md

## Article Content:

# Connect a Dynamic Repeater to a Database Collection Using Code

<blockquote class="caution">

**Editor compatibility**

Wix Blocks apps aren't supported in the Wix Harmony editor. Existing Blocks apps remain available for purchase on the Wix App Market for Wix Editor and Wix Studio sites. To learn more, see [About Wix Harmony and Blocks](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/about-wix-harmony-and-blocks.md).

</blockquote>

Blocks allows you to connect a [CMS database collection](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/cms-collections-in-blocks/about-cms-collections-in-blocks.md) to a [dynamic repeater](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/cms-collections-in-blocks/dynamic-repeaters-in-blocks.md) using code. Note that alternatively, you can connect a repeater to data [with no code](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/cms-collections-in-blocks/connect-elements-to-collection-fields-with-no-code.md).

<blockquote class="standard">
  <strong>Note:</strong>
  
  The `@wix/data` SDK cannot be tested in the Blocks Preview. [Test your app on a site](https://dev.wix.com/docs/build-apps/develop-your-app/frameworks/wix-blocks/deploy-and-manage-blocks-apps/test-your-app-on-a-site.md) to see it work.
</blockquote>

**To connect a dynamic repeater to a collection:**

1.  Create or open a Blocks widget. 
2.  Go to the **Add +** panel and add a dynamic repeater to your widget.
4. Go to the **Code {}** tab and import the `@wix/data` npm package. 
5. Go to widget code panel and import the [**@wix/data**](https://dev.wix.com/docs/sdk/backend-modules/data/items/introduction.md) module:

    ```javascript
    import { items } from "@wix/data";
    ```

6. Go to the **CMS** ![CMS](https://wixmp-833713b177cebf373f611808.wixmp.com/images/83f28e91326c7fb0448c452151944850.png) tab and open **Your Collections**. If you haven't created a collection yet, create one now. 
7. Click the three dots next to the collection name and then **Edit Settings**, to copy the collection ID. It should look something like this:
  ```js
  @username/my-app/MyCollection
  ```
5. Query the data in the collection and use it to populate the repeater. For example: 

    ```javascript
   import { items } from "@wix/data";

    $w.onReady(async function () {
      try {
        const results = await items
          .query("@username/my-app/MyCollection")
          .find();
        $w("#repeater1").data = results.items;
      } catch (err) {
        console.log(err);
      }
      $w("#repeater1").onItemReady(($item, itemData, index) => {
        $item("#text1").text = itemData.title;
      });
    });
    ```

<details>
<summary>See deprecated wix-data Velo example</summary>

```javascript
import wixData from "wix-data";
$w.onReady(function () {
  wixData
    .query("@username/my-app/MyCollection")
    .find()
    .then((results) => {
      $w("#repeater1").data = results.items;
    })
    .catch((err) => {
      console.log(err);
      throw new Error(err);
    });
  $w("#repeater1").onItemReady(($item, itemData, index) => {
    $item("#text1").text = itemData.title;
  });
});
```
</details>

## See also

For an additional example, refer to [this tutorial](https://dev.wix.com/docs/develop-websites/articles/databases/wix-data/displaying-data/display-database-collection-content-in-a-repeater.md). While the tutorial focuses on standard repeaters used in site building, the same principles apply to dynamic repeaters in Blocks. When adapting the tutorial for Blocks, make sure to **add the app namespace** before the collection name in your query.