Next.jsでポートフォリオサイトを制作しました
念願叶って（重い腰を上げて）Next.js[TypeScript]+microCMSでポートフォリオサイトを制作しました。
ハマりにハマって文字通り頭抱えながら制作しました。慣れていない作業だったため本当にしんどかったです。検証で見ていただくとわかると思いますがコンソールエラーだらけです。hydrationエラーを起こしているみたいなのですが、そこそこ検討はついているので早いうちに対応します。
エラー解消しました。microCMSのAPIから日付データを受け取る際のタイムゾーンのズレが原因でした。
ちなみにこのエラーはローカル環境では出ず、デプロイしたら出るようになっていました。
下記URLの記事のように対応したら7つ出てたエラーが全部消えました。ありがとうざいます...🙏
microCMS の API から返却されている日付データは UTC で返却されている
※公式にも書いてありました
作成日（createdAt）や公開日（publishedAt）がAPI経由で取得すると1日ズレてしまいます
やったこと
・デプロイ先はvercelで、ドメインについてはエックスドメインで取得したドメインのネームサーバーをvercelのものにして紐づけました。
・ブログと実績はmicroCMSから投稿出来るようにしています。が、hydrationエラーは実績の投稿が原因のようです。
他は後で追加します
これからやること（実装すること）
・ページャー
・前の記事へ&次の記事へリンク
・TOPに実績を２件だけランダムに表示 済🎉
・記事一覧に記事内容の冒頭のみ表示させる 済🎉
・記事更新日の表示 済🎉
・投稿して1週間の間feed一覧の記事名にnewをつける 済🎉
・パンくず
・GTM設置 済🎉
・ちゃんとしたAboutページ作成 済？
・一部の実績を限定公開にするため、一部ページにBasic認証を設定
そして今回、制作するにあたり参考にさせていただいた記事です。
microCMS × Next.js（TypeScript）で個人ブログを作る
このブログは主に作業の備忘録として活用したいです。
よろしくお願いします。