Twitterのようなアプリを設計する際
①要件定義
<機能要件>
投稿を作る。
投稿を編集する。
投稿を削除する。
投稿をお気に入りとする。
投稿に対してコメントをする。
などの基本的な機能を定義することを言います。
<非機能要件>
機能に付随する要件やセキュリティ要件
などを定義する。
②用語定義
上記の要件定義であがった用語を定義する。
| 用語 | 英語表記 | 意味 |
|---|---|---|
| ユーザー | user | 投稿の利用者 |
| 投稿 | tweet | 投稿をすること |
| お気に入り | favorite | 投稿をお気に入りに登録すること |
| コメント | comment | 投稿に対してコメントをすること |
用語の表す対象の意味付けをしっかりすることで、思わぬ実装ミスを防ぐことができます。
③データモデリング
ER図などを使い用語の関係性などを定義する。
用語設計をすることによって、要件に漏れがないか、仕組みに問題がないかをチェックすることができます。
ユーザー1 --------- *投稿1 ---------*お気に入り
④URL設計
内容を表示するページ構成を設計する。
同じページ上に表示できるものは一緒のページをする。
・トップページ/投稿一覧ページ
・自分の投稿/コメント/お気に入りを表示するページ
・投稿を作成するページ
・投稿を編集するページ
ページURL
| パス | メソッド | ページの内容 |
|---|---|---|
| / | GET | トップページ/投稿一覧ページ |
| /tweet/:tweetid | GET | 自分の投稿/コメント/お気に入りを表示するページ |
| /tweet/new | GET | 投稿を作成するページ |
| /tweet/:tweetid/edit | GET | 投稿を編集するページ |
WEBAPIのURL
| パス | メソッド | 処理内容 | 方法 |
|---|---|---|---|
| /tweet | POST | 投稿をする | フォーム |
| /tweet/:tweetid?edit=1 | POST | 投稿を編集する | フォーム |
| /tweet/:tweetid?delete=1 | POST | 投稿を削除する | AJAX |
| /tweet/:tweetid/user/:userid/favorite | POST | 投稿をお気に入りする | AJAX |
| /tweet/:tweetid/user/:userid/comment | POST | 投稿にコメントをする | AJAX |
④モジュール設計
Expressなどのフレームワークを使えばモジュール設計は簡単ですが、
ここではMVCに当てはめてみます。
MVC
モジュール設計はMVCフレームワークを使うと整理がしやすいです。
Model
Modelはデータモデリングのことを指し、データの管理を行うモジュールを当てはめます。
Modelモジュールはmodelsディレクトリの配下におきます。
| ファイル名 | models/user.js | models/tweet.js | models/comment.js | models/favorite.js |
|---|---|---|---|---|
| 役割 | ユーザーの定義と保存 | ツイートの定義と保存 | コメントの定義と保存 | お気に入りの定義と保存 |
View
Viewは見た目、HTMLなどを生成するテンプレート（pugやEJS）を当てはめます。
Viewはviewsディレクトリの中におきます。
| ファイル名 | index.pug | new.pug | layout.pug | edit.pug |
|---|---|---|---|---|
| 役割 | トップ/投稿一覧モジュール | 新規投稿モジュール | 基礎モジュール | 投稿編集モジュール |
Controller
ControllerはModelとViewをコントロールする部分で、Node.jsだとルーティングを指します。
| ファイル名 | routes/tweet.js | routes/comment.js | routes/fovorite.js |
|---|---|---|---|
| 役割 | ツイートの処理 | コメントの処理 | お気に入りの処理 |