Webシステムの仕組みをわかりやすく解説|大規模Webシステムで採用されるWeb3層構造とは?【2024年最新版】

Webシステムの仕組みをわかりやすく解説!大規模Webシステムで採用されるWeb3層構造とは?

普段、あまり意識することなく私たちが利用しているWebシステム。しかし、新規事業立ち上げなどでWebシステムを開発する段階になって、実は「基本的な仕組み」を理解していないことに気付いた、そんな企業・店舗の方は少なくないはずです。

・Webシステムはどんな仕組みで動いている?
・開発するサービスによってWebシステムの仕組みは変わる?
・大規模Webシステムで採用されることの多い、Web3層構造とメリットは?

開発会社とのコミュニケーションをスムーズにするためにも、システム開発プロジェクトを成功に導くためにも、Webシステムの仕組みを理解しておくことは重要。そこで本記事では、Webシステムが機能する基本的な仕組みをできる限りわかりやすく解説します。

※現在、システム開発の依頼先を探している方はシステム幹事にご相談ください。予算や目的から最適な開発会社を選定します。相談料・紹介料は一切かかりません。

【無料】おすすめのシステム開発会社を紹介してもらう

目次
  1. 1. Webシステムとはなにか?
    1. 1-1. Webシステムの特徴
  2. 2. Webシステムの仕組み:基本編
  3. 3. Webシステムの仕組み:クライアント編
  4. 4. Webシステムの仕組み:サーバ編
    1. 4-1. プレゼンテーション層
    2. 4-2. アプリケーション層
    3. 4-3. データ層
  5. 5. 大規模Webシステムで採用されるWeb3層構造
    1. 5-1. Webサーバ(プレゼンテーション層)
    2. 5-2. アプリケーションサーバ(アプリケーション層)
    3. 5-3. データベースサーバ(データ層)
    4. 5-4. Web3層構造はセキュリティも確保しやすい
    5. 5-5. クラウドコンピューティングの活用
  6. 6. webシステムの仕組みまとめ
    1. 6-1. システム開発会社を探している方へ

Webシステムとはなにか?

Webシステムとは、インターネット経由でサービス・機能を提供することを目的に、Web技術を活用して開発・構築されたシステムのこと。具体的には、マッチングサイト・ポータルサイトなどのWebサービス、ECサイト・モールなどのeコマースサービス、勤怠管理・経費管理などのSaaS、インターネットバンキング、SNSサービスなどが主なWebシステムとして挙げられます。

Webシステムの特徴

代表的な例を見てもおわかりのように、Webシステムでは「Webブラウザ(Chrom、Safariなど)が使える」「インターネットに接続可能」なデバイスであれば、ユーザーが使用する端末の種類は問いません。

モバイルアプリを用意しているサービスもありますが、基本的に専用アプリを必要としない、インターネットに接続できればいつでもどこでも使えるということがWebシステムの大きな特徴だといえるでしょう。

※Webシステムとはなにか?より詳しく知りたい方は、以下の記事も参考にしてください。

関連記事Webシステムの基礎知識を解説!具体例・特徴・おすすめの開発会社も紹介!

【無料】Webシステム開発について相談する

Webシステムの仕組み:基本編

クライアントサーバーシステム

Webシステムがこうした特徴を持つのは、「リクエスト(要求)を送ってレスポンス(応答)を表示するWebブラウザ(クライアント)」と「リクエストをアプリケーションによって処理してレスポンスを返すWebシステム(サーバ)」で構成される、Webシステムの基本的な仕組みがあるからです。

Webシステムが動作する具体的な仕組み・流れは以下の通り。

手順

担当する側

1.クライアントがサーバに

リクエストを送信

クライアント(Webブラウザ)

2.サーバがリクエストを受信

サーバ(アプリケーション)

3.サーバがデータベースから

必要なデータを取得

サーバ(アプリケーション・データベース)

4.サーバがリクエストに応じて

データ処理・クライアントに

レスポンスを送信

サーバ(アプリケーション・データベース)

5.クライアントが

レスポンスを受信・表示

クライアント(Webブラウザ)

アプリケーションとは・・・特定の目的を果たすために作られたソフトウェアのこと

【無料】Webシステム開発について相談する

Webシステムの仕組み:クライアント編

基本編でも解説したように、Webシステムにおけるクライアント(Webブラウザ)の役割は、リクエストを送信すること、返されたレスポンスを表示することです。クライアントがシステムのデータ処理を担当することはなく、サービス・機能の提供はすべてサーバ側で実行されます。

Webシステムは「Webブラウザが使える」「インターネットに接続可能」なデバイスであれば、ユーザーが使用する端末の種類は問わない、という特徴につながっています。

業務システムでよく採用される「クライアントサーバシステム」とWebシステムでもっとも異なるのがこの点。クライアントサーバシステムでは、クライアントにも必ず専用アプリをインストールする必要があり、このアプリにデータ処理の一部を受け持たせます(『サーバ・クライアントでの分散データ処理』)。

アプリ不要のWebシステムには管理・メンテナンス・アップデートが容易、利用範囲を広げやすいなどのメリットがあります。

【無料】Webシステム開発について相談する

Webシステムの仕組み:サーバ編

それでは、データ処理・サービス提供を一括して受け持つWebシステムの「サーバ」は、どのような仕組みで動作しているのでしょうか?

一般的には、比較的規模の小さいWebシステムを開発する場合、1台のサーバコンピューター内に「サーバOS + アプリケーション + データベース」をまとめて構築します。

Webシステムとして構築されたこの1台のサーバ内には、それぞれ異なる役割を持つ「プレゼンテーション層」「アプリケーション層」「データ層」という3つのレイヤーがあり、連携しながらデータ処理・サービス提供しているのです。

それぞれのレイヤーの役割を簡単に解説しておきましょう。

レイヤー

別称

主な役割

開発言語

プレゼンテーション層

・フロントエンド

・クライアント

・画面表示を提供

・リクエスト・レスポンスの送受信

HTML / CSS / JavaScriptなど

アプリケーション層

・バックエンド

・サーバサイド

・リクエストを受信、処理してクライアントに送信


・データ取得・追加・削除・変更

Java / PHP / Ruby / Python

データ層

・バックエンド

・サーバサイド

・データベース

データの保存・管理

SQL

プレゼンテーション層

プレゼンテーション層とは、Webシステムのエンドユーザーであるクライアント(Webブラウザ)へ画面表示を提供する役割、およびクライアントとサーバとの通信を受け持つ役割を持つレイヤーのこと。

リクエスト・レスポンスの送受信を含め、Webシステムにおいてクライアントがアクセスするのはプレゼンテーション層のみになります。プレゼンテーション層はフロントエンド、クライアントサイドとも呼ばれ、HTML / CSS / JavaScriptなどの開発言語を使ってプログラムが開発されます。

アプリケーション層

Webシステムの中核となるアプリケーション層とは、リクエストを処理してクライアントに送信する「レスポンス生成」を受け持つレイヤーのこと。
プレゼンテーション層と連携してリクエスト・レスポンスの受け渡しを行うほか、データ層と連携しながらデータ取得・追加・削除・変更も行います。

レスポンスを生成するためのデータ処理は、アプリケーションに特定のルールを与える「ビジネスロジック」に従って処理されます。アプリケーション層はバックエンド、サーバサイドとも呼ばれ、Java / PHP / Ruby / Pythonなどのプログラミング言語やフレームワーク(基本的な機能がパッケージ化されたプログラム)を活用して開発されます。

データ層

データ層とは、アプリケーションによって処理されたデータの保存・管理を受け持つレイヤーのこと。一般的にはデータベースと呼ばれ、アプリケーション層とともにバックエンド、サーバサイドと呼ばれます。

MySQL / PostgreSQL / OracleなどのRDBMS(リレーショナルデータベース管理システム)が利用される場合が多く、データベース言語であるSQLを使ってWebシステムごとの適切なデータベースが構築されます。

サーバコンピューター1台のみのWebシステムであっても、3つの「レイヤー(論理構造)」が必要であることがおわかりいただけたでしょう。

※Webシステムでよく使われるプログラミング言語についてより詳しく知りたい方は、以下の記事も参考にしてください。

関連記事Webシステム開発によく使われるプログラミング言語とは?知っておきたいフレームワークも解説!

【無料】Webシステム開発について相談する

大規模Webシステムで採用されるWeb3層構造

3層のレイヤーがあるといっても、通常は1つのハードウェアサーバ内にすべてのプログラムを構築します。トラフィックが多くない、クリティカルな処理が必要ない小規模〜中規模Webシステムであればこれで問題になることはありません。しかし、大規模なWebシステムでは反応が遅くなる、システムダウンするなどのリスクが生じます。

こうしたリスクを回避するため、レイヤーごとの役割に応じてハードウェアサーバを物理的に分離し、「Webサーバ」「アプリケーションサーバ」「データベースサーバ」という3つのサーバでWebシステムを構築することを「Web3層構造」と呼びます。それぞれを簡単に解説しておきましょう。

Webサーバ(プレゼンテーション層)

Webサーバとは、Webシステムのプレゼンテーション層にあたる、ユーザーインターフェースの提供および、クライアント・サーバ間の通信を担うサーバのこと。

上述したように、ユーザーインターフェースを担うフロントエンドプログラムは、HTML / CSS / JavaScriptなどで開発されます。一般的には、基本的な通信機能・ハードウェア制御機能を持つ「Webサーバソフトウェア」をベースにすることが多く「Apache HTTP Server」「Ngnix」などがよく利用されています。

アプリケーションサーバ(アプリケーション層)

アプリケーションサーバ(以下、APサーバ)とは、Webシステムのアプリケーション層にあたる、データ処理の役割を担うサーバのこと。
Webサーバ・データベースサーバ双方と連携するサーバです。

APサーバに構築されるWebアプリケーションは、Java / PHP / Ruby / Pythonなどで構築されます。他のサーバとの連携やビジネスロジックを搭載した「APサーバソフトウェア」「フレームワーク」をベースにする場合が一般的です。

「Puma」「Unicorn」「Tomcat」などのAPサーバソフトウェア、採用する開発言語に応じた「Django」「Ruby on Rails」などのフレームワークが代表的。ただし、PHPなどのように、APサーバソフトウェアを必要としない開発言語もあります。

データベースサーバ(データ層)

データベースサーバとは、Webシステムのデータ層を独立したハードウェアに構築したサーバのこと。MySQL / PostgreSQL / Oracleなどのデータベース管理システムが活用されるのは、データ層構築と同じです。

◎各レイヤーと開発言語、ソフトウェア・システムとの関係

 

Java

PHP

Ruby

Python

Webサーバ

Apache、Ngnix

Apache

Apache、Ngnix

Apache、Ngnix

アプリケーションサーバ

Tomcat

×

Puma、Unicorn

Gunicorn

データベースサーバ

MySQL、PostgreSQL、Oracle

MySQL、PostgreSQL、Oracle

MySQL、PostgreSQL、Oracle

MySQL、PostgreSQL、Oracle

Web3層構造はセキュリティも確保しやすい

サーバを分離させることによって、Webシステムの役割ごと(レイヤーごと)に最適化した運用・保守が可能になり、システムを拡張させやすい、セキュリティを確保しやすい、信頼性を確保しやすいメリットが得られます。特にセキュリティを確保しやすいことは、大規模Webシステムにとって大きなメリット。

インターネットを経由した外部からの通信はWebサーバのみであるため、正しく設計されたアプリケーションサーバは物理的なファイアウォールの枠割を果たせます。それぞれのハードウェアが分離されているため、通信経路ごとに物理的なセキュリティ対策を施すことも可能でしょう。

クラウドコンピューティングの活用

近年では、Webシステムの開発プラットフォームとして、AWS / Azure / GPCなどのクラウドコンピューティングを活用するケースが増えています(AWSはAmazon、AzureはMicrosoft、GCPはGoogleがそれぞれ提供)。

これは、クラウド環境を利用することで物理的なハードウェアを用意することなく、Web3層構造を持つWebシステムを簡単に構築できるからです。

たとえばAWSであれば、Webサーバ・アプリケーションサーバに「Amazon EC2」を、データベースサーバに「Amazon RDS」を利用すれば、簡単にWeb3層構造のシステムを構築可能。サーバコンピューターのメンテナンスを気にする必要もありません

【無料】Webシステム開発について相談する

webシステムの仕組みまとめ

Webシステムの開発プロジェクトをスムーズに進めたい企業・店舗担当者の方に向け、本記事では、Webシステムが機能する基本的な仕組みをできる限りわかりやすく解説してきました。

プログラミングの方法までを知る必要はありませんが、パートナーとなる開発会社との認識を一致させるためにも、Webシステムの基本的な仕組み・概要を理解しておくことは非常に重要。本記事の内容も参考にしながら、Webシステムへの理解を深めてください。

システム開発会社を探している方へ

現在、システム開発会社を探している方はシステム幹事にご相談ください。専門のコンサルタントがあなたの要望を丁寧にヒアリングし、予算にあった最適な開発会社を選びます。

コンサルタントのご紹介 システム幹事 コンサルタント 岩田真 岩田 専任のコンサルタントが、
お客様の予算と目的を丁寧にヒアリング。
最適な会社をピックアップ・ご紹介させていただきます!
初心者の方でも安心してご相談いただけます。

【無料】おすすめのシステム開発会社を紹介してもらう

Q. Webアプリケーションのシステム構造は?

Webアプリケーションの構造は「プレゼンテーション層」「アプリケーション層」「データ層」の3つの層で構成されています。それぞれの詳しい特徴は記事内で紹介していますので、ぜひご覧ください。