創発的なコミュニケーションが生まれる新感覚の一日！React Tokyo フェス 2026 イベントレポート

皆さんこんにちは。花谷（@potato4d）です。

今回は2月28日に開催された React Tokyo フェス 2026 について、LINEヤフーとしてスポンサーを行いました。本記事では、イベント本編やスポンサーブースの様子についてお伝えします。

React Tokyo フェス は、React Tokyo コミュニティが主導する、React をテーマとしたお祭り型のカンファレンスです。

一般的なトーク中心のカンファレンス形式とは異なり、参加者同士の交流を主軸に置いた設計が特徴で、デイフェスとナイトフェスの2部構成となっています。

ポスターセッションなど見ることも交流することも可能なコンテンツに加え、その場で話題を作り議論していくフィッシュボウル・ディスカッションも開催。新しい試みが中心ではありながら、React 入門者から経験者まで楽しめる間口の広さも魅力的なイベントです。

LINEヤフーとReact

LINEヤフーでは、「Yahoo! JAPAN トップページ」をはじめとするさまざまなプロダクトで React を使用しています。

直近の利用状況としては、2024年末に実施した社内アンケート では React がトップの採用率。また、 React プロジェクトのうち9割が Next.js を併用している状況です。

プロジェクトでの活用以外で、過去にはReact.jsの公式日本語ドキュメントの翻訳に社員が携わるなど、何かと縁の深い技術となっています。

そういった経緯を踏まえ、新たに生まれた React のみにディープに浸ることができる場を応援していく意図を込め、今回 React Tokyo フェス 2026 に協賛する運びとなりました。

コンテンツレポート

まずはデイフェスの様子について、いくつか現地参加メンバーの感想をピックアップします。

React エンジニア向け SolidJS 解説

React との対比を軸に SolidJS の仕組みや設計思想を解説したポスターセッションです。

React を前提とした説明構成になっているため、差分として SolidJS の特徴が自然と浮かび上がる形になっており、普段 React を書いているエンジニアにとって非常に入りやすい内容でした。

(by りっくん)

ライブコーディングコンテンツ

約30分で X（旧Twitter） のクローンを構築するというライブコーディングセッションです。

AI を活用したいわゆる Vibe Coding のスタイルで進められており、短時間でアプリの骨格が出来上がっていく様子が印象的でした。現場では浸透してきている Vibe Coding ですが、こういったイベント会場などでの活用は珍しく、実際に手を動かしている場面を見ることで、より身近に感じる機会となった方も多そうに感じました。

(by りっくん)

React Compiler 時代のパフォーマンスチューニング

React Compiler 導入時に発生しうる注意点を紹介するポスターセッションです。

自動 memo 化をオフにする方法の紹介など、実際に導入する際につまずきやすい箇所が丁寧に取り上げられており、わかりやすい内容でした。

(by l1lhu1hu1)

Zod v4 リリースによる新機能活用法を考える

Zod v4 で追加された新機能を活用して、既存の処理をどう書き換えられるかを紹介するポスターセッションです。

Top-level string format を使うことで処理をシンプルに記述できる点が印象的で、v3 と v4 で同じ処理を比較した構成もあって非常にわかりやすかったです。普段 Zod をあまり使っていなくても、使ってみようかなという気持ちになるポスターセッションでした。

(by l1lhu1hu1)

スポンサーブース

LINEヤフーブースでは、「React AI Review Challenge」という企画を実施しました。

AI によって生成された課題の多い React Component を来場者とともに AI を活用して修正していく催しで、ブラウザの機能が関わる部分のクリーンアップやエラーハンドリング、状態の設計など様々な問題に対する修正案をプロンプトとして受け取って実行していきました。

全8つの課題を多くの来場者の方に修正いただいただけでなく、よりよいコーディング手法についての意見貢献や、AIが意図せず混入させてしまったバグの修正なども発生し、React Tokyo フェス 2026 のイベント本編と同じく、創発的なコミュニケーションが発生する場となりました。

また、今回ブースにて実施したレビュー企画については、後日作問者による解説記事を公開予定です。想定する課題とその対応方法、レビュー用の Skill について詳細を解説予定ですので、ぜひ以下コードの修正に挑戦してみてください。

全8つ、React Compiler は導入されていない環境を想定しています。

import React, { useState, useEffect } from 'react';

type Props = {

userId: string;

onUpdate: (data: any) => void;

}

export const UserProfile: React.FC = ({ userId, onUpdate }) => {

const [data, setData] = useState(null);

const [loading, setLoading] = useState(false);

const [count, setCount] = useState(0);

useEffect(() => {

setLoading(true);

fetch(/api/users/${userId})

.then(res => res.json())

.then(data => {

setData(data);

setLoading(false);

});

}, []);

useEffect(() => {

const timer = setInterval(() => {

setCount(count + 1);

}, 1000);

}, [count]);

const handleClick = () => {

onUpdate(data);

};

const userAge = new Date().getFullYear() - new Date(data.birthDate).getFullYear();

return (

User Profile

{loading && Loading...

}

{data && (

Name: {data.name}

Age: {userAge}

Count: {count}

Update

)}

);

};

スポンサーセッション『Layout as a Data - React のコンポーネントをデータレイヤーへ拡張する』

また、今回はランチタイムにスポンサーセッションとして登壇も行っています。Yahoo! JAPAN スマホ Web の開発を担当する石倉が登壇し、UIのレイアウト情報をデータレイヤーで管理する「Layout as a Data」というアプローチを紹介しました。

五輪や選挙といった国民的イベントに合わせた特設 UI を、既存コンポーネントを活用しながら開発コストゼロで柔軟に提供するための工夫が語られています。

後日 Speaker Deck より公開を予定しておりますので、ぜひそちらも合わせてお楽しみください。

おわりに

React Tokyo フェス 2026 は、ただ初開催というだけでなく、フロントエンド/JavaScript 領域における新しい大型イベントの形への挑戦を体現したお祭りでした。

Agentic Coding によってプログラミング、果てはエンジニアリングに至るまで、その現場が大きく変化を遂げる過渡期の真っ只中。その中でカンファレンスについても、従来の王道の手法だけではない、次の姿を模索したいという意志を強く感じられる一日で非常に新鮮な体験でした。

LINEヤフー株式会社では、フロントエンドをはじめとするさまざまなカンファレンスにスポンサーとして協賛しています。

今後もカンファレンスに参加・協賛した際には、LINEヤフー Tech Blogでのカンファレンスレポートや、XのLINEヤフー TechアカウントやUIT INSIDEにて現地の情報をお届けしていきます。