個人ブログ「HK Blog v2」デプロイ

はじめに

バックエンドエンジニアとして活動しているHKです。

以前から運用していた個人ブログをリニューアルし、「HK Blog v2」としてリリースしました。

本記事では、なぜ今回ブログを再構築したのか、その背景とこだわった技術的なポイントについてご紹介します。

なぜ「v2」なのか

これまでも自作のブログサービスをLaravelあたりで作成したようなしてないような、という感じだったのですが、

実務でバックエンド領域の経験に加え、最近注力しているNext.jsやフロントエンド領域への挑戦を形にするため、一から作り直そうと考えました。

コンセプト：なんでも書き散らしてOK

もっとラフに、書き散らしたい、ポエム書きたい

フロントエンド領域への挑戦を形にしたいという思いがある一方で、上記のような思いを持っていたため、個人ブログを作成しました。

書いた記事が見やすいように、デザイン面では派手な装飾を削ぎ落としたシンプルなサービス目指しました。

ほんのちょっとだけ工夫した箇所

1. Jamstack構成

Next.js (App Router) とmicroCMSを組み合わせたJamstack構成を採用しました。

最近使っているAstroと迷いましたが、まぁNextが無難か...

※SSGで表示速度の向上とSEO対策を両立するのは一応意識しました！

2. ピン留め機能などのちょっと便利機能

以下のようなあるとちょっと便利機能を検討して実装しました。

• ピン留め機能: 特定の記事をトップに固定するフラグ管理
• 動的なタグ検索: タイトルとタグを掛け合わせた検索機能

3. 技術記事のためのhighlight.js導入

技術記事を投稿するため、highlight.jsを導入し、シンタックスハイライトに対応しました。

コードの可読性をちょっと高めたい的な感じで実装しました。

まとめ

フロントの開発ってそこそこ楽しい...