Next.js + Newt + Vercelで作る技術ブログ

2022.04.20

はじめに

はじめまして、@zsp2088dev です。
以前に「Nuxt.js + Contentful + Netlify」で技術ブログを作成しましたが、あまり使うこともなく2年ほど経過してしまいました。

最近では、業務で記事を書く習慣がつき、これなら個人の技術ブログも続きそうだと思ったことから技術ブログをリニューアルすることに決めました。実際に作成してみて、まだまだ未完成ではありますが、少しずつ改修を加えてよりよいものに仕上げていきたいと思っています。

本記事では、本技術ブログで使用している技術や今後導入したい機能などについて紹介します。

本技術ブログで使用している技術について紹介します。

技術ブログは以前作成したものと同じようにヘッドレスCMS + SGに対応したフレームワームで構築することに決めていました。
フロントエンドにNext.jsを採用した理由としては、Nuxt.jsの経験があるため別のフレームワークを使ってみたかったからです。

（正直なところ、あまり調査はしていないです 🤫）

UIフレームワークはChakra UIを採用しました。
少しだけ試してみたところ、素のCSSを書かないでよいところが魅力的であり、ドキュメントも読みやすかったのが好印象でした。

Newtは最近リリースされたヘッドレスCMSです。

Newt上でコンテンツを作成、APIリクエストを送ることでコンテンツ取得をすることができるため、自分でサーバーを管理しなくてよいのが特徴です。現状では、無料枠でも十分に活用することができ、モデルの作成数にも制限がないのが非常に嬉しいです。

個人でNext.jsのホスティング先を探すならVercelでよさそう〜といったふんわりとした理由でVercelにしました。
Next.jsの開発元はVercelであるため、非常に相性がよいです。

Webサイトを自分自身で制作することのメリットの1つに自分好みに仕上げることができることが挙げられます。
本技術ブログもまだまだ製作途中であり、今後こういう機能が欲しいなというものもいくつか考えているところです。

現状では、今後実装したい機能や修正したい箇所などをGitHubのissueにまとめています。

(ひとりで開発するのにgood first issueとは...? 🫠)

また、下記図のように、それぞれのissueには目的 / 概要 / 参考をざっくり記述しています。
今後は、実装していきたいものをissueを見ながら作成していく予定です。

Next.js + Newt + Vercelを使用して技術ブログをリニューアルしました！ 🔨

今後は本記事を定期的にメンテナンスし、機能を追加しながら少しずつ成長させていけたらなと思っています。
最後まで読んでいただき、ありがとうございました！ 😑