フルスタック、VPoE、デザインエンジニア、フロントエンドの極み──4つのパターンで語る「フロントエンドキャリアの分岐点」

アーカイブ動画

キャリアの分岐点#1『フロントエンド→フルスタックパターン』小林 泰士さん

フリーランスのコーダーからキャリアをスタート

トップバッターで登壇したのは、NEW SHIP CEO 小林泰士さん。業務委託でROXX、シェアダイン、APERITEが運営するワインのサブスクサービス「ポケットソムリエ」などの開発に携わっている。

大学時代は広報やライターといった活動と平行して、個人ブログをWordPressで運用していた。そこで得たスキルをベースに、社会人一年目からフリーランスのコーダーとして歩み出した。

受託会社に入社した後も、企業のランディングページ（LP）の開発案件などに携わる。並行して、大手企業にコーダーとして派遣されたことが、大きな転機になったと振り返る。

「仕事が暇だったんです（笑）。そこで、新しいことを個人的に学ぼうと思いました」

PHP以外のサーバーサイドも勉強したいと考えた小林さんは、Goを学ぶ。また、jQuery/MPAだけではなく、SPAでの開発も学ぶ。さらに自身だけでなく、開発チーム全体が楽できる環境を実現すべく、業務効率化に寄与するさまざまなツールも合わせて学んでいった。

「SPAの開発をしたくてReact、レビューで指摘したくないからlint、動作確認が面倒だから自動テスト、デプロイもしたくないからCIで自動化。yumコマンドを打ちたくないからAnsibleで自動化、Docker化。AWSコンソールでポチポチしたくないから、Terraformで自動化など。こんな感じで知識やスキルを身につけながら、実践してきました」

CakePHP、jQueryを中心に10案件ほどを開発すると同時に、開発環境の改善にも大きく貢献。その結果、受託会社ではCTOにまで昇格する。しかし、小林さんはそこでキャリアをピボットさせる。IoT開発会社にジョインするのである。

「受託会社はあくまでフロント領域の開発案件のみを受けていました。一方で、自分は保守・運用も担うことで、プロダクトの価値を高めたいという想いがありました」

IoT開発会社で望み通り、領域を問わない一貫したプロダクト開発を経験した後、再びフリーランスに戻るという道を選択する。

その後はIoT開発会社からの業務委託案件のほか、HRTechサービスを展開するROXX、出張料理マッチングプラットフォームの開発を行うシェアダインなど、さまざまなスタートアップの開発案件に携わるようになっていく。

楽するために、やりたいことをしていたらフルスタックになっていた

どうしてフルスタックエンジニアになったのか。小林さんは、「楽に、素早く、効率よく開発し続けられる開発体制・仕組みを模索していたら、自然にバックエンド・インフラもやるようになり、いつの間にかフルスタックエンジニアになっていた」と、自身の歩みを振り返る。

フロントエンドに限らず、特定領域に特に思い入れがなかった。そして、サービスのローンチから携わるケースが多く、自然と全領域に触れる機会が多かったからだと補足した。

一方で、全方位的に深く学ぶことは現実的に難しいため、細かな部分は各領域に特化しているエンジニアに任せ、自分はチーム開発を俯瞰して見るなど、棲み分けも大事だと説明した。情報のキャッチアップについても次のように話す。

「全領域にアンテナを張るのは難しいので、開発で協業するメンバーや自分よりも数歩先を行くエンジニアと、コミュニケーションするように意識していました。いま興味を持っている技術や実際に導入しているツールを聞き、良さそうなものは導入していきました」

ROXXのように100名を超える規模の企業もあれば、立ち上がったばかりで数名程度のスタートアップに参画することもある。フェーズ、会社の規模、技術や組織に対する考えなど、「フルスタックだからこそ全方面に目を向けてさまざまな機会に触れることのできる今の環境が“楽しい」と述べ、セッションを締めた。

▶小林さんの発表資料

キャリアの分岐点#2『フロントエンド→VPoEパターン』あほむさん

株式会社overflow　VPoE　あほむ（佐藤 歩）さん

LAMP系からフロントエンド、マネジメント、技術人事を経て、VPoEとなる

続いて登壇したのは、複業転職プラットフォーム「Offers」を手がけるoverflowで、VPoEを務めるあほむこと佐藤歩さん。まずは、現在のポジションに至るまでのキャリアについて語った。

「名古屋でWeb制作会社に就職したのがキャリアのスタートです。当初は、PHP、MySQL、jQueryといった、いわゆるLAMP系エンジニアとして経験を積んでいきました。次第にUIに興味を持ち、技術系の勉強会で面識のあった知人の紹介でサイバーエージェントからオファーをもらって転職しました」

サイバーエージェントにジョインしてからは、新規サービスの開発が盛んな時期とも重なり、Webフロントエンドエンジニアとしてのキャリアを積み重ねていく。だが一身上の都合で名古屋に戻る必要があった。

リモートワークで業務を続けていたが、現在のように環境や文化が整っていなかったこともあり、パフォーマンスが落ちたと振り返るあほむさん。だが環境に慣れていくにつれ、次第に本来のパフォーマンスを発揮していく。

次第にエンジニアのマネージメントも行うプレイングマネージャーだけでなく、技術人事的なポジションも任されるようになった。サイバーエージェントに在籍した9年間のキャリアが評価され、overflowにVPoEとして迎え入れられる。Webフロントエンドに限らず、組織全体の開発や戦略立案も担っている。

WILLはなくてもいい。MUST駆動で、より良いWebを求め続ける

「WILL - CAN - MUST」。目標やキャリアなどを計画する際に、よく用いられるフレームワークである。あほむさんはフレームワークの「WILL」にこう言及した。

「WILLはあるかと聞かれることって、よくあることだと思います。目標に向かって日々の業務に取り組んでいる人は強そうなイメージですよね。でも、私にはWILLはありません。逆に、今のように将来が不確実な時代において、WILLを表明することは息苦しく感じます」

あほむさんにとっては、目の前にやるべきこと、できることを一つ一つ積み重ねていくことが、結果として自分のやりたいこと、WILLにつながっていると語っている。

つまり、MUSTを一つ一つ取り組むことでCANが増え、WILLが見えてくるという考えである。一方で、仕事を進める上で譲れない矜持は明確に持っていた。「より良いWebをつくること」だ。

あほむさんのキャリアを改めて振り返ると、まさにこの考えを実践してきたことで、現在のポジションに至ったことが分かる。

「マークアップエンジニアのスキルセットの方が多かった中でJavaScriptを書ける人をとにかく増やして、次々とアプリを開発していく必要がありました。そこで、社内の同僚にJavaScriptを広めていきました。当時はまだ、フロントエンドエンジニアという言葉は一般的ではありませんでした。しかし、今で言うフロントエンドの活躍の場が増えるにつれ、次第に認識されるようになっていきました」

フロントエンドエンジニアが増えてきたフェーズでは、他社に負けないサービスを構築する必要（MUST）があった。そこであほむさんは、パフォーマンス改善、アクセシビリティなど、Webの品質改善に努めた。

さらにWebフロントエンド系のカンファレンスを開催し、Webパフォーマンスやアクセシビリティ、品質に関する技術書などを出版した。いわゆる、啓蒙活動とも言えるだろう。

実際、こうした啓蒙活動が功を奏し、会社のブランディングの向上に繋がっていった。そして、優秀なフロントエンドエンジニアがサイバーエージェントにジョインするようになる。

エンジニアメンバーが増えたことにより、必然的に環境整備やマネジメントを行う必要が出てきた。その業務をあほむさんが担うようになる。当初のマネジメントはWeb領域に限定されていたが、結果を出したことで技術部門全体のマネジメントや人事も任されるようになっていった。気づけば対象となるエンジニアの数は、400人以上となっていたという。そして現在は、overflowのVPoEに至る。

最後にあほむさんは次のように述べ、セッションをまとめた。

「そのときに求められる、やらなければいけないMUSTは何で、自分に何ができるのか。自分のキャリアを振り返ると、MUST駆動で獲得したCANをかけ合わせていくことが、今のポジションにつながっているし、このようなキャリアもありではないかと思っています」

▶あほむさんの発表資料

キャリアの分岐点#3『フロントエンド→デザイナーパターン』ymrlさん

freee株式会社　デザインリード　ymrl（やまある）さん

デザイン専攻から、コーディングできるという理由でエンジニアに

続いては、現在はfreeeでデザイナーとして活躍するymrlさんが登壇した。

学生時代、インタラクションデザインの研究室に所属していたymrlさん。Webサービスを作ったり、電子工作したりすることが好きで、HTMLやCSSを学んだ。インターン先のベンチャーでもプログラミング業務に携わり、そのままエンジニアとしてのキャリアをスタートさせる。だが9カ月で辞め、従業員がまだ20名ほどだったfreeeに転職する。

freeeでは、JavaScriptやCSSが得意なフロントエンドエンジニアとしての存在感を発揮していった。ただ本人いわく「サーバーサイドには苦手意識があったので、フロントエンドを積極的に巻き取ることでごまかしていた」と、当時を振り返る。

freeeが成長していくにつれ、サービスは会計にとどまることなく、他の領域に広がっていった。ymrlさんもその中のひとつ、人事労務ドメインをゼロイチで開発することになる。

ymrlさんは人事労務に関するドメイン知識を、徹底的に勉強していった。法令、行政文書などにも目を通すようになり、フロントエンドエンジニアに加え、社内における同ドメインのエキスパートという新たなタグも手に入れる。

だが本人にとってはモチベーショングラフが示すとおり、この時期はキャリアについて、悩んでいたと吐露する。

「社内での評価はありましたが、そもそもドメインの専門家になりたいとは思っていませんでした。試しに受けた社労士試験も落ちました。マネジメントタイプでもないと自覚していたので、この先どのようなキャリアを描いていこうかと、悩んでいましたね」

やっぱりやりたいのはUIデザインだった

モチベーションが低くなっていたymrlさんに、転機が訪れる。アクセシビリティとの出会いだ。freeeでも社内の基準を作ろうと、勉強会などが開催されるようになり、デザイナーと交流する機会が増えていった。

「まさに、原点回帰でしたね。WebデザインやUIデザインについて、デザイナーと意見を交わしているうちに、改めて自分の興味関心はデザインなのだと気づいたんです。同時に、アクセシビリティを本気で進めるためには、これまでの小手先的な改善ではなく、抜本的に変える必要性も感じ始めました」

デザイナーと意気投合したymrlさんは、業務時間の20％を好きなことに使っていいという20％ルールを活用して、同僚のデザイナーと一緒に、アクセシビリティの高い製品開発を実現するためのデザインシステムを構築していく。デザインシステムは「Vibes」と名付けられ、その後本格採用される。

ところが、一緒になってVibesを開発したデザイナーがfreeeを去ることになった。ここでymrlさんは、エンジニアからデザイナーにキャリアチェンジすることを決意する。

「エンジニアをしていたのは、たまたまコードが書けたから。改めてデザインに接したことで、自分のやりたいことはデザインだと感じました。ただし、エンジニアのキャリアが無駄だとは思っていません。逆に、テクノロジー目線でデザインを考えることができる。デザイナーとしての武器となるし、強みだと感じています」

コーディングなど、技術の素養がまったくないデザイナーは、ソフトウェアとして完成した姿への理解の解像度が深くない。その深度こそが、UI/UXデザインにおけるスキルでもあると、ymrlさんは続けた。

ymrlさんのようなキャリアを持つ人材はまだ少なく、現時点ではコーディング能力はメインの武器ではなく、おまけ程度にしか評価されていないことがほとんど。社内での異動であればよいが、別の会社にエンジニアがデザイナーとして転職することは、まだまだ難しいという見解も示した。一方で、次のような光明もあると述べている。

「デザインエンジニアというポジションを設ける企業も、徐々に出てきました。そして、私のようにエンジニアのキャリアを経てデザイナーになった人が活躍している。数年後にはデザインエンジニアという仕事が当たり前になることを期待しています」

▶ymrlさんの発表資料

キャリアの分岐点#4『フロントエンドの極みパターン』mizchiさん

株式会社PLAID　フロントエンドエンジニア　mizchiさん

成長したいならフロントエンドなんかやったらダメ

イベント冒頭、mizchiさんは「フロントエンドエンジニアとして成長したければ、フロントエンドなんかやったらダメ」と爆弾発言。その真意として、次のように補足している。

• 先に行きたければ、今のフロントエンドからフロントエンドを学ばない
• 海外も含め、他の環境からの発想を取り入れ続ける
• コア技術を深く持つことが大事
• 手を動かし、課題感を貯め続ける
• 新しい技術選定の審美眼を磨く
• 新技術を現場で使いたければ、自らトレンド形成に関与する

mizchiさんは自身のフロントエンドエンジニアとしてのキャリアを「技術ドリブンで、やりたいことをやっていたら今のキャリアがある」と振り返り、これまでの学習経路と合わせて語ってくれた。

※mizchiさんの「学習経路」拡大版はこちら

「たかがJavaScript」の先にあったもの

mizchiさんがプログラミングと出会ったのは大学時代。文系であったが講義でUNIXとJavaに触れてプログラミングの楽しさを知り、独学でプログラミングを学ぶようになる。

2008年当時の全盛言語は、Ruby on Rails。しかし、mizchi氏が学んだのは言語仕様が小さく学習しやすいPythonだった。ちなみに当時、Pythonエンジニアを求める企業はほぼ皆無であったという。

ゲーム好きということもあり、こちらも独学で学んだNode.js＋Socket.IO＋HTML5 Canvasで、オリジナルオンラインゲームの開発にも取り組む。ゲーム開発はしばらくして破綻する。だが、mizchiさんは後にJavaScriptの非同期処理に関するjQuery.Deferred、Promiseの学びにつながる経験を得たと、振り返っている。

新卒で入社したゲーム開発会社Aimingでmizchiさんのメンターを務めた、現在HeyのCTOである藤村大介氏との出会いも、冒頭の教訓の形成につながっていく。藤村氏はRuby on Railsを軸にしつつ、HaskellやClojureといった技術を追っており、海外の著名プログラマーの動向をウォッチしていたからだ。

Aimingでは、ゲームエンジンUnityで作られたシミュレーションゲームの、HTML5移植大規模プロジェクトを担当する。実際には崩壊していた設計を立て直すというもの。とにかく辛かった思い出しかなかったという。

「絶対に破綻しない、フロントエンド設計について本気で考えるようになりました。また、助けを求めても、適切な解をくれる人はいませんでした。この経験から、既存のJSコミュニティにノウハウはないことを感じ取るとともに、エンジニアとしての指針というかゴールが定まりました」（mizchi氏）

まさに、海外のトレンドをキャッチアップするなどの教訓である。JSの課題を解決するために、にわかでいいからと、とにかく関連する海外の技術などに触れ、参考になるところは持ち帰るようにした。

たとえば、当時はAltJSがブームだったため、mizchiさんは有望なAltJSを全部試し、次のような気づきを得ていった。AltJSでフロントエンドを実際に書くことでスキルを身につけることはもちろん、実用可能性の調査も行った。

「CSSを書く時間が増えたことで、あることに気づきました。CSSによるUIの実現やデザインに対して、自分はまったく興味がないことです。一方、興味があるのはFrontend Opsだということ、Frontend Opsとして実現したいことは次のようなことだと分かりました」

mizchiさんは、自身のフロントエンドエンジニアとしてのキャリアをこう語っている。

「改めて考えると、自分の選んできた技術領域や集積が、結果としてフロントエンドの範疇だったという認識です。誰よりも手を動かして不満を溜め続けてからこそ、新技術の意義を理解して取捨できたのだと思っています」

また、エンジニアとして大切にしているマインドについても以下のようにメッセージを送り、セッションを締めた。

「『JSなんて所詮この程度』という先入観を捨て、他のプログラミング領域では一般化した視点を持ち込むことで、自分の技術を差別化していく。このようなアプローチが重要です。JSは変化し続け、今後は別ものになるでしょう。だからこそ外から学び続けないといけないと考えています」

▶mizchiさんの発表資料

【Q＆A】視聴者からの質問に答えるコーナーも盛り上がる

セッション後は、視聴者からの質問に登壇者が回答する時間が設けられた。その中からいくつか紹介する。

Ｑ．海外の情報やトレンドはどこから得ているか

mizchi：一貫して見ているのが、GitHubの言語ごとのトレンドです。どれだけスターがついているのか、推移などをチェックしています。また、@azu_reさんがウォッチしている情報もチェックしています。

あほむ：@azu_reさんのフォロワーとして生きていく、という方法はありです（笑）。英語圏のオピニオンリーダーの動向をツイッターで追っていたりすると、情報の流れが見えてきます。

ymrl：僕は海外までアンテナを広げるのはきついので、国内のオピニオンリーダーをキャッチアップし、盛り上がっているトピックをチェックしています。

小林：海外を直に見ることはしていません。azuさんのようにキャッチアップが早い人や、知り合い数人がツイートしている情報があったら、チェックしています。

Ｑ．業務外の時間でどのように知識を吸収しているか

mizchi：僕はプログラミングが趣味で、仕事はお題をくれる場所という認識です。仕事で発生したお題のうち、深掘りするのは業務スコープが外れる時間。つまり、趣味の時間に取り組んでいます。一方で、趣味時間は仕事のことはしないように、常に新しいことをするようにしています。

ymrl：業務内と外を、区別しなくていいと思います。業務のなかで勉強していても、結果として、仕事ができる人だと思われる行動をすればいいからです。業務外に勉強しないといけない的な雰囲気をつくるのも、業界的によくないと思っています。

小林：自分もプログラミングが趣味のため、特に分けていません。個人開発も好きですし、毎日楽しく勝手にやっています。

あほむ：ymrlさんと同じく、区別していません。業務時間外でもTwitterやネットサーフィンから息を吸うように、技術情報をキャッチアップするのが心地よいですからね。

Ｑ．モチベーション下がったときにどうコントロールしているのか

ymrl：モチベーションの高い・低いを気にしないようにしています。低いときは仕方ないと考え、ゲームなど別のことをしますし、落ちたら落ちっぱなしです。実際、僕は休日にやる気が起きないタイプで、土日はほぼ寝ています。そのうち戻ってくるだろうって思っていますね。

mizchi：プログラミングは趣味ですが、ゲームも好きで、プログラミングもゲームの一種だと考えています。ゲームは飽きたら、次のゲームに興味が移りますよね。プログラミングでも同じ考えで、モチベーションが下がったり飽きたりしたら、別のプログラミングやゲームをするようにしています。