Configure external data

Uniform's Mesh framework lets you configure your project to access multiple external data sources through the Canvas UI. Mesh separates the integration from data source connection details, allowing your project to have multiple connections of the same type if necessary (such as Contentful Spaces). Mesh also allows for multiple data types for each data source (such as single entry, multiple entries, query).

For this exercise you will configure your project to access JavaDrip articles from a headless CMS. During the lesson you will:

Goals

  1. Configure a data source that represents a headless CMS.
  2. Configure a data type for the Article content type.
  3. Use the data type to display content from the headless CMS.
  1. In Uniform, navigate to Integrations.
  2. Add the Contentful integration to the project.
  3. Navigate to Experience > Data Types.
  4. Click Add data type.
  5. In the dropdown, select Contentful > Create new.
  6. Enter the following values:
    FieldValue
    Space4v9xo98brk8z
    Content Delivery API (CDA) Access TokenwTxk_OEx3MheZ86BMefgbzo6NbnvDj1TqI9zrbbItqM
    Environment ID (Optional)master
    NameContentful
    Public IDcontentful
  7. Click Save.
  8. Since this is a new data source, Uniform opens the Create data type dialog.
    create-data-type-contentful
    A dialog is opened that lets you configure the new data type.
  1. From the dropdown Archetype, select Single Entry.
  2. Enter the following values:
    FieldValue
    Allowed Content TypesArticle
    Image thumbnail field nameThumbnail (Media)
  3. Click more optional settings.
  4. Enter the following values:
    FieldValue
    Search by fieldTitle
  5. Enter the following values:
    FieldValue
    NameSingle Article
    Public IDsingleArticle
  6. Click Save and Test.
    save-and-test-contentful
    An example of what the editor will see when using the data type is displayed.
  7. Click one of the articles.
  8. Click Fetch Test Data.
    fetch-test-data-contentful
    An example of the data that's available for the selected article is displayed.
  9. Click Done to continue.