フロントエンドとバックエンドの違いをわかりやすく解説！

プログラミングの学習を始めると必ず出てくる言葉が 「フロントエンド」と「バックエンド」。
なんとなく「表側と裏側のことかな？」とイメージできても、実際にどう違うのか説明しようとすると難しいですよね！

今回は、私が実際に現場で使っている Vue.js（フロントエンド）、C# と SQL（バックエンド）、そして API（橋渡し役） を例に出しながら、料理にたとえてわかりやすく解説していきます！

私の転職体験談についてこちらの記事をチェック！

💻 フロントエンドとは？

フロントエンドは、ユーザーが直接触れる部分 を担当します。
私の仕事では Vue.js を使って画面を構築しています。

Vueについて知りたいからは下のリンクを参考にしてみて下さい！
https://qiita.com/Hashimoto-Noriaki/items/ea60d5932f13a9cd5707

ユーザーが「見える部分」「操作できる部分」を作るのがフロントエンドです。

バックエンドは、ユーザーには見えない部分で動いている仕組み です。
私は主に C# を使ってサーバー側の処理を行い、データは SQL データベースに保存しています。

ユーザーからのリクエストを受け取り、必要なデータを処理して返すのがバックエンドの役割です。

ここで、料理に例えてみましょう！

フロントエンド → お客さんが目にする「盛り付け」や「サービス」
- 盛り付け → HTML
- 色合いやデザイン → CSS
- ナイフやフォークで食べやすくする体験 → JavaScript / Vue.js
バックエンド → キッチンで行われる「調理」
- 材料を管理 → SQLデータベース
- レシピ通りに調理 → C#
- 注文に応じて料理を準備 → サーバー処理