SPA(Single Page Application)のURL設計

イシュー

• SPA（シングル画面アプリ）でCRUD（リストと詳細と編集）を作ろうと思った時に、URLの設計をどうしたらいいのか微妙に困ったので調べる。
• （シングルページなので、RESTのURL規則が使えない、、）
• Single Page Applicationの標準ルーティングルールがあったら欲しい

参考

• RIAに代わる技術、実用的SPAについて考える～第7回エンタープライズ×HTML5ナイトセミナー～ | HTML5Experts.jp
• ASP.NET MVC 5 - .NET 開発者向け Single Page Application 入門
  • マッピング（登録済みルート定義と対応する URL）サンプルあり
• "Single-page Application" - 記事一覧 - albatrosary's blog
• ASP.NET Web Pages: より柔軟なルーティングを利用する - だるろぐ
  • ASP.NET の規約ベースのルーティング
• express-map
  • Expressのマッピング

Gmail のURL設計

• 受信トレイ クリック時
  • https://mail.google.com/mail/u/0/#inbox
• メールのタイトル クリック時
  • https://mail.google.com/mail/u/0/#inbox/146847938c50ad38
• スター付き クリック時
  • https://mail.google.com/mail/u/0/#starred
• 重要 クリック時
  • https://mail.google.com/mail/u/0/#imp
• 送信済メール クリック時
  • https://mail.google.com/mail/u/0/#sent
• 下書き クリック時
  • https://mail.google.com/mail/u/0/#drafts
• カテゴリ クリック時
  • https://mail.google.com/mail/u/0/#
• カテゴリ＞ソーシャル クリック時
  • https://mail.google.com/mail/u/0/#category/social
• カテゴリ＞プロモーション クリック時
  • https://mail.google.com/mail/u/0/#category/promotions
• カテゴリ＞新着 クリック時
  • https://mail.google.com/mail/u/0/#category/updates
• ログイン直後
  • https://mail.google.com/mail/u/0/?pli=1#inbox

URL設計

• なんか、これといった規約がない
• なので、基本RESTをベースにしたマッピングルールにする
• ただし、GETオンリーなんで、editのときは、/editをつけるみたいななんちゃってRESTを参考にする。
• ベースのURL

  http://{hostname}/apex/SgActivitys

パラメータがない場合

• リストを表示

  http://{hostname}/apex/SgActivitys#/list をマップ

パラメータがある場合

• 詳細 or 編集を表示
• http://{hostname}/apex/SgActivitys#/{Activity以外のID}

  http://{hostname}/apex/SgActivitys#/blank?parentId={Activity以外のID} をマップ

• http://{hostname}/apex/SgActivitys#/{ActivityのID}

  http://{hostname}/apex/SgActivitys#/show?Id={ActivityのID} をマップ

• http://{hostname}/apex/SgActivitys#/{ActivityのID}/e

  http://{hostname}/apex/SgActivitys#/edit?Id={ActivityのID} をマップ