GhostからNext.jsへブログをリニューアルしました。

Next.jsへの移行理由

Ghostは優れたブログプラットフォームで、多くの機能を提供していますが、私のニーズには完全に合っていませんでした。

カスタマイズ性

Ghostはカスタマイズ性に優れていますが、リッチなUIやインタラクティブな要素を追加するのは難しいです。
Next.jsのようなフレームワークを利用することで、さらに高い自由度でのカスタマイズが可能になります。

パフォーマンス

Next.jsは、SSG（Static Site Generation）やISR（Incremental Static Regeneration）などの機能を提供しており、高速なパフォーマンスを実現します。
一方で、Ghostはサーバーサイドレンダリングを採用しており、パフォーマンスが低下することがあります。

不具合

Ghostでは、画像の最適化に問題があり、元の画像よりもはるかに大きなサイズの画像を生成してしまうことがあります。 これにより、現在のストレージ容量が元の約30倍になってしまっています。

Markdown

長い間ブログを管理してきたため、移行性やバックアップの観点から、Markdown形式で記事を管理することを望んでいます。 前回、WordPressからGhostへの移行も行いましたが、記事の移行には膨大な時間がかかりました。 今後は、デザインや機能の変更があっても、Markdown形式で記事を管理することで、移行がより容易になります。

リニューアルのプロセス

技術的な詳細に焦点を当てつつ、リニューアルプロセスをどのように行ったかをお話しします。

プロセスの概要

リニューアルの第一歩として、私たちは既存のGhostブログから全てのコンテンツをAPIを通じて取得しました。
この作業には、プログラミング言語Kotlinを使用し、効率的な並列処理を行うことで、200記事をわずか数秒でMarkdown形式に変換しました。
同時に、記事に含まれる画像ファイルも保存しました。

詳細な変換とダウンロード

このステップでは、特に並列処理の利点を活かすことが重要です。
並列処理により各記事の変換とダウンロードを同時に行うことで、作業時間を大幅に短縮することができました。
Kotlinの非同期処理機能を使い、APIからのデータフェッチとその後のデータ変換を効率的に行いました。

記事の修正と調整

Markdown形式への変換後、ほとんどの記事は問題なく再利用可能でしたが、一部には手動での修正が必要でした。
特に、WordPressからの移行記事に見られた形式の問題(行が改行されすぎているなど)が主な修正点でした。
これは、元のフォーマットの違いに起因します。手動での修正作業は時間がかかるものの、記事の質を保つためには欠かせないステップです。

新しいブログの構築

全ての記事の変換と修正が完了した後、私たちはNext.jsを使用して新しいブログを構築しました。
Next.jsの利点は、サーバーサイドレンダリングを利用した高速なページロードと、豊富なカスタマイズオプションです。
これにより、ユーザーにとってより快適でパーソナライズされた閲覧体験を提供することが可能になりました。

結論

このリニューアルにより、ブログはより現代的でユーザーフレンドリーなものに変わりました。
技術的な挑戦もありましたが、それを乗り越えることで、より良いユーザー体験を提供するブログへと進化を遂げることができました。
今後もNext.jsを利用し、継続的にブログを改善していく予定です。