Webエンジニアの仕事ってこんな感じなんすよ！〜フロントエンドエンジニア〜

今回はwebエンジニアの具体的な仕事と必要なスキルについて説明していきます。前回のwebエンジニアがフロントエンドエンジニアとバックエンドエンジニアに分かれると説明したので、深堀する形で書いていきます。

今回は、フロントエンドエンジニアってどんな仕事で必要なスキルが何かって話をしていきます。

1、フロントエンドエンジニアって？
2、フロントエンドエンジニアの仕事って
3、フロントエンドエンジニアに必要なスキル

1、フロントエンドエンジニアって？
フロントエンドエンジニアとは、Webブラウザ上でユーザーが実際に目にしたり操作したりする部分の開発を担当するエンジニアです。

ただWebサイトやWebアプリケーションの見た目を良くするだけではなくて、デザイナーが作ったデザインを構築したり、ユーザーインターフェース（UI）、ユーザーエクスペリエンス（UX）、SEOなどに考慮した設計も求められます。

2、フロントエンドエンジニアの仕事って？
そんなフロントエンドエンジニアの仕事でも、業務として発生しうる内容としては、3つです。
・コーディング
・フレームワークの活用
・SEOについて

この3つの業務をすすめるにあたって必要なスキルを説明していきます。

〇コーディング
コーディングとは、皆さんが想像するTHEエンジニアの部分で、プログラミング言語を使ってプログラミングコードを記述していく作業のことです。

メインとしてはHTML、CSS、JavaScriptの三つのプログラミング言語を適切に使い分けることです。

言語ごとに簡単に説明すると、こんな感じです。
・HTML：ページの文章構成の指示だし
・CSS：ページにデザインを加える
・JavaScript：ページにアニメーション動作を加える

○フレームワークの活用
簡単に言うと、一から作らずフォーマットを使おうぜ！といった感じです。

その中でも、フレームワーク毎に、特徴が違うので作りたいものによってフォーマットを変えようという感じです。

フレームワークを使えると、工数削減&バグ削減と、リソースもリスクも減らせるので、大きなメリットになります！

一方で、フレームワーク毎に覚える内容もあって、まあ大変なんすよね、、

簡単にフロントエンドで使われているフレームワークの種類と特徴は、こんな感じです！
・jQuery：ブラウザ（Google,Safariなど）を意識せずにコードをかけます
・React.js：変えたい部分だけ変えられて、どんなアプリにでも実装できます
・Vue.js：HTMLに近く、少ない記述で実装しやすいです
・AngularJS：実装する上で必要な機能がそろってます

○SEOについて
SEO(Search Engine Optimization)とは、検索エンジン最適化のことです。

わかりにくいので、簡単に言うと主には2つで、
・自分のWebサイトの内容を、Googleなどの検索エンジンに理解しやすいように最適化する
・自分が伝えたい情報をユーザーにきちんと届けられるように検索エンジンが理解しやすいように最適化する

この2つを進めるにあたって、仕事としては3つで、
・内部施策（キーワード確認、HTMLの最適化やユーザー体験の向上など）
・外部施策
・コンテンツ制作

3つの仕事を簡単に書くと、こんな感じです
・内部施策：キーワードの最適化・HTMLタグの最適化 etc...
・外部施策：WebページのPRによるリンク構築 etc...
・コンテンツSEO：検索ニーズに合ったコンテンツの企画、ページのメンテナンス etc...

3、フロントエンドエンジニアに必要なスキル

2で説明した内容で書かせてもらいます。

〇コーディング
HTML、CSS、Javascriptのコードをかけて、適切に使い分けるようにすることが求められます。

○フレームワークの活用
作りたいサイトに合わせたフレームワークを使えることが求められます。
簡単に紹介したフレームワークの4つ（jQuery、React.js、Vue.js、AngularJS）以外にもあるので、複数使えたり、汎用性の高いものの習得をすることがお勧めです！

〇SEOについて
事前の準備として、効果がわかるツールを導入します。
その上で、検索されるキーワードを選んだり、検索ユーザーのニーズを満たす良質なコンテンツの作成ができたり、検索エンジンにWEBページを適切に評価させることや良質な被リンクの獲得ができるといいかと思います！

もう少し上級になると、効果確認や課題の抽出に伴った解決策の考案などできるとさらにSEOの専門家なスキルセットになりますね！

簡単に書いてきたつもりですが、ちょっと長くなってきたので、もっと具体的な話は、またの機会に！

次回！【Webエンジニアの仕事ってこんな感じなんすよ！〜バックエンドエンジニア〜】