NuxtもNextもSvelteも推し！フロントエンドエンジニアがアンドパッドでみつけた意外な夢

2020年8月に入社したフロントエンドエンジニアの市川さんは、アンドパッドに入社後、持ち前の才能を開花させた一人です。プロダクト開発のみならず、勉強会や採用にも深く関わり、さらには組織づくりにも携わっています。「環境を変えることで、新たな技術領域にチャレンジできるだけではなく、一人の人間として、より大きな目標と出会えることもある」。そのような可能性を感じていただけるインタビューです。ぜひ最後までお読みください。

市川 夕貴（いちかわ ゆうき）
高校時代に『ブラッディ・マンデイ』（TBS）に影響されエンジニアを志す。大学時代はインターンでiOSのアプリを開発。卒業後はゲーム攻略サイトや求人メディアでフロントエンドエンジニアとして活躍。2020年8月にアンドパッドに入社。「ANDPAD」Nuxt化プロジェクトチームにジョイン。現在は「ANDPAD黒板」などのプロダクト開発やフロントエンドエンジニアの採用にも携わる。2021年8月にアンドパッドのバリューを体現した社員に贈られるTechnology First賞を受賞。

「新しい製品をどんどん出していく」という勢いを感じた

―市川さんのアンドパッドへの当初の印象はどんな感じでしたか？

実は入社前に一度検討したことがあったのですが、その当時は他社に進み、フロントエンドの基盤をNuxtにリプレースするというプロジェクトに参加する予定にしていました。しかし、その話が流れてしまったんですよね。でも、どうしてもNuxtでの開発がやりたいと思っていたところ、アンドパッドでNuxtに切り替えるプロジェクトを進めていると聞いて、改めて転職を決めました。Nuxtは当時のフロントエンド界隈では、多くのエンジニアがトライしたいと考えていた分野です。Nuxt化によりUX改善や表示スピード向上が期待できます。改修もしやすくなり、メンテナンス性も上がるから、貢献度が高い開発だと思っていました。

また、入社前にアンドパッドのエンジニアの上層部の人たちと、食事をする機会があったんです。そこでエンジニアファーストのカルチャーや「製品をどんどん出していこう」という勢いを感じました。話ぶりから、みんなが技術に対して真摯に向き合い、ユーザー課題の解決にコミットしていることが伝わってきたんです。

―入社後はどのようなプロジェクトに携わりましたか。

ANDPADでクライアントが案件情報を管理するための機能をNuxt化しました。建設会社の施工は同時にいくつも進行していることが多いため、案件内容や担当者の情報を把握するための機能です。

技術面に関しては問題なく進められましたが、リニューアル後の機能に関して、いくつか問い合わせが入りました。旧仕様を使い慣れているお客さまの一部が少し混乱したようです。また「便利だったから残してほしい」と言われた機能もありました。要望に応えるために手を加えることになりましたが、Nuxt化が済んでいたためスムーズに改善できました。

Nuxtに続きSvelteも使いこなしていきたい

―現在はどんなことにチャレンジしていますか。

今は「ANDPAD黒板」というプロダクトを開発するチームに所属して、Svelteにチャレンジしているところです。

他のANDPADプロダクトからも「ANDPAD黒板」と同じ振る舞い、見た目を持つ「黒板（施工中で、黒板に情報を書き込み工事写真撮影を行う。工事の品質を証明するためのもの）」を見られるようにしてほしいという要望があったのです。「ANDPAD黒板」はVue.jsを使っています。一方で連携させたいプロダクトはReactを使っているので、「黒板」のUIコンポーネントがReactだと使えない問題がありました。

※ANDPAD黒板

そのため、新しい機能はReactでもVue.jsでも共通で同じコンポーネントを利用できるように「Svelteで書いてみよう」という話になりました。Svelteは、Vue.jsやReactのように「仮想DOMを作り実行時に変化の差分計算を行う」アプローチではなく、「データの変更に反応してDOMを書き換えるプレーンなJavaScriptコードをコンパイル時に生成する」というアプローチを採用したコンパイラです。そのため、Vue.jsやReactのように宣言的にUIが記述できる上に、コンパイルされたコードは単なるJavaScriptコードになるので、あらゆるJSフレームワークと共存することができます。フロントエンド界隈ではSvelteが注目されていますから「試してみたい！」というエンジニア心をくすぐられたことも大きな理由です。

このような技術的な挑戦は、一人でやるのは難しいと思います。アンドパッドの場合は、「フロントエンド定例会」という機会に、「これをやろうと思っているんだけれど、みんなどう思う？」と気軽に相談することができるんです。

さらに、アンドパッド 技術顧問の喜多 啓介さん(株式会社10X所属、Vue.jsに関する書籍を執筆)が２週間に1回技術相談会を開いてくれるので、そこで助言をもらうこともできます。新しい技術に挑戦するために孤軍奮闘するということが、アンドパッドではありません。

ユーザーの「クリティカルな課題」を解決できる

―あらためて、アンドパッドで開発する醍醐味はどのような点にあると思いますか。

ユーザーのリアルな声がエンジニアにしっかり届く点だと思います。ユーザーエクスペリエンスチームが、直接ユーザーの声を聞いて、エンジニアにフィードバックしてくれます。おかげでユーザーの課題が頭に浮かぶし、どうしたら喜んでもらえるのかもわかるんです。

僕が所属している「ANDPAD黒板」チームのプロダクトオーナーは、定例会のときに「この機能が、こんなふうに評判だよ」と伝えてくれます。普段からSlackチャンネルで「○○という会社からこういう要望が上がってきているから一緒に考えよう」のようなコミュニケーションをとっているんですよ。ニーズに合うものをつくっているから、開発に手応えを感じられます。

アンドパッドでの開発を通じて、クリティカルなユーザーニーズに応えられる開発者としてのやりがいがあることに気がつきました。これはアンドパッドに転職したからこそ得られた経験です。

―アンドパッドの「人の魅力」についてはどんなことを感じていますか。

フロントエンドエンジニアの技術レベルが全体的に高いと思っています。どんどん課題解決を進める突破力のある人がいれば、新しい技術に次々と挑戦する人もいますね。とにかく勉強熱心な人が多いです。

象徴的なのは、毎朝の10分間勉強会の盛り上がりです。通称「歯磨き勉強会」と呼ばれています。「歯を磨くくらい当たり前のように毎日、学んでいこう」という想いが名前に込められているんですよ。フロントエンドの歯磨き勉強会では、その時々によってテーマを変え、フレームワークなどのドキュメントの読み込みを行っています。最近はNuxtのバージョン3がリリースされたので、みんなで勉強しています。

ファシリテーターも毎回変わります。自分の順番が近づいてきたら予習に力が入りますし、繰り返していくうちにファシリテーションする自信もついてくるんですよ。

他にも、「機械学習勉強会」「iOS知見共有会」「Flutter会」「gopher会」「建設業界勉強会」という具合に、いくつもの勉強会が開催されています。

身近な仲間の夢を応援するエンジニアリングマネージャーに挑戦したい

―常に学び、挑戦し続けている市川さんが、アンドパッドで叶えたいと考えていることを教えてください。

僕は今、開発のほか、採用面接にも関わっています。採用選考時に行うコーディング試験をブラッシュアップして、フロントエンドのスキルレベルを判定しやすいようにしていきたいと考えているところです。

技術的な部分では、Next.jsを使った開発にも携わりたいですね。社内にNext.jsやReactのプロジェクトもあるので、今担当しているプロダクトが落ち着いたら、そちらにもチャレンジします。僕はユーザーの課題を解決することが気持ち良すぎて中毒のようになっているので、新しいスキルを獲得することにも力が入ります。

そして、ゆくゆくはEM（エンジニアリングマネージャー）を目指すつもりです。いつかは、僕がみんなの技術的なチャレンジを後押ししていける存在になりたいと思っています。というのも僕は、アイドルを応援することが大好きなんですよ。アイドルに夢を叶えてほしいと思うし、それ以外の身近な人たちにも、やりたいことを叶えてほしいと思って生きているからです。

アンドパッドに入って、EMがそういう役割の職業だと知りました。自分にきっと向いている、そう思っています。

―ありがとうございました。市川さんが、アンドパッドの力強いサポーターになってくださることを期待しています！

技術的な挑戦のためにアンドパッドを選んだ市川さん。新たな技術的挑戦に加えて、「人を応援したい」という気持ちに改めて目覚め、エンジニアとしての将来的なキャリアとしてエンジニアリングマネージャーという夢も抱くようになりました。環境を変えたことで、新たな能力を開花したエンジニアは市川さんだけではありません。

アンドパッドの6バリューに「Technology First」があります。そこには、「常に技術チャレンジをし、探求する。ものづくりに対して妥協しない。」という想いが込められています。

そのバリューに則り、「ANDPAD」をオープンプラットフォームにすべく、新規プロダクトのリリースを続々と行なっている段階です。現在、レガシーな環境と新規開発におけるモダンな環境が存在している状態であり、UI/UXの共通化が課題となっています。

その他にも下記のような取り組みがいのある課題があがっています。

- レガシーな技術基盤の刷新（Nuxt化プロジェクト）
- IEサポート終了にともなうVue3への移行
- TypeScriptベースの標準化
- VueとReactから利用される共通コンポーネントの開発
- パーフォマンス改善
- テストの拡充（ユニットテスト・Autify）
- セールスやデザイナー/PdMと連携して行うUI/UXのさらなる改善

「ANDPAD」のUI/UXを思う存分グロースハックしてみたい方、そして、新しい環境で自分の新しい可能性を見つけたい方、ぜひご応募お待ちしています！