blogブログをNext.jsへ移行しました2021-03-02by@wapa5pow3年ほど前からwapa5pow.comのドメインでブログをNetlify上のGatsbyで構築していましたがVercel上のNext.jsに移行しました。当時はMarkdownで書いてGitHubにプッシュするだけでデプロイされて書きやすかったのですが、やりにくい点が多々でてきました。Deckなどの埋め込みがしずらいOGPの画像を自分で作成しなければいけないMarkdownのメタデータにカテゴリを入れるところがあり無駄なものを考えなければいけないなどです。以前Zennのエディタをローカルで動かしたときに編集しやすくこれと同じような感じでローカルで楽しくブログを書きたいなと思い構築しました。Reactも最近触っていて、VueよりTypeScriptへの親和性が高いのでReactでやることに決めました。その中でZennもNext.jsを使っており開発体験もよさそうなのでNext.jsを選びました。構築してみて結構編集しやすいので気に入っています。このブログは以下な感じで構築してあります。TypeScriptのテンプレートを使いましたソースコードのシンタックスハイライトはremark-highlight.jsを使用して、ソースコードのタイトルはremark-code-titlesを使っています。OGP画像生成にはcatchy-imageを使っています。作者のブログで使い方がわかります。既存のブログとはパスがかわったのでここを参考に既存のパスを新しいパスへとリダイレクトしています。Analyticsはここを参考にしています。titleと実行すると_post以下に次のようなテンプレートを生成されるようにしてあります。'2021-03-02T14:10:05.881Z'---これで書きたいことに集中できるブログ環境が整いました。ブログは盆栽だと思っているのでこつこつ整えていきたいと思います。表示も爆速になって最高です。Workerが記事をとっていました。Workerは記事がないと判定してうまく記事が表示されませんでした。これに対応するためここにあるコードをそのままpublic/sw.jsに配置しデプロイしたらなおりました。Workerを削除する対応です。blogHomeAboutTool。