こんにちは、株式会社カケハシでおくすり連絡帳 Pocket Musubiの開発を担当している渡辺です。

カケハシのエンジニアはフロントエンドもバックエンドのAPIサーバーも開発を担当しています。どちらかといえばフロントエンドの方が知識・経験ともに自信があるという背景から、今回はカケハシのフロントエンドエンジニアについて書きます。

カケハシでのフロントエンドエンジニア

カケハシであまりフロントエンドエンジニアという表現は用いず、アプリケーションエンジニアという表現を用いています。アプリケーションとして価値を生み出すことが主眼であって、それがフロントエンドの領域であろうがバックエンドの領域であろうが問わず、価値を出せるかが大事なのです。

フロントエンドエンジニアとしての価値向上

とはいえ、フロントエンドエンジニアとしてスキルを積み上げてきた人は、なかなかやってきたこと以外にまで手を広げるのは難しいのが現実です。一度立ち止まり、自分はどんなことができて、どんなことができるようになると価値が上がるかを考えることは大事です。もちろん、カケハシのプロダクトの価値を創出するのも大切ですが、とはいえエンジニアならば、市場価値を上げていきたいですよね。市場価値が上がれば、社内での貢献力もアップするはずです！

フロントエンドエンジニアのタイプ

ここでフロントエンドエンジニアのタイプについて考えていきます。

HTML/CSSバリバリさん

HTMLやCSSをバリバリ書くよ
CSSとかはSCSS/SASSとか使うよ
JavaScriptも書けるよ
Storybookとかで部品化しようかな？と考えている

デザインしてコードに落とすさん

Photoshop/Illustratorとか任せろ！
HTML/CSSに落とすのも任せろ！
JavaScriptはワカラナイ・・・

JavaScriptバリバリさん

ReactとかAngularでWebアプリ作るぜ！
Reduxとか使ってやってみるぜ！
CSSは書きたくないなぁ・・・

フロントエンドエンジニアといってもさまざまですね。

じゃあフロントエンドエンジニアはどう成長すればいいの？

ここで、roadmap.shのフロントエンドのロードマップを見てみましょう。 roadma.shは、ロードマップ、ガイド、その他の教育コンテンツを作成するコミュニティです。そこでのフロントエンドのロードマップを見てみます。

https://roadmap.sh/frontend

このロードマップ見てるとわかりますが、膨大なスキルセットが求められています。これをみただけでは、自分はどうやって成長したいのか、途方に暮れてしまいます。

少しずつ成長していきましょう

まず自分が得意な部分を列挙します。そこからどこを伸ばしていけばいいか、ロードマップと睨めっこして考えます。

たとえば、ずっとAngularをやっていたならば、Reactにチャレンジしてみましょう。 Angular/Reactともに宣言的にUIを書くという点では同じフレームワークですが、その思想の違いに触れて、理解が深めてみましょう。

また、AngularでNgRXを使ってなかったら導入してみましょう。 Serviceだけでは状態が色々なところにあるため、メンテナンスがとても辛いです。状態管理をまとめれば、メンテナンス性も上がります（SSOT/Single Source Of Truthというものですね。）

ReactやAngularでロジックを書くことをやってきたなら、CSSでレイアウトをすることに挑戦してみましょう。今やっているところから、少しずつ自分のできるところを増やしていき、活躍の場を広げてみましょう。もう一歩踏み出して、ユーザビリティーの知識があると、デザイナーとのコミュニケーションが円滑になります。せっかく画面を担当しているので、見た目も含めて価値を上げることを考えることができるといいですよね。

zukai-3