こんにちは！アテナのエンジニア、コーダイです！

先日、お会いした方から「自分、フロントエンドエンジニアになりたいっす！」と言われました。
言いたいことは理解できるのですが、まずはwebプログラマーの役回りについて理解して欲しかったので、そのときは以下と同様の内容を説明しました。
同じことを考えている方もいるかと思い、今回記事にしてみます。

・フロントエンド、バックエンドについて
皆さまが普段から利用されているであろう通販サイトを元に解説していきます。

例えば、通販サイトのトップページにアクセスしたとします。
すると画面には
・商品カテゴリが表示
・通販サイトにログインしているかどうか
・ランキング形式で商品の一覧
・過去に閲覧した商品の表示
・開催されているキャンペーン
といったものが表示されます。

ここで表示される「データ」はサーバーサイドによる処理のものです。
また、商品の在庫を管理する、商品を購入する、配送状態の管理などもサーバーサイドの処理で行われています。

このサーバーサイド側の処理を「バックエンド」と呼びます。
webシステムにおいて、バックエンドを構築するためによく使われるプログラミング言語は
PHP、Java、Rubyがよく用いられます。

サーバーサイドでデータを取得してきたら
今度は画面にそのデータを表示するための処理が必要になります。
ここからはフロントサイドのお仕事です。

フロントサイドではデータを画面に表示するための処理を構築していきます。
HTML、CSS、JavaScriptを使って処理と見た目を構築していきます。
この見た目側の処理のことを「バックエンド」に対して「フロントエンド」と呼びます。
最近は画面が切り替わらずに処理を行うことができるReact、Vue.jsといった
従来より優しくSPA(シングルページアプリケーション)が実現できる技術がよく使われています。

まとめると以下のように切り分けています
・バックエンド
データに関する処理
・フロントエンド
表示に関する処理

そのため昨今、バックエンドエンジニアやフロントエンドエンジニアといった言葉がでてきました。
IT業界未経験の方がこの言葉を見たら、2つの職種があるように見えるかもしれませんが、これは大きな間違いです。

バックエンド、フロントエンドで処理を切り分けることで分担して作業を進めることが可能なので
バックエンド、フロントエンドを別々の人で作り上げる、ということはよくあります。
しかし、これはあくまで役回りの話であって、大抵のwebエンジニアは両方をこなすことができます。
もちろん、どちらかに特化している、もしくは得意か不得意かはありますが、どっちかしかできないという人を私は見たことがありません。

つまり、webプログラマーはPHP、Java、Rubyといったサーバーサイド言語だけではなく
HTML、CSS、JavaScriptさらにはReact、Vue.jsといったフロントサイドのスキルが必要になってきます。

以上がwebプログラマーがフロントエンド、バックエンドについてです。

お会いした方もフロントエンド、バックエンドの2つから興味のあるフロントエンドをやってみたいということで、フロントエンドの勉強をしていたとのことでした。

この内容をみてどうでしょう？覚えることあって大変だと感じたと思います。
でも、いきなり全部できる人なんて存在しませんので、安心してほしいです！

webプログラマーになりたくてもどこから勉強していいかわからない場合、
私はバックエンドのプログラミング言語から学ぶのをおすすめします。
本屋に売っている初学者向けの本から始めてみてください。
最初は書いてあることを理解しなくてもいいので、そのまま移して書いてプログラムを動かしてみる。
教科書を一通り終えてみて、初めのころよりすこし慣れてきたら自分なりのプログラムを書いていく。
※私は初心者のころ試しに掲示板を作ってみました

こういった積み重ねを行っていけば必ず覚えていきます。

実はエンジニアとしての仕事はプログラムを書くだけにとどまりません。
それについては、また今度記事にしてみたいと思います。

それでは今回はこのへんで！