![見出し画像](https://assets.st-note.com/production/uploads/images/143895017/rectangle_large_type_2_df7e402e1ebd3772fd04dff838eb1f88.png?width=1200)
二足のわらじを履くエンジニアが挑む チームのフロントエンド開発力アップ
2018年メドピアに入社し、現在はフロントエンド兼サーバーサイドエンジニアとして活躍する森田 盾さん。この度、社内表彰制度でエンジニアとしては唯一、2018年に続き2度目の受賞をされました。
キャリアチェンジも経験された森田さんが、今回どのような取り組みを行ってきたのか、その間にどのような心境の変化があったのか、迫っていきたいと思います。
サーバーサイドエンジニアからフロントエンドエンジニアへ
![](https://assets.st-note.com/img/1718250682654-g5eJqKdlTS.jpg?width=1200)
現在のお仕事の内容について教えてください。
フロントエンド領域を主軸に、医師専用コミュニティサイト「MedPeer」の開発全体に影響するライブラリアップデート等の改善業務を担当しています。メドピアグループ全体でもフロントエンドエンジニアは他領域エンジニアと比較して人数が少なく(※)、協力しながら業務を進めています。
※)▼エンジニア組織に関してはこちらも参照ください。
加えて、定期的にフロントエンド領域の勉強会も主催しています。
設計・実装相談や知識獲得を目的とした会議を計画、運営し、実際のプロジェクトで発生した課題をベースとした議論やMDNのドキュメントの読書会、サンプルのwebページのコーディングをモブプロでやってみたりと、自分も含めたみんなで知識を獲得できる場を設けています。
※)ライブラリとは…開発においてよく利用される機能を切り出して、再利用しやすいようにまとめたもの
※)MDNとは…開発技術に関する文書がまとめられたWeb開発者向け情報サイト。MDN Web Docsの略
※)モブプロとは…モブプログラミングの略。複数名共同でコミュニケーションをとりながら進める開発手法
どのような点がポイントになってくる仕事なのでしょうか?
直接的にはプロダクトを開発していない、間接的に支援をしていく立場の仕事です。
仕事の性質上、サービス全体に影響する対応を行うことが多いので、どのような影響があるのかを全体に共有しつつ、なるべく影響を小さくし段階的にリリースすることで、開発速度を落とさずに負債がたまらないようにしていく、ということが重要だと考えています。
フロントエンドエンジニアの体制も限られており、しかしながら実際の開発シーンではフロントエンドエンジニア以外にも必要とされる知識も多いです。グループ全体のスキルアップをしていくことも組織の課題と捉え、まずは身近な事業部内に対して積極的に働きかけています。
もともとメドピアにはどのような経緯で入社されたのでしょうか?
新卒でSIerに入社し、その後スクールに通いバックエンドの知識を身に着け、2018年にサーバーサイドエンジニアとしてメドピアに入社しました。
入社後すぐに既存サービスのリニューアル、新規サービスの立ち上げという重要な開発案件に携わることができました。
メドピアでのキャリアのスタートはサーバーサイドだったのですね。どのタイミングでフロントエンドに転向していったのでしょうか?
2020年に育休を取得し、育休明けに携わった仕事でサーバーサイドだけでなくフロントエンドの技術にも触れることになったのがきっかけです。
その後、新たに事業譲渡を受けた「みんコレ!」という医学生向けサービスを立ち上げる時にはサーバーサイドに強みを持つメンバーが他にいたこともあり、フロントエンドの分野により深く関わることができました。
本格的には2022年4月頃に、自らサーバーサイドからフロントエンドへのキャリアチェンジを志願し、現在に至っています。
Vue3バージョンアップ、社内留学制度を主導し、「われわれ」「はみ出す」を体現
![](https://assets.st-note.com/img/1718251017762-azTe1HMiol.png?width=1200)
メドピアグループキックオフミーティング内での社内表彰制度「MedPeer Award(※)」で第1四半期(2023年10月~12月)のExcellent Performer賞を受賞されましたが、その取り組みについて教えてください。
取り組んだことは大きく2点です。
1点目は「MedPeer」で使用しているVue.jsというフレームワークのVue2からVue3へのバージョンアップを滞りなくできたこと、2点目は事業部内メンバーのフロントエンド開発力アップの支援です。
そのいずれも、当初のバックエンドエンジニアとしての役割だけに固執せず、積極的に周囲を巻き込みチャレンジした姿勢を評価していただいたと捉えています。
※「MedPeer Award」とは…新人賞・Excellent Performer賞・MVP賞の3部門からなり、業績や実績への貢献はもちろん、メドピアグループ社員が大切にしているCredoを体現できているかどうかを基準に表彰する制度
「Vue3へのバージョンアップ」について、詳しく教えてください。
Vue3へのバージョンアップは破壊的変更も多く、対応箇所が膨大で時間がかかりそうでした。そこで静的解析(※)等を活用して対応箇所を可視化し、進捗状況を定量的に追いやすく、リリース時の差分もコンパクトにすることで、開発メンバー全員で対応、レビューもしやすい状況にできたことが功を奏したと考えています。
結果、滞りなくまた大きなトラブルもなくバージョンアップを完了させることができ、Vue2と比較し、サイズの軽量化・速度アップを達成、UXの向上を実現できたと自負しています。
※)静的解析とは…コードを実行せずに、コードの品質・信頼性・セキュリティなどの観点でプログラムに欠陥が無いか検証する手法の一つ
▼技術的な詳細はこちらを参照ください。
![](https://assets.st-note.com/img/1718251371237-JKTQnKGyzj.jpg?width=1200)
「事業部内メンバーのフロントエンド開発力アップの支援」というのは、どのような取り組みをされたのでしょうか?
実務でフロントエンド技術に触れられる短期留学制度を設計、運営しました。
事業部内のフロントエンド以外のエンジニアに、実際にグループ内で進んでいる開発案件に対して、フロントエンドの技術要素を活用して1か月ほど参画いただくものです。
既存カルーセル(※)のリファクタリング(※)やページ作成用のテンプレートコンポーネント(※)開発等に携わっていただき、自分ともう一人のフロントエンドエンジニアと分担しながら、そのサポートをしていきました。
制度を運用していくうえでは、フロントエンドエンジニアとしての基本的なスキルのチェックリストを設け、都度の振り返りで「今回これをやった」「これができるようになった」などとチェックを足していくようにし、スキルの可視化も行いました。
※)カルーセルとは…Web上で複数の画像やコンテンツをスライド式で表示する手法
※)リファクタリングとは…プログラムの外部から見た動作を変えずにソースコードの内部構造を整理すること
※)コンポーネントとは…ファイルやプログラムの構成要素
そのような対策を森田さんが考えられたのは、どのような狙いや思いがあったのでしょうか?
当初、メドピアグループ内のサービス開発体制としてフロントエンドエンジニアが足りておらず、バックエンドエンジニアがフロントエンド・バックエンド両方を実装するような体制となっており、フロントエンドに関する設計や実装で迷いが発生することが多く課題感がありました。
さらに今回のバージョンアップは規模が大きく、自分自身が全ての範囲を見切れない可能性が高かったため、サービスの品質担保の意味でも、一定対応できる人数を増やす必要がありました。
実際のサービス開発のシーンでも、フロントとバック両方の技術が必要なことも多いので、いい機会だと捉えたのです。
また、フロントエンドの技術要素に興味を持っているメンバーは多いものの、フロントエンドの技術を利用した開発が行えるかどうかは案件のアサインに依存しており、なかなか興味を持った全員が通常業務の中で知識を獲得するのが難しいという状況も、改善したいと考えていました。
昨今の開発ではフロントエンドの領域が比較的盛り上がりを見せているため、参加するエンジニアが楽しんで仕事に取り組んでくれたらいいな、という狙いも個人的にはありました。
結果はどうだったのでしょうか?
実務を通して学んでもらうことで、チームとしてのフロントエンドの基礎的な技術力アップに貢献できたのではないかと考えています。
実際、チェックリストを用いてスキル獲得の過程を可視化していったので、私も参加者本人も成長実感をもつことができました。
留学制度に参加してもらったエンジニアが、その後各自の開発案件に戻ってフロントエンドの領域をリードしてくれているというニュースを聞くと、とても嬉しいですね。
また1か月という長期間にわたり業務を調整し、フロントエンド関連のタスクへのアサインを快諾いただいた事業部の方々にもあらためて感謝の意を伝えたいです。
二足のわらじを履くことにこだわり、成長し続けられる組織の起爆剤に
![](https://assets.st-note.com/img/1718251528911-TF9dDjKKNU.jpg?width=1200)
前回の受賞から6年近く、またその間に育休も経験され、仕事に対する価値観や姿勢に変化は感じられますか?
前回の受賞時は、自分自身も若く、がむしゃらに“頑張った”印象があります。
一方で当時と比較して、メドピアグループの規模や自分が置かれている立場も大きく変わり、最近では“頑張るだけでは進まない”ものに対応することが増えたように感じています。
子どもが生まれて育児・家事にも協力するため効率性を意識するようになったこともありますが、自分一人で頑張っても絶対に達成できない大きな課題・目標に対峙することが多くなったので、仕組みを作ったうえで、皆で手分けして効率よく“いかに自分が頑張らなくても進むようにするか”を考えるようになりました。
自分自身に対するモチベーションで仕事をしなくなったようにも感じています。
間接的にも含めて自分が携わることによって、皆が気持ちよく進められて、良いサービスを作れたらいいかなと。
サーバーサイドからフロントエンドに主軸を移してこられた森田さんですが、これからの抱負をお聞かせください。
フロントエンドの領域もバックエンドの領域も、どちらも突き詰めればいくらでも、という奥が深い技術です。
webサービスを開発していくにはどちらもできることに越したことはないので、当面はフロントエンドに重めに軸足を置いて勉強はしていきたいですが、両方に携わっていきたいですね。
私もバックエンドを中心に今まで開発に携わってきたこともあり、まだまだ知識が不足しているので、これからも色々な勉強会や施策等を通して、他エンジニアの方々と一緒にフロントエンドのスキルを獲得していければと思っています。
メドピアではサービス開発を推進するフロントエンドエンジニア・サーバサイドエンジニアを積極募集中です!
医療やヘルスケアに興味がある方はもちろん、技術で課題を解決したいという方も大歓迎。ぜひ一度カジュアルにお話しましょう!
その他エンジニアの紹介記事はこちら
マガジンをフォローいただくと、メドピアで働く人や制度、働き方のことがより知れる情報をお届けします!
MedPeer Style動画配信中!
#メドピア #MedPeer #ヘルステック #医療DX #企業のnote #エンジニア #フロントエンド #サーバーサイド #リードエンジニア #award #社内表彰 #
キャリアチェンジ #Vue .js #Vue3 #育休 #男性育休 #留学 #社内留学 #採用広報 #技術広報