Using JSON API Serializer to create more complicated JSON

The examples here don't go nearly far enough in explaining how to produce a more complicated structure...

If I want to end up with something like:

{
  "data": {
    "type": "mobile_screens",
    "id": "1",
    "attributes": {
      "title": "Watch"
    },
    "relationships": {
      "mobile_screen_components": {
        "data": [
          {
            "id": "1_1",
            "type": "mobile_screen_components"
          },
          {
            "id": "1_2",
            "type": "mobile_screen_components"
          },
          ...
        ]
      }
    }
  },
  "included": [
    {
      "id": "1_1",
      "type": "mobile_screen_components",
      "attributes": {
        "title": "Featured Playlist",
        "display_type": "shelf"
      },
      "relationships": {
        "playlist": {
          "data": {
            "id": "938973798001",
            "type": "playlists"
          }
        }
      }
    },
    {
      "id": "938973798001",
      "type": "playlists",
      "relationships": {
        "videos": {
          "data": [
            {
              "id": "5536725488001",
              "type": "videos"
            },
            {
              "id": "5535943875001",
              "type": "videos"
            }
          ]
        }
      }
    },
    {
      "id": "5536725488001",
      "type": "videos",
      "attributes": {
        "duration": 78321,
        "live_stream": false,
        "thumbnail": {
          "width": 1280,
          "url":
            "http://xxx.jpg?pubId=694940094001",
          "height": 720
        },
        "last_published_date": "2017-08-09T18:26:04.899Z",
        "streams": [
          {
            "url":
              "http://xxx.m3u8",
            "mime_type": "MP4"
          }
        ],
        "last_modified_date": "2017-08-09T18:26:27.621Z",
        "description": "xxx",
        "fn__media_tags": [
          "weather",
          "personality"
        ],
        "created_date": "2017-08-09T18:23:16.830Z",
        "title": "NOAA predicts most active hurricane season since 2010",
        "fn__tve_authentication_required": false
      }
    },
    ...,
  ]
}

what is the most simple data structure and serializer I can set up?

I get stumped after something like:

const mobile_screen_components = responses.map((currentValue, index) => {
  id[`id_${index}`];
});
const dataSet = {
  id: 1,
  title: 'Watch',
  mobile_screen_components,
};
const ScreenSerializer = new JSONAPISerializer('mobile_screens', {
  attributes: ['title', 'mobile_screen_components'],
  mobile_screen_components: {
    ref: 'id',
  }
});

Which only gives me:

{
  "data": {
    "type": "mobile_screens",
    "id": "1",
    "attributes": { "title": "Watch" },
    "relationships": {
      "mobile-screen-components": {
        "data": [
          { "type": "mobile_screen_components", "id": "1_0" },
          { "type": "mobile_screen_components", "id": "1_1" },
          { "type": "mobile_screen_components", "id": "1_2" },
          { "type": "mobile_screen_components", "id": "1_3" },
          { "type": "mobile_screen_components", "id": "1_4" },
          { "type": "mobile_screen_components", "id": "1_5" }
        ]
      }
    }
  }
}

I have no idea how to get the "included" sibling to "data." etc.

So, the question is:

what is the most simple data structure and serializer I can set up?

Below is the simplest object that can be converted to JSON similar to JSON in the question using jsonapi-serializer:

let dataSet = {
  id: '1',
  title: 'Watch',
  mobile_screen_components: [
    {
      id: '1_1',
      title: 'Featured Playlists',
      display_type: 'shelf',
      playlists: {
        id: 938973798001,
        videos: [
          {
            id: 5536725488001,
            duration: 78321,
            live_stream: false
          },
          {
            id: 5535943875001,
            duration: 52621,
            live_stream: true
          }
        ]
      }
    }
  ]
};

To serialize this object to JSON API, I used the following code:

let json = new JSONAPISerializer('mobile_screen', {
  attributes: ['id', 'title', 'mobile_screen_components'],
  mobile_screen_components: {
    ref: 'id',
    attributes: ['id', 'title', 'display_type', 'playlists'],
    playlists: {
      ref: 'id',
      attributes: ['id', 'videos'],
      videos: {
        ref: 'id',
        attributes: ['id', 'duration', 'live_stream']
      }
    }
  }
}).serialize(dataSet);

console.log(JSON.stringify(json, null, 2));

1. The first parameter of JSONAPISerializer constructor is the resource type.
2. The second parameter is the serialization options.
3. Each level of the options equals to the level of the nested object in serialized object.
4. ref - if present, it's considered as a relationships.
5. attributes - an array of attributes to show.