Web Frontend2026-05-17
RSC（React Server Components）
別名: React Server Components / RSC / サーバーコンポーネント
サーバーでのみ実行される React コンポーネント。クライアント JS バンドルにコードが含まれず、DB・ファイルシステムへの直接アクセスが可能。Next.js App Router では デフォルトで Server Component として動作する。
概要
RSC は 2023 年に React 18 と Next.js App Router で安定版として提供開始されました。Server Component はクライアントに JS を送らず、データフェッチをサーバー側で完結させます。`'use client'` ディレクティブを付けたコンポーネントのみがクライアントサイドで動作します。
Suspense・Streaming との連携
RSC は Suspense と組み合わせて Streaming SSR を実現します。データフェッチ中のコンポーネントはフォールバック UI を表示し、準備ができたものから順次クライアントに送信されます。これにより TTFB を短縮しながら逐次表示が可能です。
関連コラム
Web Development
Vercel + Next.js 16でWebサイトを構築する完全ガイド【2026年版】
2026年、Next.js 16とVercelを使ったWebサイト構築は、Turbopackによる400%高速化、React Server Components、v0 AI生成により劇的に進化しました。月額$20から始められる本格的なWeb開発環境の全貌を解説します。
Web Development
Hono + Inertia + React で作る次世代フルスタック 2026年版 — Next.js でも Remix でもない第三の選択肢
Hono（超軽量Webフレームワーク）+ Inertia.js（サーバ駆動SPAアダプタ）+ React の組み合わせは、Next.js でも Remix でもない第三のフルスタック構成として2026年に注目されています。本記事ではスタックの全体像、各層の役割、Next.js / Remix / Laravel + Inertia との比較、向く案件・向かない案件、Cloudflare Workers / Bun / Node の使い分けを実務目線で整理します。
Web Development
Hono + Inertia + React のフォーム＆CRUD実装パターン — Drizzle ORM・Zod・Inertia useForm を組み合わせる【2026年版】
Hono + Inertia + React で業務アプリの主役である CRUD・フォームをどう書くか。Drizzle ORM での DB 接続、Zod による型と入力検証の一気通貫、Inertia の useForm を使ったエラー表示・リダイレクト・フラッシュメッセージまで、実装パターンを実務目線で整理します。
関連用語
お気軽にご相談ください
お問い合わせ