このサイトについて

何をするサイトか

Next.js でつまずくところは、用語を知らないことではなく、 「この要件のとき、どれを使えばいいのか」が判断できないことに集中しています。 このサイトは、その判断を何度でも練習できる場所を目指しています。

読むだけで終わらせないため、すべての解説の末尾に、その場で解ける問題を置いています。

情報の扱い

• 出典は一次情報だけです。Next.js 公式ドキュメント・公式ブログ・ React 公式・MDN・各種標準仕様に限っています。個人ブログや二次情報を根拠にしません
• 各ページに対象バージョンと確認日を出しています。 単なる更新日ではなく、そのバージョンで実際に内容を確かめた日という意味です
• コードを含む問題は、実際の Next.js 16.3.3 でビルドして挙動を確かめています。解説と実物が食い違っていたら、解説のほうを直します

どうやって確かめているか

エラーの文言や「このコードはどうなるか」を、記憶や他所の記事から書き写していません。 問題に載せたコードを本物の Next.js 16.3.3 でビルドし、 宣言した結果になるかを毎回照合しています。食い違ったら公開できません。

この仕組みで実際に何度も間違いが見つかっています。たとえば、 広く書かれている「エラーの文言」が現在のバージョンでは別の文だったこと、 「NEXT_PUBLIC_ が付いていない環境変数はブラウザに出ない」という説明が、 プリレンダーされた HTML では成立しないこと。どちらも実物を見るまで気づけませんでした。

ビルドでは確かめられないもの（hydration の不一致など）は、何をどう確かめたかをページに書いて出しています。 検証の程度を読む人から隠さない、という方針です。

いま扱っている範囲

Server Component と Client Component の境界に集中しています。 ここは Next.js でつまずく場所が集中していて、しかも 「動いてしまうから気づけない」種類の誤りが多いところです。

レンダリングやキャッシュ、Pages Router からの移行は、 この範囲を厚くしたあとに広げます。手を広げて薄くするより、 1つの範囲で確実に頼れるほうが役に立つと考えています。

広告について

運営費のために、解説とエラー辞典のページに Google AdSense の広告を出しています。 問題を解いている最中の画面には広告を出しません。判断の邪魔になるためです。 広告の有無で解説の内容を変えることはありません。 Cookie の扱いはプライバシーポリシーに書いています。

間違いを見つけたら

お問い合わせから教えてください。 どのページのどの記述かを書いていただけると助かります。

資格ではありません

このサイトの問題やテストは、公的な資格や認定とは一切関係のない、独自のものです。 結果が何かを証明するものではありません。

商標について

Next.js は Vercel, Inc. の商標です。当サイトは Vercel, Inc. と提携していません。