CTO室プラットフォーム開発チームのいがにんこと山口(@igayamaguchi)です。
先日、Vue Fes Japan 2024が開催され、一休は登壇とスポンサーをしました。その紹介をします。
Vue Fes Japan 2024が開催
10月19日(土)に日本最大級の Vue.js カンファレンス、Vue Fes Japan 2024 が開催されました。一休は当カンファレンスでプロポーザル採択による発表と、ランチスポンサーとしてランチセッションでの発表を行いました。この記事ではその発表の概要を紹介します。
一休で行った発表は2つです。
- Vue.js、Nuxtの機能を使い、 大量のコピペコードをリファクタリングする
- Nuxtベースの「WXT」でChrome拡張を作成する
Vue.js、Nuxtの機能を使い、 大量のコピペコードをリファクタリングする
1つ目の発表は自分がプロポーザルを送り採択された発表です。一休.com、Yahoo!トラベルで発生したコピペ問題の原因と解決策の話です。
一休.com、Yahoo!トラベルでは大量のコピペコードが発生していました。それにより何かを変更するときに作業がN倍になってしまい、開発スピードが落ちていました。 今回の発表ではこの問題の原因を紐解き解決していった話をしました。 コピペ問題といっても原因は様々です。ワークフローに問題があったり、コピペが発生せざるを得ない技術的背景があったり。それぞれに対応しています。 内容をざっくり抜き出すと、以下のようになります。
- 開発ワークフローに問題がありUIのコピペが横行していたので、ワークフローの見直し、UIコンポーネントの作成
- デザイン差分を小さくしてコードの統一
- Option APIでロジックが共通化できていなかったので、Composition APIを導入して共通化、さらには責務わけのためのコンポーネント分割
詳細は発表資料をご覧ください。
Nuxtベースの「WXT」でChrome拡張を作成する
2つ目は新規プロダクト開発部の星野によるランチセッションでの発表です。「WXT」というOSSを使用し、Chrome拡張を作成してみた話です。
何かを便利にしようとChrome拡張を使おうと思った時、自分の求めるChrome拡張が存在しなかったり、信用できない開発者のChrome拡張を使用したくないということがあります。この問題を解決するために「WXT」というOSSを使用してChrome拡張を開発した話をしました。
WXTはNuxtベースで開発できる拡張機能開発フレームワークです。Chrome拡張を開発するにはいくつか設定ファイルを作成したりChrome拡張特有の作業が必要でとても面倒なのですが、WXTを使用することでこの作業がとても簡単になります。しかもNuxtを使用している人には分かりやすいインターフェースになっており、Vue.js/Nuxtを触っている開発者にはとても開発しやすいものになっています。さらにはVue.jsだけでなくReactなど他のUIフレームワークを使用して開発することもできます。
自分でChrome拡張を作りたいという方はこの発表を参考にWXTを試してみてください。
おわりに
Vue Fes Japan 2024での一休の発表を紹介させていただきました。
Vue Fesですが、発表者、かつ一視聴者として参加してみて、すごく熱があるカンファレンスでした。参加者も多く、Vue.jsだけでなくViteの話も聞けて、さらにRolldownやoxcの話を開発者から聞けるという場は国内ではなかなかないと思います。そのような場で発表できたこと、スポンサーをできたことはとてもありがたかったです。
2025年も開催されるとのことなのでまた楽しみです。
一休では、ともに良いサービスをつくっていく仲間を募集中です。
カジュアル面談も実施しているので、お気軽にご応募ください。
