こんにちは、フロントエンドエンジニアのHiromiです。

と、よく名乗っていますが「フロントエンドエンジニア」をご存知でない方もきっといらっしゃると思います。
今回は、コーディングに関わる肩書についてご紹介させていただきます。

そもそも、そんなに肩書の種類があったの？

近年よく使われているものでは

• コーダー
• マークアップエンジニア
• フロントエンドエンジニア

などがあります。

実際にコーディングに従事している方や、エンジニア職の方以外にとっては割となんでもいいというか、ややこしいだけかもしれないですね（笑）

詳細は後述しますが、私自身はエンジニア職以外の方にとっては、厳密に分けて認識する必要はないとは思います。
ただし、チームメンバーの選定の際などに参考になればと思いますので、その目安としてご紹介させていただきます。

なぜそんなに肩書を分ける必要があるの？

コーディングに関わる環境は、近年技術の進化とともに大きく変わってきており、年々複雑化しています。
コーディングといっても、HTMLやCSSのみを扱うのみではなくなり、 個人によりかなり大きな技術差や専門領域の差が出ています。

その差を明示化するために、新しい肩書が出てきました。

一概には言えませんが、一般的には
コーダーの上位職がマークアップエンジニア、マークアップエンジニアの更に上位職がフロントエンドエンジニアといわれています。

ただし会社勤めの方などで肩書が変わらずマークアップエンジニアやコーダーのまま、上位の職のお仕事をされているかたも多くいらっしゃると思います。

また、複数の技術項目があり、個々人により習得されている技術も異なりますのでご留意ください。

コーダーとは

まず、ご存知の方が一番多そうな「コーダー」という肩書について。
一番昔からあり、認知度も比較的高いです。

デザイナーが用意したデザインを元にHTMLとCSSでコーディングし、Web上に再現します。

マークアップエンジニアとは

よく「コーダー」と同じように扱われており、実際に仕事内容もよく似ていますが、厳密に定義した場合には少し違います。

マークアップエンジニアにはHTMLやCSSへの 更に深い知識と経験、HTMLの構造やSEO、ユーザビリティ、アクセシビリティを意識した設計が求められます。

たとえば、もしチーム内にマークアップエンジニアとコーダーがいる場合には「マークアップエンジニア」がサイト全体のHTMLとCSS設計を行い、コーダーが下層ページなどの量産コーディングを行う、というような体制になるはずです。

フロントエンドエンジニアとは

一般的には、上記にHTMLやCSSに加えて、JavaScript、WordPress、デザイン、バックエンドの知識など…
要はフロントエンドのことを一通り出来る人ということになります。

そもそも「フロントエンド」って…？

サーバーやシステムなど目に見えない部分を「バックエンド」
それに対して、ブラウザ上で見える部分を「フロントエンド」と呼びます。
HTMLやCSSによるデザインの再現、飾り、またはアニメーションなど、ブラウザ上で動作して見えている部分です。

フロントエンドエンジニアにできることって？

コーダーやマークアップエンジニアが出来ることは一通り出来ます。
また、それに加えて一番大きな違いはJavaScriptです。

サイトを閲覧中に動きのついている部分、アニメーションの部分などを担っているのがJavaScriptです。

JavaScriptは近年進化を続けており、様々なフレームワーク（Vue, React, Angularなど）が開発され、静的なサイトの制作でも開発時にコマンドラインを使用してファイルをコンパイルするようになるなど、大きな変化がありました。
（少し専門的になりすぎるので詳細は割愛します）

JavaScriptを使った開発は常に発展し続けていて、最近ではバックエンドのシステムを必要とせず、JavaScriptのみでブログなどのシステム構築が可能となってきています（JAMStackという理念で、このサイトも意識して作成しています）し、バックエンドとフロントエンドの境目がとても曖昧になってきています。

フロントエンドエンジニアとは、そういった最新の開発環境での開発および環境構築が可能で、また最低限のデザインやバックエンドの知識（WordpressやPython、PHPなど）も必要となります。

ざっくりまとめ

絵心がなくて恐縮ですが、図式化してみました（項目は一例です）

個人的には、コーダーやマークアップエンジニアの次に、フロントエンドエンジニアで、急に対応範囲が増えすぎない？（笑）と思うので
フロントエンドエンジニアという職種も、これからもっと細分化されていくのではと思っています。
すでに個々人でいろいろ名乗られている方はいらっしゃいますね。

結局なんて呼べばいいの？

実際には「コーダー」なり「デベロッパー」なり「エンジニア」なり、呼びやすいかたちで呼べれば十分だと思います。

「マークアップエンジニア」であればコーダーの要件も満たしていますし、「フロントエンドエンジニア」であればすべて満たしていることになります。

お仕事を依頼される立場の方であれば、相手がどの肩書を名乗っているかにより、ある程度の技術力や経験値などを推察出来る基準になりますので、今後の人材選定などでご参考になれば幸いです。

ちなみに英語圏では「フロントエンドエンジニア」より「フロントエンドデベロッパー」のほうが一般的なので、私は英語表記の際は「Front-end developer」としています。