30代専業主婦の独学エンジニア挑戦ブログ

実務未経験の30歳の専業主婦が独学でエンジニアを目指すブログです

「フロントエンド」とは?

勉強記録

今週から写真共有アプリの復習に入っています。
復習のスケジュールとして、[午前中は自分で復習、午後は復習した箇所をSEである夫に解説する] という流れです!

夫からは容赦なく質問が・・・(笑)自分の知識が曖昧だった点がいくつかあったので、質問されてうまく答えれなかった内容をまとめます。

フロントエンドとは何か

今回、フロントエンドにVue.js、Vue Router、Vuex、サーバサイドにLaravelを使用した写真共有アプリを作成しています。

そこで夫から「フロントエンドってなに?」との質問がありました。

フロントエンドとは

Webブラウザ上で動くシステムのことを指す。(つまりクライアント側で動くシステム)
Webブラウザとは、ChromeFireFoxSafariなどのインターネット上のWebサイトなどを閲覧するときに利用するソフトウェアのこと。
画面のデザインを表示させたり、必要な情報をサーバーに送る役割がある。

フロントエンドエンジニアが使う主な言語は、HTML/CSSJavaScriptなどである。
HTML/CSSで文字に色をつけたり、表示位置を指定する。
JavaScriptでWebサイトに動きをつける(マウスオーバーで変化をつけたり、ボタンクリック時に動きをつけたりなど)

Webブラウザ上で動くシステムなので、テストをする場合には色々なブラウザの色々なバージョンでテストを行う。
(例えばChromeでバグが出なかったからといって、Safariでもバグが出ないとは限らないということ)

サーバーサイドとは

フロントエンドからのリクエストを取得し、フロントエンドに適切な情報を送る役割を担っている。(ローカルにないデータをやり取りするもの)

サーバーサイドエンジニアが使う主な言語は、RubyPHPPythonJavaなどである。
サーバーサイドで使われる言語は多い!

Web上でユーザーが操作したとき、操作内容に応じたプログラムの開発と保守を行う。
他にもDBへのアクセスなど、目に見えない処理もやっている。