Next.jsとTailwind CSSでオリジナルのブログを作った

タイトルの通り、自分のオリジナルブログを作りました。

情報発信・アウトプットは非常に大事だと感じています。

例えば、以下のような記事をまとめます。

• プログラムを書く身として技術記事を書く
• 特定のバグの解決方法を残す
• 自分の労力をかけ結果を出した勉強法をまとめる

その際に、ブログ（文字）で発信する場合、どのような方法があるでしょうか？

• 全般
  • Note
  • はてなブログ
  • Wordpress
  • Notion
• 技術記事
  • Zenn
  • Qiita

以上のようなサービス・ツールが挙げられます。 短期的・拡散性的・プラットフォームとしての機能性を考えると、上記サービスを活用するのがベストです。 しかし、デメリット、というより、個人でブログを作って書くことの利点も数多く存在します。

それらを解消するための自分のオリジナルの個人ブログを作った、ということです。 自分でせっかく作ったのだから、記事を書かなきゃ、と自分を追い込む戦略でもあります。

開発中なので、随時更新です。ロードマップの意味も含んでいます。 実装したことに関しては、解説用の記事を更新するつもりです。

• ダークモード
• 目次
• コードブロック
• ブログカード
• サイトマップ
• サイトマップ送信の自動化 (GitHub Actionsを使ってサイトマップを更新したことをcurlで処理)
• ページトップへ移動ボタン
• 関連記事表示（カテゴリ分類と同時に作る）

モダンな技術かつ、開発元も安定していて中期的に保守・運用できるものを採用しました。 Web バックエンドは構築する必要がないので、Web フロントエンドのみです。

• Next.js
• TypeScript
• Tailwind CSS

正直に言うと、このブログは静的なファイルを配信するだけなので、ライブラリの開発が終了しても動き続けることは可能です。 ですが、何かしらのセキュリティホールを生むわけにはいきませんので、きちんと管理します。

すべて静的な Markdown ファイルで管理しています。 たくさんのメリットを感じています。たとえば以下のように。

• 移行が簡単
  • 他のメディア・サイトの切り替え時のコストが 0 になる
  • .mdxファイルは移行がしづらい（他でそのまま利用できない）
• バックアップが取りやすい
  • コンテンツが命
  • 単なる.mdファイル
  • Github・ローカル・クラウドストレージ・SSD でのバックアップ体制

最後までお読みいただきありがとうございました。