Webシステムの原理①~レイヤーについて~

こんにちは、小池です。

暖かくなって、外出が楽しい季節になってきました。

4月末に現在の案件が終了するので、転職活動を始めています。

新規の案件を受けるにあたり、改めてWeb開発の実装周りを自習しております。

自分がややこしいなと感じていた部分を整理しなおしたので、お伝えできればと思います。

Webシステムの基本原理

チームで行うシステム開発においては、部分部分の開発を分担して請け負いそれぞれが開発を進めていきます。

そのため、自分の開発領域だけ把握しているけれど全体のことをあまり分かっていないよ、という状態も良く起こります。

もしも自分の受け持っている部分だけでなくシステムの各層を理解してカバーできる状態にすることができたら、職場での評価もすごく上がるかと思います。

まずはWebシステム全体のおおまかな構成からまとめていきます。

Webシステムのレイヤー

Webシステムを実現するには様々なソフトウェアやミドルウェア、ネットワークや物理的なOSを含むサーバインフラなどが必要です。

これらの技術要素の塊をレイヤーと呼びます。

以下、Webシステムの各レイヤーをとりあげます。

1.フロントエンド層

システムの利用者とのインターフェースです。

インターフェースとは接点という意味で、IT用語ではコンピュータと人、またはコンピュータ同士の接点を指します。

例えば、モニターやキーボードで操作する画面がフロントエンド層のレイヤーになります。

Web開発ではユーザーインターフェースをフロントエンド層と定義することが多い印象です。

2.バックエンド層

ブラウザやアプリなどのフロントエンド層が動作するもととなるデータの送出側の層です。

フロントエンドが八百屋だとするならば、バックエンドは野菜を生産する農家や卸売市場に当たります。

そのためバックエンドはフロントエンドが表示するコンテンツを作成、送信する役割を担っています。

この送信のやり取りにはHTTP通信というプロトコル（通信の規則）が使われます。

通常、HTTPを暗号化したHTTPSが使われます。

バックエンドには多くのプラットフォームやハードウェア、アーキテクチャ(技術セット)が存在し、さらにレイヤーにいくつかのレイヤーに分かれて構築されています。

ここでは以下の4つに分けて見ていきます。

2-1.アプリケーション層

開発したソフトウェアや導入したパッケージを動作させる層です。ReactやDjangoなどが使用されます。

2-2.ミドルウェア層

実際にフロントエンドとやり取りをする中継地点であるWebサーバーやアプリケーションサーバーが含まれます。

画面に表示するデータを保持するデータベースサーバーもここに含まれます。

2-3.OS層、物理層

最も基礎となる層です。

物理層は実際のサーバーやケーブル・スイッチの配列などの物理的な要素です。

一方でOS(オペレーティングシステム)層はその中に入るWindowsなどが入ります。

オンプレミス（物理的なサーバーを設置し、OSをインストールして構築する方法）と、パブリッククラウドのプラットフォームで実現する方法があります。

以上がwebシステムを設計する際のレイヤーです。

設計したいシステムの要件に合わせて、それぞれのレイヤーの要素をパズルのようにはめ込んでいくことで全体の構成が決まっていきます。

概要は以上で、ここからは各層で利用されるアーキテクチャについて書いていきたいと思います。