はじめに
こんにちは。ゆーとぴあです。
個人サイトに付けたいと思っていたあるある機能，ブログを実装しました！
本投稿はその紹介記事になります。
使用した技術
- Next.js
フレームワークとしてNext.jsを使用しています。2月頃から長期インターンを始めたのですが，インターン先企業で採用しているのがNext.jsで，最も親しんでいるため採用しました。他のフレームワーク知らないし - TypeScript
Next.jsで開発するにあたり，JavaScriptかTypeScriptか使用する言語を選べますが，ここではTypeScriptを用いています。これもインターン先で採用しているため，素のJSに比べて親しみがあります。というか，素のJS書いたことほぼないです。とりあえず，色々と補完が効くのが便利ですね。 - Mantine
ReactのUIコンポーネントライブラリです。カスタムフックも提供しています。他に有名なライブラリとして，ChakraUIもありますが，ここではMantineを採用しています。これもインターン先（以下略 - Vercel
本サイトのデプロイ先です。Next.jsなどのフレームワークで作製したWebサイトを，GitHubのリポジトリから数クリックの簡単な操作でデプロイ，ホスティングしてくれるサービスです。Hobby目的であれば無料で使えます。GitHubへのプッシュにより勝手に再ビルドが行われるのが便利です。
上記3つは，ブログ機能以外でも個人サイトの構築のために利用しています。
- microCMS
日本製のヘッドレスCMSです。ブログコンテンツの管理，作製に使用しています。APIを通して自身のWebサイト上でコンテンツを取得することが可能で，簡単にブログを実装することが出来ます。
搭載するリッチテキストエディタ上でのコンテンツ作製が可能で，GUIで体裁を整えたものが勝手にHTMLに変換されてJSONで送られます。あとは，表示側でパースしてあげれば終了です。
実装
気が向いたら書きます……
展望
- 目次ほしいよね，右側とかに
→記事のIDで目次作れるらしい，公式にドキュメントあり
- カテゴリごとに記事一覧表示変えられる機能つけたい
→そんなに記事書くのか……？
参考