コーダーとフロントエンドエンジニアの違い
「コーダー」が進化し、「フロントエンドエンジニア」という職種が生まれました。
今後、コーディングのみのスキルを持つコーダーがWeb業界で生き残っていくのは難しいです。時代を振り返りつつ、「コーダー」と「フロントエンドエンジニア」の違いについて解説します。
コーダーとは?
コーダーは、HTML/CSSとわずかなJavaScriptを用いてサイトを作る(コーディングをする)職種です。HTMLコーダーやマークアップエンジニアとも言われます。
必要なスキルは、主に、HTML・CSS・基礎的なJavaScript(あるいはjQuery)の3つです。
Webの黎明期から存在する職種です。
かつてはWebサイトの作り方や構造はとてもシンプルだったので、少ないスキルしか持たないコーダーも必要とされました。
しかし、ここ最近では、Webサイト上でアニメーションを多用したり、ReactやVue.jsなどのJavaScriptライブラリによるサイト制作が進む中で、コーダーのスキルのみでは時に不十分になってきました。
また、STUDIOやWixなど、いわゆる「ノーコード」と呼ばれるサービスを使うことで、デザインパーツをサイト上で組み合わせるだけでサイトが制作できるようになってきました。他にも、AIの自動コーディングの技術もまだまだ未発達ですが、今後は広く普及していくように思います。つまり、シンプルなサイトであれば、コーディングを必要とせずに制作が可能になってしまっているのです。
コーダーは今後は消えていく職種の一つです。
フロントエンドエンジニアとは?
フロントエンドエンジニアは、簡単に言えば、コーダーの進化版の職種です。Webサイトのフロント部分の開発を担当するため、こう呼ばれていますが、海外では「Web developer(ウェブ・デベロッパー)」という表現が一般的です。
Webサイトがどんどん高度になっていく中で、それを実現するためにフロントエンドエンジニアが誕生しました。コーダー同様に、HTML/CSS のスキルは当然持ちますが、ずば抜けて必要がなのが、JavaScriptのスキルです。複雑なアニメーションにはJavaScriptは必須だし、Facebookなどで用いられているReactなどのJavaScriptライブラリが近年のサイト開発ではシェアが大幅に広がってきています。そのため、JavaScriptのスキルが現場ではものすごく重宝されてきているのです。
Webサイトの制作環境(自分のPC内)もどんどん進化しています。作業を自動化するGulp、CSSの記述をラクにすするSass、HTMLの記述をラクにするPug、ES6(最新のJavaScript)をコンパイルしブラウザで実行可能にするBabel、CSSやJavaScriptを一つにまとめてくれるWebpackなど様々なツールが存在します。現在のWeb制作ではこれらのツールを使いこなす必要があります。
他に、HTMLとCSSの記法では、BEM(Block-Element-Modifier)モデルも普及しており、フロントエンド領域はつねに進化し続けているため、いつも最新のトレンドやツールの知識を吸収し続けなければなりません。
JavaScriptのスキルが必要なので、「フロントエンドエンジニアはある程度はプログラミングの能力が必須」ということです。なので、そうそう簡単にはフロントエンドエンジニアにはなれません。そのため、コーダーに比べると給料はかなり高くなります。400〜800万円レベルでしょうか。
フロントエンドエンジニアの中には、RubyやPHPも扱い、さらにサーバーやデータベースのスキルをモノにする優秀な人々もいます。こういった人たちを「フルスタックエンジニア」と呼びます。こうなるともはや無双状態です。年収は800万は超えて、1000万円レベルになってきます。
コーディングを勉強しはじめて、「あ、コーディング好きかも!」と思えたら、目指すべきはフロントエンドエンジニアです。コーダーレベルにとどまらずに、JavaScriptを勉強して、どんどん最新のツールを使って、ステップアップしていきましょう!
このサイトでは、本当にWebデザインのスキルを磨きたいなら、未経験の方はまずはWeb制作会社か教育体制のしっかりしている事業会社に正社員で入社することを強くオススメしています。
やはり派遣でもなく、アルバイトでもなく、長く在籍する可能性のある正社員にこそ成長できるお仕事を振ってくれるのです。派遣やアルバイトは、リンク張り替えやテキスト修正など成長しづらい作業をやらされがちです……。
未経験OKで正社員のWebデザイナー・フロントエンドエンジニア案件を多く保有しているのが、IT系に強い『ワークポート』です。ワークポートでも、さすがに未経験の方にWeb制作会社を紹介するのは難しいですが、事業会社のWebデザイナー・フロントエンドエンジニアを紹介してもらえる可能性があります。また、Webデザイナーにこだわらなければ、WebディレクターやECサイト担当者などの求人も多数保有しているため選択肢の幅が広がります。一度面談を受けておきましょう。
Web/IT系特化の転職サイト『Green』に登録しておきましょう。Web系転職の定番サイトです。
「デザインスキルを一気に上げる方法は「レビュー」です。つまりデザインに対するダメ出しを何度もしてもらって直すことを繰り返すことで、デザインスキルは急激にレベルアップします!
これを一番実現しやすいのが会社です。会社なら現場で上司や先輩にサイトやバナーのデザインのレビューをしてもらえるからです。じゃあ就職しておらず未経験のうちはどうすればいいかというと、「レビュー付きのデザインスクールの活用」です。普通のスクールはPhotoshopの使い方やコーディングの基礎を学ぶだけで「デザインスキル」についてはほぼ教えてくれません。レビュー付きのデザインスクールは運営側にも高いデザインスキルが求められるため非常に少なく希少性が高く『fullme』が現在は最高峰だと僕は思っています。「けっきょく、よはく」「ほんとに、フォント」など有名デザイン書籍を手がけるingectar-eの運営です。
僕が駆け出しの頃に『fullme』があれば絶対に受講していました...。デザインスキルを高めたい人はぜひ受講しましょう。
「ポートフォリオを作ってみたけど不安...」「周りにレビューをしてくれる人がいない...」
そんなお悩みを解決するために、ポートフォリオのチェックリストを作りました!27,000文字以上の大ボリュームです笑。noteで販売中です。激安のワンコイン500円です。このチェックリストで改善点を見つけて、少しでもポートフォリオの質を上げて、自分が望む就職に繋げましょう!
ご質問や感想など、お気軽にどうぞ!