Vue Fes Japan 2025 参加レポート
Vue Fes Japan 2025 とは？
Vue Fes Japan 2025 は、国内最大級の Vue.js カンファレンスです。
毎年、フロントエンドエンジニアを中心に数百名が集まり、Vue の最新動向や実践的な知見、そしてコミュニティならではの熱量を丸一日かけて共有し合う、まさに “Vue のお祭り” ともいえるイベントです。
今年の会場は 大手町プレイス ホール＆カンファレンス。オフラインならではの一体感や、あちこちで自然に生まれる交流の輪がとても印象的でした。
まずは、イベントの世界観がわかるオープニングムービーをどうぞ↓
https://www.youtube.com/watch?v=EEtb0-fdMaE
本記事では、当日参加したセッションの内容や、会場で感じたことをまとめていきます。
1：Vueのバリデーション、結局どれを選べばいい？ ― 自作バリデーションの限界と、脱却までの道のり ― （岩本）
【概要】バリデーション迷子からの卒業！自作からVee-Validateへの道
このセッションでは、株式会社デザインワン・ジャパンの谷本結さん（ねぎなすさん）が、Vue 3ベースのプロダクトにおける自作バリデーションの限界と、ライブラリへの移行プロセスについて発表されました。
長年使い続けてきた自作バリデーションは、ドキュメント不足や仕様のばらつきにより保守性が低下し、開発者が既存実装を探すだけで時間を費やす"バリデーション迷子"が常態化していました。こうした技術的負債を解消するため、Vuelidate、Vee-Validate、Zodなどの主要ライブラリを、技術的前提条件（OptionsAPIとCompositionAPIの混在が可能か、TypeScript対応など）と評価指標（ドキュメントの充実度、学習コスト、コミュニティの活発さなど）を基準に比較検討し、最終的にVee-Validateを採用されました。
また、ライブラリ選定方法だけでなく、自作バリデーションから移行する際の実践的な課題と解決策が紹介されました。既存実装との重複チェック、カスタムルールの標準挙動との整合性確保、ドキュメント自動生成による重複防止など具体的に語られ、実務に役立つヒントが満載でした。
【感想】運用まで考えてこそ、本当に役立つ技術選定
特に印象に残ったのは、ライブラリ導入後の課題への向き合い方でした。
Vee-Validateを導入して"バリデーション迷子"が解消されたと思いきや、今度は「すでにvee-validate/rulesやカスタムバリデーションを重複して作成しないようにする工夫が必要」という新たな課題が浮上したという点です。そしてその解決策として、ルールごとに作成したらコマンド1つでカスタムルールの内容が書かれているマークダウンファイルが生成され、それ自体がドキュメントになるような仕組み作りを行っているとのことでした。ライブラリを導入するだけでなく、その後の運用まで見据えた取り組みに感銘を受けました。
現状、弊社のプロダクトではそれほど多くのバリデーションがあるわけではありませんが、今後プロダクトが成長していく中で同様の課題に直面する可能性は十分にあります。弊社でもVee-Validateを採用する可能性が高いと考えられますが、同じように「基本はVee-Validateの標準バリデーションを使いつつ、カスタムが必要な場合はそのバリデーションの内容が簡単にわかるようなドキュメントを自動生成できる仕組み」を最初から整えておくことが重要だと感じました。
ライブラリ選定という技術的な判断だけでなく、導入後の運用設計の重要性を改めて認識させてくれる貴重な機会となりました。
2：VueはAIに弱い？そんなの都市伝説です（角田）
https://speakerdeck.com/lmi/vuefes2025-link-and-motivation
【概要】「VueはAIに弱い」なんて本当？実践で分かったリアルなAI活用
今回取り上げるセッションは、「VueとAIは相性が悪い」という“都市伝説”を否定することをテーマにした内容でした。最近では「生成AIを活用するならReactのほうが向いている」という声を耳にすることもあり、それに引きずられるように「VueはAIに不向きなのでは」と誤解する人が増えているのではないかと懸念されていました。登壇者自身もこの誤解に強い違和感を抱いたことから、実際にVueプロダクトで半年間徹底的にAIを活用し、その可能性を証明しようと試みたそうです。
その取り組みの成果として、AIが実装したプルリクエストが全体の60％に達したようです。単なる“コード生成”ではなく、コンポーネントの構築、ロジックやAPI周りの実装、さらにはPRレビューやQAまで、幅広いプロセスをAIと協働しながら進めていく具体的な方法が紹介されていました。
【感想】フレームワークより"どう使うか"が大事だと実感！
今回の話で強く印象に残ったのは、VueかReactかといった技術選択よりも、AIをどう活かすかという観点こそが本質だという点でした。フレームワークの違いが成果を決めるのではなく、問題の分解の仕方、ルール設計、AIに渡すコンテキストの精度など、開発プロセスの組み立てが成否を左右するというメッセージに深く共感しました。
紹介されていたルールや仕組みは、自分たちの現場でも十分に応用できそうで、AI活用による業務効率化につながると感じています。とても参考になる内容でした。
また、AIの進化とともに開発現場が急速に変わっていく中で、表層的なトレンドに振り回されるのではなく、本質を見極めながら柔軟に取り組む姿勢の大切さを改めて実感しました。
3：Nuxt 4 の Singleton Data Fetching Layer で 何が変わるのか（武田）
【概要】Nuxtのデータ取得を賢く設計！Singleton Layerのススメ
「同じキーでも重複リクエストが走る」「keyが変わっても手動でwatchを書く必要がある」「キャッシュを細かく制御しづらい」といった Nuxt のデータ取得周りの課題。これらはSingleton Data Fetching Layerという考え方によって解消できることが紹介されました。
Singleton Data Fetching Layerとはアプリ全体のデータ取得を1つの単一レイヤーに集約することでフロントとバックエンドの境界を明確に保つ考え方です。
本セッションではNuxt3からNuxt4に切り替わるタイミングで強化された同キーを使用した際のデータ共有やリアクティブキー対応、自動データクリーンアップなどの紹介と、Singleton Data Fetching Layerの重要性に関する内容です。
【感想】目の前のコードにもしっかり意味があると再認識できた
ここで印象に残ったのは普段書いているコード1行1行にはきちんと意味があることです。
弊社の内定者育成プログラムにおいてなぜこのコードを書いたのか？メンターに1から説明する時間があります。自分で書いたメソッドやインスタンスの意味を理解した上で、本当に必要な処理を必要な場所に書くことの重要性をここで学びました。
セッション中で登場したref/computed/watchも同じで、refとcomputedはただリアクティブな値をどうにかするためのものではなく、単なる値をリアクティブな箱に入れた状態（＝ref）とその先で値が更新された時に自動で再計算してくれる関数（＝computed）が存在し、2つのメソッドは関連して利用できます。
キー共有や watch の手動制御、キャッシュ設計に関してもuseState/useAsyncDataの使い方によって変化することを理解していれば、Singleton Data Fetching Layerによって明示する必要性が理解できます。
このセッションを通してSingleton Data Fetching Layerがいかに影響力のある重要な設計指針であるかを実感したため、仕組みを深く理解するためにもコードの意図を説明できるくらいまで言語化していきたいと感じる、非常に有意義な時間でした。
仲間と学びを深める社内懇親会
当日の熱気冷めやらぬまま、その夜には懇親会を開催しました。参加したフロントエンドエンジニアのメンバーだけでなく、PM、バックエンドエンジニア、QAエンジニアに加えインターン生まで集まり、普段の業務を離れて語り合う貴重な機会となりました。
私たちのチームは北海道や九州など、さまざまな地域からフルリモートで働く仲間が多く、こうして顔を合わせること自体がとても特別です。いつもはオンラインでしかやりとりのないメンバーとも直接言葉を交わし、仕事とはまた違った一面を知ることができました。
また、日々の業務の合間を縫って登壇準備を進めてきたメンバーの健闘を、みんなでお祝いする時間もありました。「お疲れさま！」や「素晴らしい発表だったね！」といった言葉が飛び交い、準備の苦労やチャレンジが称えられる和やかな雰囲気に包まれました。
参加したセッションの感想や学び、今後チャレンジしたいことについて話が広がり、自然と来年のVue Fesでも再び採択されることを目指して、もっと良いものを一緒につくろうという前向きな気持ちも湧き上がりました。
技術や知識の共有はもちろんですが、こうした対面での交流を通じて、メンバーそれぞれのモチベーションがさらに高まった時間でした。
以上、参加レポートでした！
また、ライトニングトーク枠では 弊社のフロントエンドエンジニア・加藤 も登壇しています。
登壇内容については、別途まとめている以下の記事で詳しく紹介していますのでぜひご覧ください！
https://www.rizap-tech.co.jp/recruit/articles/entries/213
関連する求人情報
