Next.js

フレームワーク プログラミング ソフトウェア 2026.05.15 18

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 16

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

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

# Next.js # セキュリティ # CVE

プログラミング フレームワーク ソフトウェア 2026.05.15 17

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

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

# Next.js # Markdown # ドキュメント

プログラミング フレームワーク ソフトウェア 2026.05.15 16

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

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

# Next.js # TypeScript # API

フレームワーク プログラミング ソフトウェア 2026.05.15 19

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

フレームワーク ソフトウェア 2026.05.15 20

Vercelってどこの会社が作ってる？創業から現在までの歴史をわかりやすく整理

Vercelを作っている会社の正体、創業者Guillermo Rauch氏の経歴、ZEIT時代からVercelへのリブランド、Next.jsの誕生、資金調達、AI時代への展開までの歴史を初心者向けに整理します。

# Next.js # Vercel # 会社

フレームワーク ソフトウェア 2026.05.15 20

Vercel の Edge Function と Serverless Function の違いと使い分け｜ランタイム・制約・コールドスタート

Vercel の Edge Function と Serverless Function は同じ`関数` でもランタイム・実行場所・制約が大きく異なります。速度、利用可能な Node.js API、DB 接続、コールドスタート、料金など実務目線で違いを整理し、`どの処理をどちらで動かすか` の判断軸をまとめます。

# Next.js # Vercel # Edge Function

フレームワーク ソフトウェア 2026.05.15 25

Vercelと相性のいい技術まとめ｜DB・認証・AI・CMS・決済・モニタリングを用途別に整理

Vercelと組み合わせやすい技術を、フレームワーク、データベース、認証、AI、CMS、スタイリング、決済、メール、モニタリング、ストレージのカテゴリ別に整理し、用途に合った組み合わせの選び方をまとめます。

# Next.js # Vercel # Supabase

フレームワーク ソフトウェア 2026.05.15 20

初心者が知っておくべきVercelの基礎用語まとめ｜Project・Deployment・Environment・Functionを整理

Vercelを初めて触る人向けに、Project、Deployment、Environment、Function、Edge、Domain、Environment Variables、プランなど、最初に押さえるべき基礎用語を実務目線で1つずつ整理します。

# Next.js # デプロイ # Vercel