KAKAMU
BlogTag

個人ブログの技術的変遷

そもそも

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

それがなぜ一つの最適解と言えるのか、なぜReactやNext.jsが現在の方向へ舵を切ったのか、そのあたりを直感的に理解するには、WEBフロントエンドの技術的変遷を理解している必要がある。

そこでWEBフロントエンドの技術的変遷をほぼ追随してきた athlingual.com の技術的変遷を大まかに振り返ってみる。

HTML・CSS・jQuery

  • 2017年〜2018年
  • HTML・CSS・jQueryから始める
  • レンタルサーバーにアップロード

Express・EJS

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

Vue.js

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

Nuxt

  • 2018年〜2019年
  • Nuxt（v2）に移行する（SSR・Static Export）
  • データをContentfulで管理する

Gatsby

  • 2019年
  • ReactとGatsbyに移行する（SSG・JAM Stack）
  • データをMarkdownで管理する
  • GraphQLを初めて学ぶ
  • Algoliaを一丁前に組み込む

Next.js（Pages Router）

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

Next.js（App Router）

  • 2023年〜
  • App Routerに移行する（v13）
  • MUIを使用する

React 19・Next.js 15

  • 2025年
  • React 19・Next.js 15にアップデートする
  • Turborepoで複数の個人サイトをモノレポ化する

感謝

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

感謝感謝。

#IT