今回はフロントエンドエンジニアを目指す理由についてお伝えしていきます。 以前執筆した内容に一部変更を加えております。

フロントエンドエンジニアをなぜ目指すのか

フロントエンドエンジニアをなぜ目指すのかを考えていきます。

Why フロントエンドエンジニア？

• 専門スキルがなくても目指すことが可能
• フロントエンドの重要性がかなり高い
• フロントを制するものが全てを制する

それぞれ一つずつ詳しく見ていきます。

専門スキルがなくても目指すことが可能

フロントエンドエンジニアは専門的なスキルがなくとも目指すことが可能です。 理由は以下になります。

専門スキルがなくとも目指せる理由

• 学歴や特別な資格が必要ない
• 独学でスキル習得が可能

学歴や特別な資格が必要ない

学歴について

フロントエンドエンジニアになるために 学歴は必要ありません。

あったほうがいいという意見もあるかと思いますが 学歴がなければできない業務ではありません。

大事なのは学歴よりもポテンシャルになります。 何事にも意欲的に挑戦していくことと
志し高く継続的に成長していくことが求められます。

資格について

フロントエンドエンジニアになるために
特別な資格は必要ではありません。

あった方が良い資格（基本情報技術者試験）などはありますが
ないから仕事ができない、働けないというとはありません。

働く上で資格より大事なことはスキルです。

プロダクト開発やプロジェクト開発では以下が重要になります。

プロダクト開発やプロジェクト開発で重要なこと

• 仕様に沿って実装ができること
• 要求を満たす実装ができること

そのためためしっかりと対応ができるスキルを身につけることが大事になります。

独学でスキル習得が可能

フロントエンドエンジニアのスキルは独学で身につけることが可能です。 理由は以下になります。

スキルを独学で身につけることが可能な理由

• スキル習得は難しい勉強ではなくドキュメントを参照して書く力
• スキル習得の１つの判断はどういったアプリを作ったか

スキル習得は難しい勉強ではなくドキュメントを参照して書く力

フロントエンドエンジニアのスキル習得に
難しい勉強は必要ありません。 大事なことはドキュメントを参照して書く力です。

エンジニアというと理系ゴリゴリで
難しい計算を解いて答えを導き出していくような印象を お持ちの方もいらっしゃるかもしれませんが それらは研究職やギークな精鋭の方々になります。

というのも最近はエコシステムといって 専門の知識がなくても簡単に高度なプログラムを書くことができる フレームワークやライブラリが登場しています。

詳しくはフレームワークやライブラリについては後述の記事で紹介します。

そのためこれらを活用して如何に品質が高いものを作っていけるかが重要であり
難しい知識よりもライブラリやフレームワークを活用する力が必要になります。

また一般的によく利用されているライブラリやフレームワークは
ドキュメントが充実しています。

そのためドキュメントを見ながら実装していくことができる力が ライブラリやフレームワークを活用する力になります。

スキル習得の判断の１つのはどういったアプリを作ったか

スキルがあるかないかを判断する指標として
これまでにどういったアプリケーションを作ったことがあるか
ということが重要な指標になってきます。

というのも一般的な評価軸としては どういった処理ができるか、どういったUIが作れるかです。

どういった処理ができるか

処理については以下の様な処理をどう設計して実装できるかです。

どういった処理ができるかの例

• 非同期処理（データの取得、送信）
• ルーティング
• Dom操作
• ページング
• 状態管理

どういったUI（ユーザーインターフェース）

UIについては以下の様なUIをどう設計して実装できるかです。

どういったUIが作成できるかの例

• パーツ（ダイアログ、スケルトンスクリーン、タブ）
• フォーム（入力エリア、ボタン、チェックボックス）
• アニメーション（canvas、SVG、WebGL）
• レスポンシブ

アプリケーションからスキルの評価

これらの評価軸が含まれるアプリケーションを作っていくことで
どのスキルがあるかの判断軸になり評価につながってきます。

フロントエンドエンジニアになるためには専門スキルがなくても目指すことが可能

このようにフロントエンドエンジニアになるためには学歴や特別な資格が必要ありません。
必要なことは独学で身につけることが出来るドキュメントを参照して書く力とどういったアプリを作ったかです。

フロントエンドの重要性がかなり高い

昨今フロントエンドの重要性がかなり高くなってきました。
その理由は下記になります。

フロントエンドの重要性がかなり高い理由

• アプリケーション開発の変化
• ユーザー体験の重要性

アプリケーション開発の変化

• Webページの多様化
• LAMPからへSPAへ

Webページの多様化

ひと昔まえはPCサイト一択だったWebページですが
最近はものすごい多様化が進んでいます。

多様化の例

• 複数のOS、ブラウザアップデートによる差分
• スマホ、タブレットなどの端末によって違う画面サイズ
• インターネットが搭載された様々な機器の登場（ゲーム、テレビなど）

フロントエンドエンジニアはこれらの多様化に対して
それぞれ対応していく必要がありそのためのスキルが必要になってきます。

LAMPからへSPAへ

これまでの開発はLAMPが主流

ひと昔まえのWebアプリケーションは
LAMP（Linux + Apache MySQL + PHP）といわれる構成で開発されていました。

LAMPが主流だった理由

LAMPが主流だった理由はオープンソースで利用でき構築や開発が比較的簡単にできたことがあると思います。

LAMPのアーキテクチャパターンはMVC

そしてこのLAMPでは主にMVCという役割分担で開発します。

MVCにおけるエンジニアの役割分担

MVCにおけるModel（データ処理）とController（ロジック）などのコアな実装はバックエンドエンジニアが担当します。
フロントエンドエンジニアはView（見た目）のみを担当します。

そうするとフロントエンドが行うことはバックエンドから受け取ったデータを出力するだけです。
そのためプログラムをゴリゴリ書いて実装するのはバックエンドエンジニアの役割でした。

SPAの登場

時代の流れは早いです。
これまではLAMPのような構成から
UI/UXを含めたユーザー体験をよくしていくことが重要視され
SPAというパターンが登場しました。

SPAとはシングルページアプリケーションのことで
単一のページでコンテンツ切り替えを行うアーキテクチャになります。

SPAのアーキテクチャパターンはMV〇〇

SPAを構築するためのフロントエンドのライブラリやフレームワーク（ReactやVueやAngulerなど）があるのですが
これらはMV〇〇というアーキテクチャパターンになります。（代表的なものはMVVM）

MV〇〇におけるエンジニアの役割分担

そしてフロントエンドにおけるMV〇〇は
画面上でデータを制御するため基本的にフロントエンドエンジニアが全て実装を行います。

フロントエンドの実装

具体的にフロントエンドの実装はAPIへデータ取得のリクエストから
受け取ったデータを整形して画面に表示するところ

ルーティングといわれるリクエストされたURLに対して
どのページを表示するかどうかといったテンプレート管理まで含みます。

最近のアプリケーションはフロントエンドが中心

このように最近主流であるアプリケーション設計で開発されるアプリケーションは
フロントエンドが実装する役割の重要性が高い傾向にあります。

ユーザー体験の重要性

先程のSPAが登場した背景にもありましたが
昨今ユーザー体験をあげる重要性が非常に高くなりました。

ユーザー体験をあげる重要性

Amazonが過去に行った調査で 「サイト表示が0.1秒遅くなると売り上げが1%減少し、1秒高速化すると10%の売上が向上する」
という結果が報告されました。

仮に売り上げが10億円のECサイトだった場合
1秒高速化することで1億円売り上げがプラスになることになります。

ここまで売り上げに大きく影響するとなると
ビジネスとして非常に重要度が高いことが理解できると思います。

ユーザー体験はフロントエンドが担当

このユーザー体験は基本的にフロントエンドの役割になります。

フロントエンドが担当するユーザー体験

• ページの遷移の快適さ
• サイトの見やすさ
• フォームの入力しやすさ

そのためフロントエンドが担当する領域のユーザー体験をあげる重要性が 強く求められるためフロントエンドの役割が非常に重要になってきます。

Webアプリケーション開発する上でフロントエンドの重要性がかなり高い

このようにアプリケーション開発の変化したことと ユーザー体験の重要性がどんどん高くなっていることを踏まえると フロントエンドに求められる役割がかなり高いことがわかります。

フロントを制するものが全てを制する

フロントエンドを制するものが全てを制するといっても過言ではありません。 というのも今現在におけるアプリケーション開発は煩雑なサーバー構築、運用、監視、障害対応といったことが不要になり
アプリケーションの開発のみへ注力する仕組みが充実してきています。

またバックエンドの開発においてもフロントエンドエンジニアが開発できる仕組みが整備されています。

最近のアプリケーション開発

• インフラ→フルマネージドサービス
• バックエンド→サーバーレス + Node.js

インフラ→フルマネージドサービス

フルマネージドサービス

フルマネージドサービスとはサービス開始に必要なサーバ構築、監視・障害対応・セキュリティ対策まで
サーバ運用に関する全ての作業代行を提供するサービスのことをいいます。

フルマネージドサービスの活用

フルマネージドサービスを利用することで
インフラにおける煩雑な部分は全てベンダー（サービス提供会社）が実施し
本来注力するべきアプリケーション開発に力を入れられるようになっています。

フルマネージドサービスはインフラエンジニアが不要

フルマネージドサービスを利用することで
結果的にインフラエンジニアがいなくても安定したサーバーでアプリケーションを運用することが可能になります。

バックエンド→サーバーレス + Node.js（ノードジェイエス）

サーバーレス

サーバーレスもフルマネージドサービス同様に
サーバーの管理はベンダーに任せアプリケーションの部分のみ開発するモデルになります。

サーバーレスの活用

サーバーレスは一般的に有名なAWSのサーバーレスアーキテクチャパターンでいうと
API Gateway + Lambdaで構築できます。 ※AWS以外にもMicrosoft AzureやGCPでも同様のサービスがあります

API Gateway（エーピーアイ ゲートウェイ）

API GatewayとはAPIのリクエスト先をまとめて管理できるもので
管理画面から設定が可能です。 アクセスを制限したり、リクエストに応じて呼び出す先を設定します。

Lambda（ラムダ）

Lambdaとは呼び出しがあったら起動し
必要に応じて処理を行い結果を返す仕組みです。 一定時間ごとの処理の実行やリクエストに応じてDB（データベース）へ問い合わせをして
結果をもとにデータを加工して結果を返すことができます。

サーバーレスはフロントエンドエンジニアで開発可能

API Gatewayについては管理画面から設定可能です。 そしてLambdaについてはNode.jsというサーバで実行できるJavaScriptでコードをかけるため
フロントエンドエンジニアがサーバー側の処理も担当できます。

最近のアプリケーション開発は全てフロントエンドエンジニアで実施することができる

このように最近のアプリケーション開発は インフラ、バックエンドの部分をフルマネージドサービス、サーバーレス + Node.jsを利用することで
専任のエンジニアが不要になり全ての開発をフロントエンドエンジニアが担当することができるようになりました。

まとめ

なぜフロントエンドエンジニアなのかについて理解いただけましたでしょうか。
今回のポイントは以下になります。

今回のポイント

専門スキルがなくても目指すことが可能

フロントエンドエンジニアになるためには学歴や特別な資格が必要ありません。
必要なことは独学で身につけることが出来るドキュメントを参照して書く力とどういったアプリを作ったかです。

フロントエンドの重要性がかなり高い

アプリケーション開発の変化したことと
ユーザー体験の重要性がどんどん高くなっていることを踏まえると
フロントエンドに求められる役割がかなり高いです。

フロントを制するものが全てを制する

最近のアプリケーション開発はインフラ、バックエンドの部分をフルマネージドサービス、サーバーレス + Node.jsを利用することで
専任のエンジニアが不要になり全ての開発をフロントエンドエンジニアが担当することができるようになりました。