見出し画像

看護師でもわかる!WEBアプリケーションの仕組み解説!

谷口です!

今回は前回に引き続きIT用語について解説していきます。

前回の記事では、アプリやソフトウェア、ハードウェアについて解説しました。現在は、ソフトウェアが主戦場になっております。というのも、スマートフォンが普及し、誰もがインターネットにアクセスできる環境になったからです。

今回の記事では、インターネットを介して動くWEBアプリケーションについて説明していきます。

それでは早速本題に入っていきましょう。

WEBアプリケーションの仕組みは?

画像3

まずWEBアプリケーションの仕組みについて解説していきます。

その前にWEBアプリケーションについて簡単に復習しておきましょう。

WEBアプリケーションとは、インターネットを介して表示させるものです。何を表示させるかというと、プログラミングで作られたソフトウェアのことですね。(前回の記事はこちら

それでは、そのWEBアプリケーションはどのような仕組みで動いているのでしょうか?この「note」というサービスを例に考えてみます。

僕たちは、このnoteというサービスを利用するにあたり、お使いのパソコンやスマホなどハードウェアに搭載されているブラウザ(インターネットを検索するシステム)を利用しインターネットを経由してnoteのサービスや記事を読むことができます。

ブラウザとは?

ブラウザとは、WEBを検索するシステムで、Google chromeやsafari、Internet Explorer(IE)などがあります。

文章で読んでもなんのこっちゃ?って感じですよね〜
大丈夫です、僕も同じです😂なので今回は図解してみました!


まずはブラウザとサーバーの基本的な仕組みです。

画像5

この図の様に、ブラウザから①リクエストを送り、サーバーが②レスポンスを返してくれています。

ちなみに、ブラウザ側をクライアントサイド、サーバー側をサーバーサイドと言います。また別の記事で解説していくのですが、エンジニアと呼ばれる職業でも、クライアントサイドなのか、サーバーサイドなのかによって使用する言語が変わります。

画像12

一概にエンジニアと言っても専門性は多岐にわたります。
看護師で例えると、看護師自体はさまざまな領域を包括していますが、具体的には専門領域が分かれていますよね?急性期なのか、慢性期なのか、回復期なのか…より具体的にはICUなのか救命なのか、整形外科なのか、神経内科なのか、精神科なのか…といったところですかね。

本題に戻りましょう。

ブラウザは、僕はsafariやGoogle chromeを使用することが多いです。みなさんは何を使われますか👨‍💻?Google chrome(以下chrome)を使われている方は多いと思いますので、今回はchromeを使って説明してみますね。


まず、「note」をみたい、もしくは投稿したいと思ったときにchromeで検索をします。するとchromeから、WEBサーバーというところに「noteを表示して欲しいんだけど」とリクエストを送ります。するとWEBサーバーは、noteの情報があるデータベースサーバーから必要な情報を取得してくれます。そしてそれがchromeで表示されるようにレスポンスを返します。

画像7

この際ブラウザから、サーバーへ「note」が見たいとリクエストを送るのですが、サーバー側でもまた同様の動きがあります。サーバーについては後述していますが、WEBサーバーからDBサーバーにデータを取得し、それをまたWEBサーバー経由でブラウザに戻しているのです。

この一連の流れで、僕たちはnoteやそのほかのWEBアプリを利用することができています。まとめるとこんな感じ。

画像8

ちなみに、WEBサーバーからブラウザへレスポンシブを返すときにプログラミング言語でレスポンシブしているのです。次項で確認していきましょう。

サーバーとは?

画像4

ここでまた新し言葉、「サーバー」というものが出てきましたね。

サーバーは簡単にいうと、でっかいコンピューターのことを指しています。

画像1

画像2

 テレビドラマや映画で出てくるものですね。
よくスパイがハッキングしていたりするあれです。

このサーバーにも2つのサーバーがあります。
WEBサーバーとDBサーバーですね。
もう一度先ほどの図を確認してみましょう。

画像9

もう少し詳しく解説していきます。

WEBサーバーとは?

サーバーは大きなコンピューターの塊だとお伝えしました。

画像10

このWEBサーバは、クライアントからのリクエストに応じてサービスを提供するコンピューターです。HTML,CSS,JavaScriptといったプログラミング言語を、クライアントのブラウザにレスポンス(返信)しています。このサーバーの中でWEBアプリが動いています。

DBサーバーとは?

またもう一つ別のサーバーも登場しましたね。それがDBサーバーです。DBはデータベースの略称です。

画像11

さてこちらのサーバーはデータベースと言われているだけあって、データが保存されているサーバーです。データベースは特定のデータを収集し、それをサーバー内に格納しています。ミドルウェアとも呼ばれたりします。そちらについてはまた別の記事で詳しく解説していきます。

現在主流のデータベースはRDBMS=リレーショナルデータベース管理システムです。RDBMSは前述したSQLを使って操作が可能です。(SQLについてはこちら)


これらをまとめるとこのようになります。

画像13

終わりに

画像12

いかがだったでしょうか?前回に引き続き、IT用語の解説を行っておりますが、次回はこの仕組みのルールを解説していきます。またフロントエンドで使われるHTMLやCSSといった用語も出てきたので、そちらも今後解説していきますね😌

ではまた!

この記事が気に入ったらサポートをしてみませんか?