1.
ME"A"Nスタック提案プレゼンテーション
合同会社FullSailing
横山 巧

2.
目次
§1 ME"A"Nスタックとは
§1.1 MongoDBについて
➢ NoSQLデータベース
➢ なぜMongoDBなのか
§1.2 Express・Node.jsについて
➢ サーバーサイドJavaScript
➢ なぜExpress・Node.jsなのか
§1.3 "Angular"（フロントエンド）について
➢ EDA（イベント駆動アーキテクチャ）
§1.4 補足：Nginxについて
➢ サーバーアプリケーションとしての機能
➢ なぜNginxなのか
参考文献

3.
目次（再掲）
§1 ME"A"Nスタックとは
§1.1 MongoDBについて
➢ NoSQLデータベース
➢ なぜMongoDBなのか
§1.2 Express・Node.jsについて
➢ サーバーサイドJavaScript
➢ なぜExpress・Node.jsなのか
§1.3 "Angular"（フロントエンド）について
➢ EDA（イベント駆動アーキテクチャ）
§1.4 補足：Nginxについて
➢ サーバーアプリケーションとしての機能
➢ なぜNginxなのか
参考文献

4.
§1 ME"A"Nスタックとは
以下のアプリケーション・フレームワークから
構成される技術スタックのひとつ。
➢ MongoDB
データベースアプリケーション
➢ Express
サーバーサイドのJSフレームワーク
➢ Angular
クライアントサイドのJSフレームワーク
➢ Node.js
サーバーサイドのJSランタイム
様々なプラットフォーム上で動作する
バリエーションとして、AngularをReact.jsと置き換えたMERN、Vue.jsと置き換えた
MEVNが存在する。
(https://www.mongodb.com/mean-stack)

5.
§1.1 MongoDBについて
JSONによく似た形式（BSON, Binary JSON）でデータを保存するデータベース。
➢ １つ１つのデータを"ドキュメント" ⇔ "レコード（RDB）"
➢ ドキュメントの集まりを"コレクション" ⇔ "テーブル（RDB）"
➢ コレクションの集まりを"データベース" ⇔ "データベース（RDB）"
と呼び、管理する。"ドキュメント指向データベース"に分類される。
柔軟なデータモデルを謳っており、テーブル定義にあたる操作が必須でない！！ただし...
➢ 保存するドキュメントのフィールド名、データ型のバリデーションを設定する
➢ 検索に利用するフィールドのインデックスを作成する
➢ 複数のドキュメントのリレーションを登録する
ことによってRDBのような使い方もできる。汎用的なデータベース。
☞ mongoshでCRUD処理を実行 >>

6.
➢ NoSQLデータベース
Not only SQL（あるいはNon SQL）は、
リレーショナルデータベース以外の
データベースの総称。
2000年代後半、ストレージのコストが
劇的に下がっていくのに合わせて登場。
正規化されていない、重複を許すような
形式でデータを保存したとしても、
運用コストへの影響は限定的に。
NoSQLの多くは、以下の特徴を持つ。
➢ 柔軟なデータモデル
➢ スケールアウト可能
➢ 高いデータ検索性能
➢ 開発者にとって扱いやすいデータ構造
（ MongoDB - NoSQL vs. SQL Databases より）
(https://www.mongodb.com/en/nosql-explained)

7.
➢ なぜMongoDBなのか
データベースエンジンの中で非常に
高い人気を誇る。
DB-Engines Ranking より、
全体ランキング５位、NoSQL首位
（2023年1月現在）
MongoDBを採用することで、
➢ 豊富なドキュメントや参考記事を
活用しながら開発できる
➢ 案件を受注しやすくなる
➢ "MongoDB Atlas"というDBaaS
（DataBase as a Service）で、
インフラ構築を行うことができる
(https://db-engines.com/en/ranking)
➢ RDBと組み合わせて活用することが
期待できる
（"Polyglot Persistence"）
➢ NoSQLに関する知見を獲得できる

8.
§1.2 Express・Node.jsについて
Node.jsは、JavaScriptでサーバーサイドのアプリケーションやツールを作成するための
ランタイム。
➢ HTTPサーバーの機能やOSのファイルシステムを利用する機能を備えている
➢ Webブラウザ以外での使用が想定されているため、たとえば"document"のような
Webブラウザ特有のJavaScript APIを使用することはできない
Expressは、Node.jsのWebフレームワーク。
➢ HTTPリクエストを処理するためのルーティング、ミドルウェア登録を行う
メソッドを提供する
➢ テンプレート・エンジンと統合し、動的にHTMLを生成することができる
➢ 機能を必要最低限に絞った、"ミニマリスト"なWebフレームワークと言え、
"Unopinionated"な傾向を持つ
（制約が緩く柔軟なアプリケーション構築が行えるため、実装の選択肢が多い）
参考 ： mdn web docs - Express/Node introduction

9.
➢ サーバーサイドJavaScript
npm（Node.jsのパッケージ管理ツール）で
Expressをインストールし、HTTPサーバーを
作成する。
プロジェクトルートで以下のコマンドを実行
$ npm init
$ npm install express
JavaScriptファイル（index.js）を作成し、
nodeコマンドで実行
$ node index.js
"http://localhost:3000"にアクセスすると、
"Hello world"の文字列がレスポンスされる。

10.
➢ なぜExpress・Node.jsなのか
Webフレームワークの中で非常に高い人気を誇る。
Stack Overflow Developer Survey 2022 より
多くのフレームワークが、Expressを用いて作成されている。
Express・Node.jsを採用することにより、
➢ 豊富なドキュメントや参考記事を
活用しながら開発できる
➢ 案件を受注しやすくなる
➢ すでにJavaScriptの知見がある場合、
導入初期の学習コストを抑えられる
➢ "Unopinionated"な傾向を持つため、
様々なアプリの実装方法を試せる
➢ AWSを含め、多くのNode.jsを
サポートするホスティング
プロバイダーでデプロイできる

11.
§1.3 "Angular"（フロントエンド）について
TypeScriptで作成された開発プラットフォーム。
➢ スケーラブルなWebアプリケーションを開発するためのコンポーネント指向
フレームワーク
➢ ルーティングやHTMLフォーム管理、クライアント・サーバー通信など、幅広い
機能群を提供するライブラリ
➢ 開発者をサポートする様々なツール群
が含まれる。（ Angular - What is Angular? より）
Angular でクライアントサイドのSPA（シングルページアプリケーション）を作成し、
AJAX通信でバックエンドのExpressサーバーとJSONデータをやり取りさせる。
⚠︎ 注意︎ ： AngularとAngularJS（前者の前身となったMVWフレームワーク）とを
混同しないこと！！

12.
➢ EDA（イベント駆動アーキテクチャ）
"イベント"を生産(Produce)・仲介(Mediate)・消費(Consume)するコンポーネントを
組み合わせてアプリケーションを構築するデザインパターン。
➢ マイクロサービスアーキテクチャにおいて、サービスどうしを疎結合に保つ
➢ イベントを非同期に処理することで、リアルタイムなUXを実現する
➢ コンポーネントごとにスケーラビリティを与える
大規模な分散システムを構築するときなどに活用される、モダンなアーキテクチャ。
参考 ： AWS - What is EDA?
"イベント駆動"の考え方は、JavaScript
（フロントエンド）で常に実践されている。
➢ "document.addEventListener()"
➢ クリックなどのイベント発生に応じて
適切なイベントハンドラーを呼び出す
(https://medium.com/@msrijita189/event-driven-architecture-what-why-and-how-1033b97b24df)

13.
§1.4 補足：Nginxについて
"EDA"を採用するオープンソースのWebサーバーアプリケーション。
リクエスト処理を担当するプログラムは、プロセスごとにシングルスレッドで動作し、
同時接続数の多いサーバーにおいて、高いパフォーマンスを発揮する。
"C10K問題"を解決することを試みて開発され、2004年に1stリリースされた。
ウィキペディアフリー百科事典
参考 ： 【勉強メモ】C10K問題【マルチプロセス・マルチスレッド】

14.
➢ サーバーアプリケーションとしての機能
HTTPサーバーとしてリリースされたが、現在は他にも様々な機能を提供している。
➢ 静的コンテンツの配信
➢ リバースプロキシ
➢ コンテンツキャッシュ
➢ ロードバランシング
➢ メールプロキシ
など。セキュリティに関しては、SSL/TLSをサポート。
参考 ： nginx
動的コンテンツ（たとえばExpressで生成されたHTMLファイル）を配信する場合は、
Nginxをリバースプロキシとして使用し、HTTPリクエストをExpressサーバーへ転送、
レスポンスをクライアントへ送り返す。

15.
➢ なぜNginxなのか
Webサーバーの中でトップシェアを持つ。
NETCRAFT December 2022
Web Server Survey より
（2022年12月）
Nginxを採用することで、
➢ 案件を受注しやすくなる
➢ 中小規模のアプリケーションに
おいて、Webサーバーに関する
複数の要件を同時に満たすことが
期待できる
➢ 大規模アプリケーションにおいて、
同時接続数の要件を満たすことが
期待できる
(https://news.netcraft.com/archives/2022/12/20/december-2022-web-server-survey.html)

16.
§1 ME"A"Nスタックとは（再掲）
以下のアプリケーション・フレームワークから
構成される技術スタックのひとつ。
➢ MongoDB
データベースアプリケーション
➢ Express
サーバーサイドのJSフレームワーク
➢ Angular
クライアントサイドのJSフレームワーク
➢ Node.js
サーバーサイドのJSランタイム
様々なプラットフォーム上で動作する
バリエーションとして、AngularをReact.jsと置き換えたMERN、Vue.jsと置き換えた
MEVNが存在する。
(https://www.mongodb.com/mean-stack)

17.
目次（再掲）
§1 ME"A"Nスタックとは
§1.1 MongoDBについて
➢ NoSQLデータベース
➢ なぜMongoDBなのか
§1.2 Express・Node.jsについて
➢ サーバーサイドJavaScript
➢ なぜExpress・Node.jsなのか
§1.3 "Angular"（フロントエンド）について
➢ EDA（イベント駆動アーキテクチャ）
§1.4 補足：Nginxについて
➢ サーバーアプリケーションとしての機能
➢ なぜNginxなのか
参考文献

18.
参考文献
➢ MongoDB
➢ MongoDB Documentation - What is MongoDB?
➢ MongoDB Documentation - MongoDB CRUD Operations
➢ MongoDB Documentation - What is NoSQL?
➢ MongoDB Documentation - NoSQL vs. SQL Databases
➢ BSON (Binary JSON) Serialization
➢ DB-Engines Ranking
➢ James Serra's Blog - What is Polyglot Persistence?
➢ Express・Node.js
➢ Node.js - Guides
➢ Express - Node.js web application framework
➢ mdn web docs - Express web framework (Node.js/JavaScript)
➢ mdn web docs - Express/Node Introduction
➢ Stack Overflow Developer Survey 2022 - Web frameworks and Technologies

19.
参考文献
➢ Angular
➢ Angular - What is Angular?
➢ mdn web docs - Getting started with Angular
➢ Event Driven Architecture
➢ AWS - What is EDA?
➢ Red Hat Developer - Event-driven architecture for microservices
➢ Nginx
➢ Nginx
➢ Javatpoint - NGINX Tutorial
➢ Medium - NGINX Architecture
➢ パソコン工房 NEXMAG - CPUのクロック数やコア数とは？シェフに例えてみる
➢ Webpia - プロセスとスレッドの違いとは？超わかりやすく解説！【図解とプログラム付き】
➢ Hatena Blog - 【勉強メモ】C10K問題【マルチプロセス・マルチスレッド】
➢ NETCRAFT - December 2022 Web Server Survey