クラウドワークス エンジニアブログ

日本最大級のクラウドソーシング「クラウドワークス」の開発の裏側をお届けするエンジニアブログ

Vue Fes Japan 2023 参加レポート

フロントエンド 登壇 発表資料 イベント

アイキャッチ：Vue Fes Japan 2023 参加レポート

皆様こんにちは。クラウドソーシングサービス「クラウドワークス」（以下crowdworks.jp）にてエンジニアをしております@okuto_oyamaです。今回は、10月28日に開催されたVue Fes Japan 2023の参加レポートをお届けします。

久々のオフライン開催

Vue Fes Japan 2023 会場に設置されていたクリエイティブウォール。中央に Vue Fes Japan のロゴが書かれてあり、その周辺に多くの企業ロゴや個人により書き込まれている。

2018年以来、台風や新型コロナウイルスの影響でオフラインでの開催が叶わなかったVue Fes Japanが、今年ついに対面でのカンファレンスとして戻ってきました。昨年は完全なオンライン形式で開催されましたが、久々にオフラインのイベントに参加できたのは、感慨深いものがありました。

フロントエンドの大規模カンファレンスへの参加が久しぶりだったので、多くの人々が集まる様子、各企業のスポンサーブースでの交流、ランチセッションなど、オフラインならではの体験ができたことはとても懐かしく感じました。

同時通訳スポンサーの協賛

今回、株式会社クラウドワークスは「同時通訳スポンサー」として協賛しました。

Evan Youをはじめとする英語を話す登壇者の発表を、日本語と中国語にリアルタイムで通訳するサービスが提供されていました。オフラインでの登壇という形式で行われたリアルタイム発表は、英語が苦手な方々にも理解しやすいよう配慮されていたため、大変ありがたく感じました。

3名の社員が発表・登壇

以前告知ブログでお伝えした通り、弊社のエンジニア、@t0yohei、@yamanoku、そして@53ableがそれぞれ登壇し、発表を行いました。

@t0yoheiは「Vue.jsを使ってGrid Systemを実装した話」というテーマで発表しました。

speakerdeck.com

crowdworks.jpのデザインシステムにおけるコンポーネントライブラリではGrid Systemのアプローチを取り入れたコンポーネントを開発しており、その実装方法についてライブコーディングを交えて紹介しました。

t0yoheiの登壇写真
@t0yohei

@yamanokuは「画面遷移から考えるNuxtアプリケーションをアクセシブルにする方法」について発表しました。

yamanoku.net

クライアントサイドのルーティングで起こる画面遷移のアクセシビリティの問題点を、スクリーンリーダーを使用したデモを通じて指摘し、解決策の実装方法を紹介しました。

yamanokuの登壇写真
@yamanoku

@53ableは「SOLID原則に基づくSFC実装」というテーマで登壇しました。

https://slides-one.vercel.app/

SOLID原則の各項目をVue.jsのSFC（Single File Components）でどう実現しているかについて解説しました。これは私たちのVue.js実装においても、原則に沿った手法を採用していることから得られる洞察でした。

53ableの登壇写真
@53able

パネルディスカッションでは、@yamanokuが参加し、Vue.jsの導入がもたらした各社でのよかった点や、これからのエコシステムへの期待について話しました。

パネルディスカッションで @yamanoku、@miyaoka、@ushiro_noko、@kazu_pon、@wattanx、@takanoripe がトークしている様子
左から @yamanoku、@miyaoka、@ushiro_noko、@kazu_pon、@wattanx、@takanoripe

余談ではありますが、登壇者控え室でSebastien、Daniel、Anthonyといった著名な参加者たちと同席した時の緊張感も、個人的には際立った思い出でありました。

Vue.jsコミュニティ発で広がってきた多様なセッション

Vue Fes Japan 2023では、Vue.js、Vite、Nuxt.jsなどVueコミュニティから生まれたOSSに関する発表も目立ちましたが、Vue.jsに限定されない様々なセッションが行われたことが特に印象的でした。

Vue.jsのLanguage ToolであるVolar.jsは現在、Astroのコアコミッターも参加してAstroでも使用されていること*1、Viteを基にしたJavaScriptのマルチスレッド処理に関する発表があったこと*2、デスクトップアプリケーションでのVue.jsの使用例*3や、SvelteでのESLintプラグインでの実装アイデアをVue.jsのESLintプラグインでも応用できないか考えられていること*4などの発表がされていました。

また、ViteはSvelteKitやRemixでのサポートが広がっており、ViteのSSRプラグインプロジェクトであるVikeを通じてReact.jsほか各種フレームワークのSSRにも対応しています。

Nuxt.jsにおいては、UnJSというJavaScriptユーティリティライブラリを中心に構築されており、Vue.jsやNuxt.js特有の環境でのみ動作するわけではなくなっていることが示されました*5。

Vue Fes Japan 2023を終えて

アフターパーティーの後、Evan Youによる一本締めでVue Fes Japan 2023は締めくくられました。

2018年に初めてVue Fes Japanに参加して以来、2022年のオンラインカンファレンスと、今年のオフラインカンファレンスにも参加しました。発表以外においても毎年参加者が楽しめるようなコンテンツがあり、登壇者としても参加者としても、クオリティの高いカンファレンスで充実した時間を過ごせました。

そんなカンファレンスを今年も運営してくれたVue.js日本ユーザーグループとボランティアスタッフの皆さんに心から感謝を申し上げます。

クリエイティブウォールにクラウドワークスのロゴが書かれており、当日参加した社員でそのマークを指さしながら記念撮影している様子
当日参加した株式会社クラウドワークス社員

今回、株式会社クラウドワークスではスポンサーと社員3名による登壇・発表でVue.jsコミュニティに貢献することができました。引き続きVue.jsとそのエコシステムを活用した開発とそこから得られた知見を通じて、コミュニティやOSSへの貢献を続けていきたいと思っています。

ここまでご覧頂きありがとうございました。来年のVue Fes Japanも楽しみにしています！

*1:Vue Language Server から生まれた Volar.js と、それが秘める可能性 - Speaker Deck

*2:マルチスレッドフレンドリーなJavaScriptを求めて - Slidev

*3:Vue3/Electronで自作したマークダウンエディタをVue3/Tauriにリプレイスした話 - Speaker Deck

*4:eslint-plugin-vue の現状と今後

*5:Deep Dive to UnJS and Nuxt 3 - Speaker Deck

© 2016 CrowdWorks, Inc., All rights reserved.