【今更きけない】フロントエンドとかバックエンドとかってなに？

フリーエンジニアの岳です。

Web開発などのご依頼があったときのやりとりなどで、

「フロントって、どこの部分を指すのですか？」

と時々きかれることがあるのですが、少なくともITに関わる人なら大雑把にでも理解しておいたほうがいいんじゃないかなーと思っています。

正確な定義は必要ない（というか、ないかも？）のですが、みなさんは答えられますか？

結論を述べると、

フロントエンド：いわゆる「見た目」の部分
バックエンド：データ管理といった「見えない」部分

になります。

イメージはなんとなくついていた方、多いですかね？（多くあってほしい）

それでは、もう少し具体的に解説していきましょう。

フロントエンドとは？

いわゆる「見た目」の部分とお伝えしました。ざっくり言ってしまえば、みなさんが見てらっしゃるnoteの「レイアウト」や「デザイン」のことです。noteのサーバー（データ・情報の保存場所）から記事のタイトルや文章といった情報を引き出して、みなさんに見やすいように整形して表示するのが「フロントエンド」という領域の開発です。

また、その開発を行う人を「フロントエンドエンジニア」と言うことがあります。

アニメーションを用意したり、スマートフォンとパソコンで見た目を変えたり、ボタンを用意していろんな操作ができるようにしたり、そんな実装（作成作業）をします。

言語で言うなら、HTMLやCSS、JavaScriptの３つが基本です。CSSを拡張（便利に）した「Sass」や、「React.js」や「Vue.js」といったフレームワーク（ライブラリ）もありますが、どれもベースは上の３つになっています。

バックエンドとは？

データの管理が主なお仕事です。ほぼ同様の意味で「サーバーサイド」と呼ばれることもありますね。

今見ているnoteの記事やタイトルといった情報を、わかりやすく、素早くとってこれるように整理して保存。いざフロント側から「この記事のデータがほしいよ！」と言われたときには、必要な情報を整理してわたしたりします。

また、その開発や環境の整備を行う人を「バックエンドエンジニア」と言うことがあります。

データベース（データを保存しておく場所）の設計や、サーバー（データを保存しておくパソコンみたいなもの）の環境構築なんかも、バックエンドの領域として含まれることがあります。

言語で言えば、RubyやPHP、PythonやJavaあたりが有名ですね。バックエンドの部分は目に見えない部分なので、その分自由度が高く、無数のプログラミング言語から選んで使うことができます。

どの言語を選ぶかは、状況次第。エンジニアさんの得意な言語を選んだり、つくりやすさや速度など、目的に応じて選択することが多いですね。

まとめ

というわけで、

フロントエンド：いわゆる「見た目」の部分
バックエンド：データ管理といった「見えない」部分

の解説でした。

厳密には、フロントでデータを（簡易的に）保存することがあったり、データを整形したりすることもあるのでその辺は注意が必要ですが、大雑把にはこんな感じです。（特にスマートフォンのアプリなんかだと、スマホのなかにデータを保存して...とか多いです。）

知らなかった人は、この機会にぜひ覚えておきましょう。エンジニアやプログラマーじゃない人こそ、知っておいて欲しいなーって思います。

本日は以上！