KAKAMU
BlogTag

個人ブログの技術的変遷

そもそも

React Server ComponentsとNext.js App Routerの登場により、WEBフロントエンドの開発手法およびレンダリング方式が一つの最適解に到達しつつある。

ところが、WEBフロントエンドの技術的変遷をリアルタイムで体験していないと、なぜReactやNext.jsが現在の方針へと舵を切ったのか、それがなぜ一つの最適解なのかを直感的に理解することが容易ではない。

そこで、WEBフロントエンドの技術的変遷を追体験するべく、この個人ブログの技術的変遷を振り返ることにした。

HTML・CSS・jQuery

  • 2017年〜2018年
  • HTML・CSS・jQueryを書きまくる
  • サーバーサイドなし
  • レンタルサーバーにアップロード

Express・EJS

  • 2018年
  • ExpressとEJSに移行してちょっと動的に（古典的なSSR）
  • デプロイ環境はHerokuだったかな（記憶が曖昧）

Vue.js

  • 2018年〜2019年
  • Vue.js（v2）に移行する（SPA）
  • Netlifyを使用する
  • 同時期に業務でAngular（v6）を使用する

Nuxt

  • 2018年〜2019年
  • Nuxt（v2）に移行する（SSR・SSG）
  • Contentfulを使用する

Gatsby

  • 2019年
  • ReactとGatsbyに移行する（SSG・JAM Stack）
  • データをMarkdownで管理する
  • GraphQLを使用する
  • Algoliaを使用した検索機能も一丁前に作る

Next.js（Pages Router）

  • 2019年〜2023年
  • Next.js（v9）に移行する（SSG・SSR）
  • Vercel（当時はZeit）に移行する
  • styled-componentsを使用する

Next.js（App Router）

  • 2023年〜2024年
  • App Routerに移行する
  • MUIを使用する

React 19・Next.js 15・Turborepo

  • 2025年
  • React 19・Next.js 15にアップデートする
  • 個人サイトの数が増えてパッケージ更新が煩雑になっていたのでモノレポ化する

感謝

オープンソース開発に携わる開発者様や企業様には頭が上がらない。

感謝感謝。

#IT