独学の大学

勉強・学習に役立つ情報を紹介しています

なぜ私たちはWEBアプリを作るのか

f:id:s-uotani-zetakansu:20210915141137p:plain

web系エンジニア(webアプリを作る会社のエンジニア)を目指して学習されている方が増えてきていますが、そもそもなぜwebアプリを作るのでしょうか?

この本質の部分をしっかりと理解することで、今後の学習は加速します!

これからRubyやPHP, Pythonなどのweb系の言語を学習される方や、既に学習中の方は是非最後までお読みください。

 

 

webアプリ最大の目的

 

なぜ私たちはWEBアプリを作るのでしょうか?

 

結論ですが、私たちは「データベースを触りたい!」

f:id:s-uotani-zetakansu:20210915131259p:plain

データベース

何を言いたいかは、これから詳しく見ていきます。

例えば、ツイッターやブログのように誰かが投稿したテキストや画像があるとします。

これらは全てツイッターやはてなブログなどが所有しているデータベースに保存されています。

 

これらに保存されている内容を見たいですよね。

見るだけじゃなくて、いいねをしたり、ツイートしたり自分から何かアクションを起こしたいという気持ちもあります。

 

情報社会となった今、社会の中心であるデータのほとんどはデータベースに保存されています。

 

だから私たちは情報を集めるためにデータベースに触りたいのです。

しかし、一般の方がデータベースに簡単にはアクセスできない。

他にも障壁はあります。これらの障壁を乗り越えた先に、私たちが作るWEBアプリがあるのです。

詳しく見ていきましょう。

 

障壁1. アクセスし放題

まず、第一の障壁ですが、データベースを触りたいからといって、一般の人全てに、全ての操作を許可すると、とんでもないことになるのは想像が容易いと思います。

勝手にデータベースを全部消したり、別の人の名前で書き込んだり、とかですね。

 

第一の障壁はオープンにしすぎるとアクセスし放題でめちゃくちゃになるという点です。

 

ではどうすればいいかというと、こんな操作はOK、こんな操作はNG、あなたはNG,あなたはOKのようにルールを作ればいいのです。

このルールを定義しておく(プログラムしておく)のがwebサーバーですね。

データを使いたい人から、「こういうことをしたい」とwebサーバへ送る指示のことをリクエストと呼んでいます。

リクエストはURLとHTTPメソッド,パラメータのセットのことですが、細かいことは置いときましょう。

f:id:s-uotani-zetakansu:20210915134251p:plain

webサーバーの登場

webサーバーで「全部消す」や「適当な人の名前で投稿する」のようなことをできなくすれば安全です。

 

障壁2. アクセスしにくい

これでデータベースは守れたのですが、これだけで一般の人が欲しいデータを入手できるようになったでしょうか?

まだ肝心なものが用意できていません。

それは画面です。

今ではリクエストを送るとデータがもらえるようになりましたが、「リクエストを送る」ためには、現時点ではコマンドで送らないといけません。curlなどのコマンドがありますね。

 

そこで、誰もが好きなデータにアクセスできるように、コマンドではなくてより直感的な「クリック」や「ボタンを押す」といった操作でデータを入手できる必要があります。

直感的な操作を実現しているのが、webブラウザ、そしてHTML/CSSです。

f:id:s-uotani-zetakansu:20210915135148p:plain

webブラウザの登場

webブラウザはHTML/CSSを直感的に理解できるように見やすく表示するためのアプリケーションです。

 

障壁3. 結果が分かりづらい

さて、直感的にリクエストを送れ、さらに変なリクエストは除外するという仕組みを作ることができました。

これで十分でしょうか?

 

まだもうちょっと待ってください。

データベースで、データを検索すると、確かに結果は帰ってきますが、この結果は見易いでしょうか?

実際に見たことある方はわかるかと思いますが、とても見にくいです。データを手に入れても読み解くのが大変です。

 

そこで、最後の仕上げとして、データを見やすくしてあげようという処理を行います。

ここで登場するのがテンプレートというものです。

RailsやLaravelでいうところのview,Djangoでいうところのテンプレートに相当します。

 

f:id:s-uotani-zetakansu:20210915140331p:plain

テンプレート

 

テンプレートとは、ある特定の種類のデータを、必要なところに当てはめるとHTML/CSSが完成するというものです。

賞状などはよく見てみると、名前や日付が違う程度でほぼ一緒ですよね。このように、テンプレートとは、違うところだけ後で埋めるようになっているイメージです。

 

このテンプレートを使って、欲しいデータをテンプレートに当てはめ、完成したHTMLをブラウザに返します。

 

 

そしてWEBアプリの完成

 

こうして完成したのがWEBアプリです。多少の違いはありますが、WEBアプリの本質部分を抜き出すとこのような図になります。

f:id:s-uotani-zetakansu:20210915140539p:plain

テンプレートの導入

最終的に返す「結果」のことをレスポンスと言います。

最近流行のSPAなどはもう少し違う仕組みを使っていますが、基本的な構造や、最終的に欲しいのはデータであるという点に違いはありません。

 

WEBアプリを作るモチベーション、そしてWEBアプリを構成しているパーツの役割などをしっかり理解し、WEBアプリエンジニアを目指してください!

 

 

プログラミング学習されている方におすすめの記事です!

 

doku-gaku.net

 

doku-gaku.net