Next.js

どんなツールか

Next.js は Vercel が開発する、React のための「メタフレームワーク」です。2016 年に登場し、React 単体では決まっていなかった部分（ルーティング・レンダリング方式・最適化など）を一式そろえて提供します。

「結局なに？」でいうと、React を実用アプリとして組み上げるための枠組みです。ちなみにこの Tech.TLDR 自身も Next.js で作られています。

特徴・設計思想

Next.js の核は、レンダリング方式を用途に応じて選べることと、構成を規約で固めて迷いを減らすことです。

• 多様なレンダリング：サーバー側で描く SSR、事前生成する SSG、定期再生成する ISR を使い分けられる。
• ファイルベースルーティング：ディレクトリ構成がそのまま URL になり、設定が要らない。
• フロント〜API まで一体：画面と簡単なサーバー処理（API）を同じプロジェクトで完結できる。
• 最適化が標準装備：画像やフォント、コード分割などを自動で面倒見てくれる。

// app/page.jsx — このファイルがそのまま "/" になる
export default function Home() {
  return <h1>Hello Next.js</h1>;
}

得意・不得意

得意なのは、SEO や初期表示速度が重要な Web サイト・サービスです。React の表現力を保ちつつ、サーバーレンダリングや最適化を最初から享受できます。

不得意・注意点としては、開発元 Vercel の環境に最適化が寄りがちなこと、そして SSR/SSG/ISR や独自のルーティングなど 抽象が増える分、学習コストが上がることが挙げられます。

いつ選ぶか（他との違い）

React を採用しつつ、ルーティングやレンダリング、最適化を自分で寄せ集めたくない——そんなときの第一候補が Next.js です。

素の React が「核だけを渡して構成を委ねる」のに対し、Next.js は その上に実戦装備を載せて一体で提供する位置づけです。Angular のような全部入りに近い安心感を、React エコシステムのまま得たいチームに向いています。