ヒカ☆ラボbyレバテックにエンジニアの松原と稲尾が登壇しました！

こんにちは、松崎です。

今日は5/23(火)にレバレジーズ様にお誘いいただいた

レストラン事業本部のエンジニア2名が

ヒカ☆ラボの「大規模サービスがリスクをとってまでモダンな開発環境にリプレイスした理由～ここだけの苦労話や手法を交えお話します～」に登壇したので、

発表内容とお二人の感想を伺いましたので記事にします。

まずは

Vue.jsについてお話した、松原さんです。

レストラン事業本部マーケティング部の松原です

5/23に渋谷ヒカリエにて株式会社レバレジーズ様の主催するヒカ☆ラボのイベント「大規模サービスがリスクをとってまでモダンな開発環境にリプレイスした理由～ここだけの苦労話や手法を交えお話します～」にて登壇してきました。

資料はspeakerdeckにて公開しています。是非ご覧いただければと思います。

https://speakerdeck.com/simezi/vbscript-meets-vue-dot-js-20nian-yue-sifalsechu-hui-i

今回はイベント全体で「レガシー改善」という大きなテーマが用意されていました。

それに沿う形で、現在一休.comレストランで取り組みがはじまった、サイトへのVue.js導入の発表をしてきました。

主に話したのは以下のような話です。

一休.comレストランの現状

- 具体的に何がレガシーになってきているか？

Vue.js導入の経緯

- なぜフロントエンドのフレームワークを導入したのか？

- なぜVue.jsを選んだのか

実際にスマホサイトの予約画面のリプレースに投入してみた話

- 出来上がったコードがどうなったか？

- 何を気にして案件を進めたか

私自身フロントエンド経験が多くなく、手探りしながら開発を進めている状態なので

技術的なテクニックやノウハウというよりは、コードベース改善にあたって何を考えてその結果どうしたか、

というような経緯にフォーカスをした内容となりました。

オーディエンス・関係者合わせて100名弱となかなかの大人数の前での発表で、

頭の中が真っ白で喋っているような状態でしたが、

直後の懇親会では面白かったと様々な人から声をかけていただけたので、ひとまずはホッとしています(笑)

Vue.jsはとても学習が容易で、既存のコードベースにも自然になじませていきやすいフレームワークだと思います。

実際の使用にあたっても、導入そのものはアッという間に終わり、

どちらかというと案件の仕様の複雑さのほうに頭をかかえている時間がほとんどでした。

そんな中で、Viewとロジックの分離が図られていることで、直前の仕様変更が発生してもスムーズな修正が出来たという手応えを感じられたことは大きな収穫だったかなと思っています。

サイト全体からみれば、まだまだ最初の一歩を踏み出したばかりのレガシー改善への取り組みですが、

日々の開発の中で、ちょっとずつ適用範囲を広げていって快適で高速な開発ができるように頑張っていこうと思います。

松原さん、ありがとうございました。

お次は

webpack を使ったビルドパイプラインを導入した話をした稲尾さんです。

レストラン事業本部システム開発部の稲尾です。

5/23 夕方にレバレジーズ株式会社主催のイベントヒカラボで講演してきました。

資料はこちら:　https://speakerdeck.com/japboy/legacy-development-meets-webpack

社内で登壇の話を頂いて、レストラン web サイトのフロントエンド改善の取り込みを、イベントのテーマである「レガシー改善」と関連付けて紹介しようという流れになり

一緒に登壇した松原の方から、実装面の改善として jQuery ベースの実装から Vue.js によるデータバインディングへの移行を紹介してもらう事となりまして、私の方からは、その前段として、フロントエンドの CSS や JavaScript のコードベースに、webpack を使ったビルドパイプラインを導入した話をさせてもらう事となりました。

現状のコードベースから、モダンな開発へ移行したい雰囲気はあったものの、現実はなかなか導入が進まない中で、こういった機会を頂いて、輝かしい成功体験をお話するというよりかは、うまく行かなかった体験談をありのままお話しするという内容にしました。

会場でお話させて頂いた方も、同じような悩みをもっているのを、お聞きしたりして、開発環境の刷新の難しさを感じると共に、少しずつでも前進していく事を重要性を感じた良い機会でした。