コンサルタントのアプリ開発

丸の内コンサルタントがアプリ開発を勉強した記録です

【Web開発 未経験者向け】Single Page Application/サーバーレスアーキテクチャをざっくり理解する

はじめに

普段、丸の内でコンサルタントとして、自分の論理的思考力・業界知見・業務知見を駆使して、戦略策定/構想策定/業務改革を支援している

現状、Webアプリの開発を自分自身が担当することはないが、戦略の実現/改革の実現にIT・Digitalテクノロジーの活用が必須になり、それを広く利用できるようにするWebアプリケーションの構築・展開も必須になっている

コンサルタントとして、自分自身がWeb開発ができなくとも問題にならないのだが、戦略の意図を理解し、適切にテクノロジーを活用できる人材も少なく、戦略や改革が立ち消えになることも多々ある

そこで、いつかは"テクノロジーの活用"・"アプリ開発"含めて戦略・改革の実現を支援できるコンサルタントを目指し、Webアプリ開発の学習を始める

今回は初回として、Webアプリケーションの仕組みを理解しながら、最近注目されているSingle Page Application/サーバーレスアーキテクチャをざっくり理解していく

Webアプリケーションの仕組み

理系の大学院を出ていることもあり、授業でJavaでのコーディングをしたことはあるが、実践的なアプリケーション自体をしたことがないので、そもそも何を学習するかを見定めなければならない

Webとは何かなどの概念の知識は理解しているとして、Webアプリケーションを動く仕組みを理解したうえで、学習範囲を定めていきたい

一般的なWebアプリケーションの仕組み

少しでも興味がある人は一度は調べたことがあるかもしれないが、簡単に一般的なWebアプリケーションの仕組みを整理する

ざっくりいうと

  • ❶最初にクライアント(ユーザのPC)が画面を操作する
  • ❷画面の更新がサーバーへリクエストされる
  • ❸ ~ ❾リクエストをアプリのサーバー群で処理した結果がサーバーからレスポンスとしてクラアインとに送信される
  • ❿クライアントの画面が更新される

と単純に、処理依頼に応えて、処理結果を返信しているだけのものである

f:id:BusinessManBlogForBusinessMan:20200501194508p:plain

ただ、この処理を返すまでの仕組みが難しい。

たいていのアプリケーションはWebサーバー/アプリケーションサーバー/データベースサーバーのてい介してリクエストが処理されて、処理結果が返送される。

  • Webサーバー(窓口): クライアントからの入力を受け付けたり、アプリケーションサーバーの処理結果を表示する。言ってしまえば窓口。
  • アプリケーションサーバー(作業場): 実際の情報処理を担う。言ってしまえば作業班。
  • データベースサーバー(保管庫):情報が格納される。言ってしまえば保管庫

このように役割をはっきりさせることで、システムの管理をしやすくすることができる、企業の業務システムの構築などに多く採用されている

シングルページアプリケーション

上記のようなクライアント・サーバーの役割分担は、管理がしやすく一般的なアプリケーションの構成だったが、クライアントからのリクエスト/レスポンスのデータ量が大きくなってしまい、アプリケーションの動作が遅くなることが問題になっていた

近年はクライアント側に一定の画面処理をさせ、必要なデータのみをサーバーから取得することで、アプリケーションの動作を改善する”シングルページアプリケーション”というアプローチが採用されている。

f:id:BusinessManBlogForBusinessMan:20200501202626p:plain

普通のアプリケーションはサーバーから毎回 画面全体が送信されており、”マルチページ”なのだが、このアプローチでは画面全体の読み込みは最初1回で、その後は画面の一部しか更新されないので”シングルページ”に見えることから、シングルページアプリケーションと呼ばれる

Gmail, Alibaba, Netflix, Airbnbなど世界を席巻するIT企業が採用している。

サーバーレスアーキテクチャ

クライアントとサーバーの役割分担だけでなく、3層に連なるサーバー群も見直されている。

サーバーはもともとは物理的なコンピュータで構成されていたため、自分でハードウェアを購入し、OSをセットアップし、不具合が起きていないか監視をしたりする必要があった。そのため、管理が大変でWebアプリケーションを運営するコスト・スキルも非常に高くなっていた。

f:id:BusinessManBlogForBusinessMan:20200502151739p:plain
そこで、サーバーを仮想化してWeb上で提供するAWS,GCPなどのIaaSが登場し、サーバーの運営をサービスに委ねることでコスト・スキルが低減された

しかしながら、アプリケーションの機能とは関係ないサーバーの追加・削減などの管理業務は残っており、Webアプリケーションとして付加価値を生まない部分にコストが費やされていた。

f:id:BusinessManBlogForBusinessMan:20200502152040p:plain

そこで、さらに進んでサーバー管理を全くする必要がなく、処理が実行できるサーバーレスコンピューティングサービスが登場した。

始めは部分的な機能しか提供されたいなかったサーバーレスコンピューティングサービスも次第に充実しており、これらを組み合わた”サーバーレスアーキテクチャ”と呼ばれるWebアプリケーションの構造が考案された。

サーバーレスアーキテクチャでは、サーバーの管理をIaaSベンダーに委ねることで、Webアプリケーションの機能に集中でき、付加価値の高いサービスを作成できることになった。

f:id:BusinessManBlogForBusinessMan:20200502174541p:plain

現在は様々なサービスが提供されており、一部のWebアプリケーションの機能までをカバーするようなサービスも提供されている

tracpath.com

 

 今回採用するWebアプリケーションのパターン

自身が開発するWebアプリケーションだが、学習目的であることもあり、レスポンスの速度などを気にしたくない、可能な限りIaaSサービスを利用したいので、SPA + サーバーレスことを検討する

もちろんサーバー管理を勉強するために、一般的な構成を採用してもよいのだが、IT技術はいまだ勃興中であることもあり、将来のWebアプリケーションの開発にサーバー管理の知識が必要なくなる可能性が高く今後の学習する範囲からは除外する

次回の記事

まずはSPA構成する技術要素を確認しながら、利用可能なフレームワークの比較検討していく

businessman-learn-coding.hatenablog.com

 

引用記事

【入門編】サーバーとは?役割や種類をわかりやすく解説!

クライアントサーバの3階層システムの基本 - ponsuke_tarou’s blog

AWS Lambda(イベント発生時にコードを実行)| AWS

AWS 導入事例:株式会社 日本経済新聞社 | AWS

AWSの全体像をつかむ!Amazon Web Servicesをざっくり解説する | tracpath:Works