Creating a Strapi Dynamic Zone & Rendering it in your Nuxt.js App

1

A common challenge one would face when using any CMS is the constant back and forth between developer and content teams. Be it planning and updating content structures in the backend or rearranging content on the frontend of an application, making changes almost always means additional work for both teams. It gets even harder when there is uncertainty around the content structure, how often the content will be updated, and what it will look like. Strapi has an interesting way of making this process more efficient and it comes in the form of a feature called Dynamic Zones.

This is a companion discussion topic for the original entry at https://strapi.io/blog/creating-strapi-dynamic-zone-in-nuxtjs-app
2

@commentsBot is this outdated or not? When I follow the tutorial I get a whole different fragmentTypes.json file then you did:

{
  "possibleTypes": {
    "GenericMorph": [
      "ComponentContentImage",
      "ComponentContentJumbotron",
      "ComponentContentText",
      "HomePage",
      "I18NLocale",
      "Page",
      "Property",
      "UploadFile",
      "UploadFolder",
      "UsersPermissionsPermission",
      "UsersPermissionsRole",
      "UsersPermissionsUser"
    ],
    "HomePageContentSectionsDynamicZone": [
      "ComponentContentImage",
      "ComponentContentText",
      "Error"
    ]
  }
}

resulting in a Cannot read property 'types' of undefined error:
introspectionResultData.__schema.types.forEach(function (type) {
And that makes sense, because there’s no __schema in my fragmentTypes.json

3
4

Yes I have the same issue reported above. Please update the article.

5

hey, thanks for the messages. Working on updating this article ASAP.

6

Hey, just updated the article for anyone following, you can have a look here

7

The demo link https://dynamic-zones.netlify.app shows a 500