70
54

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 5 years have passed since last update.

Money ForwardAdvent Calendar 2015

Day 23

スタートアップでのフロントエンドエンジニアの役割

Last updated at Posted at 2015-12-23

スタートアップでのフロントエンドエンジニアの役割

こんにちは、マネーフォワードでフロントエンドエンジニアをしている頼本です。
本記事ではスタートアップでのフロントエンドエンジニアの役割、実態、仕事内容、求められる物・・・などなどご紹介します。

マネーフォワードのバックエンドはRailsを使っているので、それ前提で記事を書かせて頂きます。

スタートアップのフロントエンドの実態

私がマネーフォワードに入社したのは2013年4月。当時は家計簿ソフト マネーフォワードをリリースして間もない頃で、バックエンドエンジニア数人、デザイナー0人、フロントエンドエンジニア0人という状況でした。(外部の協力者は除く)

その後、会計ソフト「MFクラウド会計」請求書作成ソフト「MFクラウド請求書」などをリリースしましたが、その間バックエンドエンジニア、デザイナーは徐々に増えていきましたが、フロントエンドエンジニア増えない\(^o^)/という状態が続きました。

今でこそ人数は増えましたが、なんやかんやで約2年近くフロントエンドエンジニアは1人でした。

そもそもフロントエンドエンジニアの仕事って何するの?

「フロント?HTMLとCSS書いてるんでしょ?」と思われる方も少なからずいると思うので、そもそもフロントエンドエンジニアの仕事って何するの?という部分を紹介します。

一般的なフロントエンドエンジニアの仕事

会社によってはもっと細分化されていたり、幅が広かったりはしますが、
一般的には以下のような仕事がフロントエンドエンジニアの仕事です。

  • CSS設計・実装
  • HTML設計・実装
  • JavaScript設計・実装

マークアップエンジニアとの違いは?

フロントエンドエンジニア、マークアップエンジニア…未だに言葉の定義は曖昧ですが、おおよそ以下に分類出来ます。

マークアップエンジニア
デザイナーが作ったデザインを形にする人
HTML、CSS、JavaScriptが書ける人。
フロントエンドエンジニア
CSS、HTML、JavaScriptの設計・実装を行う人。
Web標準やアクセシビリティに準拠したコーディングを行い、かつ保守性・可読性に優れた設計が求められる。
JavaScriptではプラグインのカスタマイズや1から自分で設計・実装する能力が必要となる。

HTML、CSS、JavaScriptは他の言語と比べて敷居が低く、割りと誰でも書けてしまう言語です。
誰でも書けてしまう言語だからこそ、設計面や保守性・可読性は軽視されがちで、簡単に壊れてしまう言語と言えます。
それらを解決するのもフロントエンドエンジニアの役割の一部です。

スタートアップでのフロントエンドエンジニアの仕事

では、スタートアップでのフロントエンドエンジニアと一般的なフロントエンドエンジニアでは何が違うのか?
スタートアップではフロントエンドエンジニアだけではない、バックエンドエンジニア、デザイナーも足りていない事が多いです。
そのため、バックエンドエンジニアとデザイナーの中間層であるフロントエンドエンジニアは、バックエンドエンジニア、デザイナーの両スキルが求められます。

■スタートアップで求められるフロントエンドエンジニアのスキルセットイメージ
02.png

文頭に書かせて頂いた人が増えないという状況は、求められるスキルセットが高いという事も原因の1つかもしれません。

一番大事だと思っている能力

私がスタートアップのフロントエンドエンジニアで一番大事だと思ってる能力は良しなにやる力だと思っています。

スタートアップの現場でよくある話し

依頼)新しい機能作ったけど、使いづらいから使いやすくしたい。
訳) 該当ページのUI、もしくはデザインがユーザーにとって使いづらいので、改善してください。

依頼)このページをスマホでも使えるようしたい。
訳) デザインはないけど、レスポンシブ対応をしてください。

依頼)キャンペーン始めるから、キャンペーンの条件でこの機能・バナー表示したい。
訳) キャンペーンに該当するユーザー、表示条件に応じて、コンテンツを出し分けてください。

これらの仕事は分業しているような会社では、まずはデザイナーやバックエンドエンジニアが入り、その後フロントエンドエンジニアが実装・・・となりますが、スタートアップではフロントエンドエンジニア1人で良しなに解決する場合が多いです。
そして良しなにするためには、フロントエンド以外のスキルも必然的に必要となってきます。

スタートアップのフロントエンドエンジニアはこれらの(無茶)振りにも耐えられるスキル・精神が求められます。

まとめ

よくフロントエンドエンジニアはバックエンドエンジニアとデザイナーの架け橋である。という言葉を目にしますが、スタートアップでは、架け橋になるだけではなく、それぞれの領域に足を踏み込まなければならない場面が多くなります。

それだけに、「スタートアップでのフロントエンドエンジニアの役割」は多岐に渡り、やれる事も、やらなければならない事も多いです。

このような環境なので大変な事も多いですが、やりがいも大きく、エンジニアとしてもビジネスパーソンとしても大きく成長できる環境と言えます。

以上、スタートアップのフロントエンドエンジニアに興味がある方々の一助になれば幸いです。

70
54
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
70
54

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?