Nextjs 自作ブログ(microCMS)

Warning: count(): Parameter must be an array or an object that implements Countable in /home/xs638785/agile-software.site/public_html/wp-content/plugins/rich-table-of-content/functions.php on line 490

Jamstack

npm i microcms-js-sdk

idごとのページを表示させるためのid

const id = context.params.id;

ブログのidがリストで格納されています。

const paths = data.contents.map((content) => `/blog/${content.id}`);

ブログを2記事投稿している場合はidを2つ取得できます。

[ '/blog/r5bvmiv5bscx', '/blog/ol6uaf-l5' ]

dataにはオブジェクトが格納されている。

dataの中身の違い

contentId:idの記述を追加している方が特定の情報を指定できる

const data = await client.get({endpoint: “blog”});

{
  contents: [
    {
      id: 'r5bvmiv5bscx',
      createdAt: '2022-12-04T05:31:33.258Z',
      updatedAt: '2022-12-04T05:31:33.258Z',
      publishedAt: '2022-12-04T05:31:33.258Z',
      revisedAt: '2022-12-04T05:31:33.258Z',
      title: '2回目',
      body: '<p><img src="https://images.microcms-assets.io/assets/e2843345b3e545f38df324f50a8d52d5/44072d97f9d740ce9c9595ba5d4cbf08/git_logo.png" alt=""></p>'
    },
    {
      id: 'ol6uaf-l5',
      createdAt: '2022-12-04T02:32:10.575Z',
      updatedAt: '2022-12-04T02:32:10.575Z',
      publishedAt: '2022-12-04T02:32:10.575Z',
      revisedAt: '2022-12-04T02:32:10.575Z',
      title: 'はじめてのblog',
      body: '<p>Next.js<br><img src="https://images.microcms-assets.io/assets/e2843345b3e545f38df324f50a8d52d5/1ab96edbdf324d9db17847c4cbbf1175/amazon_logo.png" alt=""></p>'
    }
  ],
  totalCount: 2,
  offset: 0,
  limit: 10
}

const data = await client.get({endpoint: “blog”, contentId: id});

{
  id: 'r5bvmiv5bscx',
  createdAt: '2022-12-04T05:31:33.258Z',
  updatedAt: '2022-12-04T05:31:33.258Z',
  publishedAt: '2022-12-04T05:31:33.258Z',
  revisedAt: '2022-12-04T05:31:33.258Z',
  title: '2回目',
  body: '<p><img src="https://images.microcms-assets.io/assets/e2843345b3e545f38df324f50a8d52d5/44072d97f9d740ce9c9595ba5d4cbf08/git_logo.png" alt=""></p>'
}
{
  id: 'r5bvmiv5bscx',
  createdAt: '2022-12-04T05:31:33.258Z',
  updatedAt: '2022-12-04T05:31:33.258Z',
  publishedAt: '2022-12-04T05:31:33.258Z',
  revisedAt: '2022-12-04T05:31:33.258Z',
  title: '2回目',
  body: '<p><img src="https://images.microcms-assets.io/assets/e2843345b3e545f38df324f50a8d52d5/44072d97f9d740ce9c9595ba5d4cbf08/git_logo.png" alt=""></p>'
}