React Tokyo ミートアップ #13 参加レポート - フロントエンド開発者のための「厄払い」

こんにちは!DXビジネス開発部の澤です。普段は医療系プロダクトのPjMやエンジニアまた技術広報として活動しています。

2026年1月23日に開催された「React Tokyo ミートアップ #13」に参加してきました。 当社からは、メイントークとして高橋が『フロントエンド開発者のための「厄払い」』というテーマで登壇させていただきました。

React Tokyoは、Reactやフロントエンド技術に興味を持つエンジニアが集まるコミュニティで、定期的にミートアップやカンファレンスを開催しています。 当社もReact Tokyoのコミュニティスポンサーとしてご支援させていただいており、先月は当社コミュニケーションポータルでもReact Tokyoミートアップを開催させていただきました。こうしたコミュニティ活動を通じて、エンジニア同士の知見共有や交流の場を提供できることを嬉しく思っています。

私自身も何度も参加させていただいていますが、毎回新しい学びがあり、エンジニアとして成長できる貴重な機会となっています。

本記事では、セキュリティをテーマにしたメイントークに加え、グループディスカッションやLT(ライトニングトーク)など、盛りだくさんの内容となった今回のミートアップの様子を紹介いたします!

メイントーク:フロントエンド開発者のための「厄払い」

当社の高橋が登壇したメイントークは、2025-2026年に発生したフロントエンド開発に関わる重大なセキュリティ脆弱性を「厄」に見立て、その対策を「厄払い」として紹介するという内容でした。

speakerdeck.com

登壇内容の紹介

発表では、npm サプライチェーン攻撃「Shai-Hulud」による複数のパッケージ侵害、CVSS スコア 10.0 という React Server Components の深刻な脆弱性、pnpm の Git 依存関係における問題など、私たちが日常的に使用しているツールやフレームワークで発見された脆弱性を紹介しました。深刻な脆弱性の報告が続いており、その深刻さや対策について改めて理解することができました。

対策として多層防御(Defense in Depth)の考え方を紹介しました。開発環境での audit 実行や lock file の固定、CI/CD での SBOM や SAST によるスキャン、デプロイ時のセキュリティヘッダー設定や WAF、そしてリアルタイム監視といった、各層での対策を組み合わせるアプローチです。

一度に全てを実装するのは現実的ではないため、段階的に取り組むことが推奨されていました。まずは基本的な audit 実行とチーム内での情報共有から始め、次に Dependabot や Renovate を有効化、そして徐々に自動スキャンを拡充していくという流れです。

「全てを防ぐことはできませんが、リスクを減らすことはできる」という言葉が印象的でした。フロントエンジニアだからこそできる脆弱性対策もあると思いますが、それぞれの領域で得意な人に手伝ってもらいながらプロダクト全体のセキュリティ対策を進めることが重要です。

感想

特に最近はフロントエンドに関わる脆弱性の報告が多く、対応に疲弊している方も多いかと思います。インシデントを防ぐためには、最新の情報に気を配って素早く取り入れていくことが重要だと改めて実感しました。

また、フロントエンドエンジニアだけが気を配るのではなく、プロダクト全体として多層防御という意識を醸成していくことの重要性を感じました。開発者、インフラ、セキュリティチームが連携し、それぞれの層で適切な対策を講じることで、より堅牢なシステムを構築できるのだと思います。

発表の中で紹介されていた段階的なアプローチは、すぐにでも実践できる内容で、チーム内で共有して取り組んでいきたいと思いました。高いセキュリティを保ち続けることは一朝一夕には実現できませんが、小さな一歩から始めることで、着実にリスクを減らしていけるという希望を持ち「厄払い」を進められるといいなと感じました。

グループディスカッション

メイントークの後は、「最近遭遇したバグ、または思い出に残っているバグは?」というテーマでグループディスカッションが行われました。

実際の現場で起こしたバグなどを、グループワークで一緒になった方からお聞きできて非常に興味深かったです。

特に印象に残ったのは、TanStack QueryのrefetchOnReconnectがデフォルトでtrueになっていたことで発生したバグのお話でした。デフォルト設定の挙動を理解することの重要性を改めて認識させられました。

私からは、PDFをアップロードするアプリを作成した際に遭遇したバグについてお話ししました。AWS WAFに設定されていたルールの影響で、特定のPDFファイルがアップロードできないという問題が発生したのです。最初はアプリケーションコードの問題だと思い込んでいましたが、実際にはインフラ層のセキュリティルールが原因でした。問題の切り分けの難しさと、システム全体を俯瞰する視点の大切さを学んだ事例でした。

他にも、様々なバグに関する話をお聞きできて、興味深い内容ばかりでした。他の方の経験から学ぶことで、自分が将来同じような問題に遭遇したときの引き出しが増えたように感じます。

ライトニングトーク

イベントの最後には、useEffectEventや個人開発されているプロダクトの話、oxlintに関する話など、複数のLTが行われました。

中でも印象に残ったのが、RustベースのJavaScript/TypeScriptリンターである「oxlint」についての発表です。

speakerdeck.com

  • ESLintのルールをサポートしており、パフォーマンスが非常に優れている
  • ゼロコンフィグで使い始められる手軽さ

といった部分がポイントだなと感じました。

懇親会では実際に動作している様子を見せていただきましたが、その爆速ぶりには驚きました。大規模なプロダクトでも快適に使えそうで、ぜひ導入を検討したいと思います。

おわりに

React Tokyo ミートアップ #13では、セキュリティ対策からバグの共有、最新ツールの紹介まで、幅広いテーマについて学び、議論することができました。

特にメイントークでの多層防御の考え方は、フロントエンド開発だけでなく、システム全体のセキュリティを考える上で非常に参考になりました。また、グループディスカッションやLTを通じて、コミュニティの皆さんと交流できたことも大きな収穫でした。

React Tokyoコミュニティの皆さま、運営の皆さま、ありがとうございました。次回のイベントも楽しみにしています!

オプティムでは、ReactやNext.jsを利用したアプリケーションを開発しています。ご興味のある方は、ぜひ一度ご連絡ください。

www.optim.co.jp

React Tokyo フェス 2026 に参加します!

最後にお知らせです。2026年2月28日(土)に開催されるReact Tokyo フェス 2026に、当社フロントエンド推進室のメンバーがポスターセッションで参加させていただくことになりました!

当日は、私たちの取り組みや技術的な知見を共有できればと思っています。ご興味のある方は、ぜひポスターセッションでお声がけください!