フリーランスプログラマーになるには　１３Webアプリケーション周りの全体像

このノートはフリーランスプログラマーとはどういったものなのか、どうしたらなれるのか、またどのように生計をたてるのか等を、私の経験をもとに実情を解説するシリーズの一つです。

フリーランスプログラマーになるには｜oyakokurashi｜note

このシリーズも長々と続いてきましたが、最後に特に最近複雑化しているWebアプリケーション周りの全体像を解説して終わりたいと思います。

WebアプリケーションはWeb2.0と言われ始めた２０００年代ごろからの進化の速度が凄まじく、需要の増大という必要に迫られて次々と新しい技術やハードウェアの構成が開発・提案されてきましたし、今現在も日々新しい考えが世界を駆け巡っています。そのため、前提知識が無い状態で大きな絵を見ても分かりづらいかと思いますので、最小構成の解説をして理解の端緒にしてもらえたらと思います。

以下はスマートフォンから某ECサイトで商品を検索している図を簡略化したものです。

検索というアクションが下から上に向かい、結果として上から下に戻されています。以下は実際にどういう技術が使われているのかを示した図です。

一つずつ見ていきましょう。

Webアプリケーションの技術群は大別するとクライアントサイドとサーバーサイドの２つに分けられます。

クライアントサイドについて

クライアントサイドとは上図にもある通り、ブラウザー上で動作するものを指した言葉です。1990年代あたりまではクライアントサイドでできることは限られていましたがSPA（Single Page Application、Gmailのような画面遷移を伴わないアプリケーション）が隆盛するにつれてクライアントサイドで行う処理が爆発的に増加して、開発の専門性も高まったことから今ではこれらの開発者のことをフロントエンドエンジニアと呼ぶようになりました。

ブラウザー
ブラウザーとはユーザーが入力したURLやユーザーのアクション（画面上のボタンを押下するなど）に応じて、対応するURLに対して種々の要求（問い合わせ、またはリクエストと言います）を行い、その結果（応答、またはレスポンスと言います）を解析して何らかの処理または表示をするアプリケーションのことです。ChromeやEdge、FireFox、Safariなどが有名です。

Webアプリケーションは何もブラウザーからしかアクセスできないわけではないのですが、ブラウザーからの用途が大多数を占めます。

Html
Webページの基本となる枠組みを提供します。Webページ上の文字や画像はHtmlという枠内に収まっています。現在ではHtml5が主流です。