engineer.notes

try / verify / log

2026.07.26

engineer.notes
engineer.notes // programming, servers, networks, security, AI — engineer's working notes, indexed for later lookup.
検索
タグ

Next.js

Next.js に関連する記事をまとめています。

プログラミング ソフトウェア セキュリティ 2026.07.04 42

Clerkとは？UIまで用意された認証サービスと、認証の選び方

Clerkとは何かを、UIまで用意された認証サービスという観点と、認証の選び方から整理します。Clerkは、サインイン画面やユーザー管理画面、ソーシャルログイン、多要素認証、組織機能などを、コンポーネントを置くだけで導入できるマネージド認証サービスです。自前で作ると重い認証まわりを一気に省けるため、MVPやSaaSの立ち上げで人気です。無料枠や料金の考え方、Auth.js（NextAuth）やBetter Auth、Supabase Authとの選び分け、データの持ち方やロックインの注意点まで、AIに認証を含む構成を渡された人にも役立つよう解説します。
# Next.js # 認証 # SaaS
フレームワーク 2026.07.04 44

AstroとNext.jsはどっち？用途別の使い分けを判断軸で整理

AstroとNext.jsのどちらを選ぶかを、用途別の使い分けとして判断軸で整理します。ざっくり、コンテンツ中心の軽いサイト（ブログ・LP・ドキュメント・コーポレート）はAstro、アプリのように動的なプロダクト（SaaS・管理画面・EC）はNext.jsが基本です。両者の設計思想の違い、性能（送るJSの量）、開発体験、判断チェックリスト、迷いやすいケースまで、実務目線でまとめます。
# Next.js # React # フロントエンド
フレームワーク プログラミング ソフトウェア 2026.05.15 80

Server Actions とは何か？Next.js / React で 「フォームから関数を直接呼ぶ」 仕組みと API Routes との違い

Server Actions は Next.js / React の新しい仕組みで、「サーバで実行される関数をクライアントから直接呼べる」 機能です。「use server」 宣言とフォームの action 属性を組み合わせて、API Routes を書かずにサーバ処理を呼べるため、フォーム送信や CRUD が大幅にシンプルになります。仕組み、API Routes / tRPC との使い分けを整理します。
# Next.js # React # App Router
フレームワーク ソフトウェア セキュリティ 2026.05.15 115

Next.js 2026年5月セキュリティリリースまとめ｜13件の脆弱性とアップグレード手順

2026年5月に Vercel が公開した Next.js セキュリティリリースは、認可バイパス・SSRF・XSS・DoS・キャッシュポイズニングを含む 13件の脆弱性を一括修正しました。「WAF では完全対策にならない、パッチングが唯一の方法」 と公式が明言しており、緊急アップグレードが推奨されます。修正内容、推奨バージョン、移行手順を整理します。
# Next.js # セキュリティ # CVE
プログラミング フレームワーク ソフトウェア 2026.05.15 114

MDX とは何か？Markdown + JSX を組み合わせる仕組みと Next.js / Astro での使い方

MDX は Markdown の中に JSX(React コンポーネント)を埋め込めるドキュメント形式です。技術ドキュメント / ブログ / 製品 LP / 学習教材などで、「普通に書くテキスト」 と 「動くコンポーネント」 を1ファイルで両立できるのが特徴です。Next.js / Astro / Docusaurus での使い方と、Markdown だけで足りないときの判断軸を整理します。
# Next.js # Markdown # ドキュメント
プログラミング フレームワーク ソフトウェア 2026.05.15 97

tRPC とは何か？TypeScript で型安全な API を作る仕組みと REST / GraphQL との使い分け

tRPC は TypeScript で 「スキーマ生成も OpenAPI もなしで、サーバとクライアントが完全に型共有する API」を作るためのライブラリです。Zod での入力検証、React Query との統合、Next.js / モノレポでの典型構成、REST / GraphQL との使い分けまで、「なぜ流行ったのか」 を実務目線で整理します。
# Next.js # TypeScript # API
フレームワーク プログラミング ソフトウェア 2026.05.15 123

React Server Components(RSC)とは何か？仕組み・Client Components との違い・Next.js App Router での使い方

React Server Components(RSC)は、サーバ側で実行され HTML として返ってくる新しい React コンポーネントの種類です。クライアント JS を出力せず DB や API を直接叩ける一方で、「useState」 等は使えません。Client Components との違い、「use client」 境界、Next.js App Router での使い方、データ取得・キャッシュの考え方を整理します。
# Next.js # React # App Router