ASP.NET MVC 2 ～新機能の紹介～
0 likes36,064 views
ASP.NET MVC 2 概要 2010 Community Open Day セッション資料
![•DB連携ならばADO.NET Entity Data Model または LINQ to SQL Classを使う
Model
•Controllersフォルダーで右クリック→[Add]→[Controller]
•クラスの接尾辞は必ず “Controller”
Controller •DB連携するには [Add action methods for ～ ] のチェックを忘れずに
•Controllerクラスのメソッド名で右クリック→[Add View]
•DB連携するには [Create Strongly-typed view] のチェックを忘れずに
View •[View data class] と [View content] の選択
9](https://image.slidesharecdn.com/aspnetmvc2-100328004403-phpapp02/85/ASP-NET-MVC-2-9-320.jpg)
![ プロジェクト（またはAreasフォルダ）で右クリック
→[Add]→[Area]
Area名を入力
あとはそれぞれのAreaで普通のMVC開発手順で開発
35](https://image.slidesharecdn.com/aspnetmvc2-100328004403-phpapp02/85/ASP-NET-MVC-2-35-320.jpg)
ASP.NET MVC 2 ～新機能の紹介～
- 1. ～新機能の紹介～ 瀬尾佳隆 ([email protected]) Microsoft MVP for Visual C# 技術ひろば.net 1
- 2. 瀬尾 佳隆 （せお よしたか） ◦ MVP for Visual C# (Jan 2009 – Dec 2010) ◦ 好きなもの：Windowsアプリ、Office、SharePoint あれっ、Webは？・・・やります、やります！ ◦ 個人事業主です （屋号は瀬尾ソフト） ◦ 根っからの技術屋・開発屋 ◦ どうでもいい情報としては、ミュージカルが大好きです 技術ひろば.net ◦ http://hiroba-tech.net/ ◦ 毎月第3土曜日（原則）にオフライン勉強会を開催 ◦ モットーは「技術を楽しむ、技術でつながる」 ◦ 人と技術に敬意を払える方ならばどなたでも大歓迎！ 2
- 3. ASP.NET MVC 2の機能強化／機能追加の概要を お持ち帰りいただくこと ◦ ご自身で評価、自習する際の手引きになれば幸いです ASP.NET MVCにあまり慣れていない方に基本的な 操作を感じていただくこと Webアプリケーションのフレームワークとしての ASP.NET MVCの面白さを再認識／認識して いただくこと 3
- 4. 3月11日に RTMがリリース されました！ ◦ Visual Studio 2010な方はあと半月ほど待ちましょう 2010にインストールしようとすると怒られます ◦ 今日は Visual Studio 2010 RC (+ MVC 2 RC2) を 使います 4
- 5. MVCの超入門 HTMLヘルパー ◦ DisplayFor ◦ TextBoxFor など ◦ LabelFor ◦ EditorFor Area 5
- 6. 念のため見ておきましょう 6
- 7. Web開発では一般的な考え方 Model – View – Controller が役割を分担 Model • 操作・表示対象のデータ View • ユーザーと対話する部分 • リクエストを処理し、Model と Controller View をつなげる部分 ※MSDN マガジン 2008年3月号より 7
- 8. ASP.NETをベースとしたMVCパターンの フレームワーク ◦ サーバーコントロールは使いません（使えません） ◦ 見た目の部分はHTML や埋め込みのスクリプトで記述 レスポンスがシンプル＆開発者の意図したとおりにしやすい ただし ASP.NETも 4 になって、かなりスッキリしました よく言われるキーワードとしては、デザイナとの協業 ◦ 単体テストがやりやすい ASP.NETを置き換える技術ではありません ASP.NETの生産性 SilverlightのUX 適材適所、使い分けが大事 8
- 9. •DB連携ならばADO.NET Entity Data Model または LINQ to SQL Classを使う Model •Controllersフォルダーで右クリック→[Add]→[Controller] •クラスの接尾辞は必ず “Controller” Controller •DB連携するには [Add action methods for ～ ] のチェックを忘れずに •Controllerクラスのメソッド名で右クリック→[Add View] •DB連携するには [Create Strongly-typed view] のチェックを忘れずに View •[View data class] と [View content] の選択 9
- 11. MVC 2でのメソッド名 機能 MVC 1.0で対応するもの プロパティー値を表示 Html.Encode (※1) Html.DisplayFor モデルに適した形で表示 （Partial View） Html.TextBoxFor など HTML要素を生成 Html.TextBox など Html.LabelFor プロパティー名を表示 Html.Label モデルに適した形で Html.EditorFor （Partial View） HTML要素を生成 ※1 : Html.EncodeはHTMLエスケープのためのメソッドであり、 プロパティー値の表示そのものが機能というわけではない 11
- 12. Details.aspxの場合（抜粋） <p> <div class="display-label"> ProductID: ProductID</div> <div class=“display-field”> <%= Html.Encode(Model.ProductID) %> <%= Html.DisplayFor( </p> model => model.ProductID) %> </div> <p> ProductName: <div class="display-label"> <%= ProductName</div> Html.Encode(Model.ProductName) %> <div class=“display-field”> <%= </p> Html.Encode(Model.ProductName) %> </div> Html.Encode : MVC 1.0 Html.DisplayFor : MVC 2 12
- 13. Html.Encodeの単純な置き換えという意味では、 DisplayForに変更する必要はありません ◦ DisplayForの本質はモデルに適した表示ができることです あとで改めて ◦ プロパティー単位で表示のスタイル、書式を指定したい 場合にも使います DateTime型に対して日付だけを表示したい 金額に対して通貨記号を付加して表示したい 名前は少し大きめのフォントにしたい など・・・ 13
- 14. <p> <div class="editor-label"> <label for="ProductName"> <%= Html.LabelFor( model => model.ProductName) %> ProductName:</label> </div> <%= Html.TextBox( <div class="editor-field"> "ProductName", <%= Html.TextBoxFor( Model.ProductName) %> model => model.ProductName) %> <%= Html.ValidationMessage( <%= Html.ValidationMessageFor( "ProductName", "*") %> model => model.ProductName) %> </div> </p> Html.TextBox : MVC 1.0 Html.TextBoxFor : MVC 2 14
- 15. 積極的に使うことをおすすめします ◦ IntelliSenseが使えます ◦ つまり、コンパイル時にタイプミスなどのエラーがわかります ◦ 1.0では冗長だった “ProductName”, Model.ProductName という表記を使わずにすみます 15
- 16. <p> <div class="editor-label"> <label for="ProductName"> <%= Html.LabelFor( model => model.ProductName) %> ProductName:</label> </div> <%= Html.TextBox( <div class="editor-field"> "ProductName", <%= Html.TextBoxFor( Model.ProductName) %> model => model.ProductName) %> <%= Html.ValidationMessage( <%= Html.ValidationMessageFor( "ProductName", "*") %> model => model.ProductName) %> </div> </p> Html.TextBox : MVC 1.0 Html.TextBoxFor : MVC 2 16
- 17. Html.LabelFor ◦ Model側でエンティティーのキャプションを一元管理できます 日本人ならば “ProductName” ではなく “製品名” と表示したい ところ ModelMetadataを宣言することで可能になります（後述） ◦ IntelliSenseも使えます 17
- 18. モデルに適した出力をします ◦ デフォルトではモデルに含まれるプロパティ名と値を 列挙するだけ ◦ テンプレートを用意することで出力結果を制御できます もう少し具体的に見てみましょう 18
- 19. もう少し具体的なソースコードで 使い方を見てみましょう 19
- 20. 特定のView (複数でもよい)で特定のプロパティーの スタイルや書式を変更したい場合 ◦ Viewのサブフォルダーに “DisplayTemplates” フォルダーを 作成して、その中に Partial View (ascx) を作成する ◦ 書式についてはModelのDisplayFormat属性でも可能 20
- 21. Partial Viewと出力Viewを以下のように 21
- 22. 出力結果 22
- 23. アプリケーション全体のViewに共通して スタイルや書式を変更したい場合 ◦ “DisplayTemplates” フォルダーにPartial Viewを作成する ◦ ModelのPartialクラスを作り、さらにMetadataを定義する この方法ではDisplayForの引数にTemplate名を指定しなくてもいい 23
- 24. 24
- 25. 25
- 26. 26
- 27. プロパティーのキャプションを日本語にするなど、 文字通り “ラベル” の操作を行います ◦ ModelのMetadataクラスで、キャプションを操作したい プロパティーを DisplayName 属性付きで定義 27
- 28. 28
- 29. Formを部品化することができます ◦ Viewのサブフォルダーに “EditorTemplates” を作成して 部品化したいエンティティーの Partial View を作成 Add View ダイアログで作成したひな形を編集するとラク 29
- 30. 30
- 31. 31
- 32. 独立したサブセクションを実現する 機能 32
- 33. 独立したサブセクションを 簡単に実現する機能 ◦ フラットな構造だと、 Controllersフォルダ、 Viewsフォルダがどんどん 乱雑になります 下位コンテンツごとに 別々のMVC を持てます 33
- 34. 34
- 35. プロジェクト（またはAreasフォルダ）で右クリック →[Add]→[Area] Area名を入力 あとはそれぞれのAreaで普通のMVC開発手順で開発 35
- 36. 大規模アプリケーションになるとAreaを使っても プロジェクトが乱雑になる可能性があります その場合は複数プロジェクトに分けるほうが より生産性・保守性が上がることがあります ◦ Areaに相当するプロジェクトを作成 ◦ メインプロジェクトでそれらのプロジェクトを参照・管理 詳しい手順はMSDN Libraryの “Creating an ASP.NET MVC Areas Application Using Multiple Projects” を参照してください ◦ http://msdn.microsoft.com/en- us/library/ee307987(VS.100).aspx 36
- 37. そろそろ終わりです 37
- 38. ASP.NET MVC 2には今日紹介できなかった 機能が他にもあります ◦ DefaultValue属性 “/Controller/Action/id?page=1” のようなURLが可能 ◦ 検証機能 サーバーサイドで DataAnnotation を使用する方法 クライアントサイドでスクリプトを使用する方法 ◦ 非同期Controller モデルの操作に時間がかかる場合に便利 38
- 39. HTMLヘルパーが強化されました ◦ 非常に強い型付けのおかげで、Intellisenseや コンパイル時エラーが利用できます ◦ モデルに適した出力ができます ◦ 特定のViewのみのスタイル、アプリケーション共通の スタイルを任意に組み合わせて利用できます AreaによりコンテンツごとにMVCを持つことが できます ◦ ただし大規模アプリケーションではサブプロジェクトの利用も 検討してください 39
- 40. ASP.NET MVC 公式サイト ◦ http://www.asp.net/mvc/ ◦ 何はなくともここだけは What’s New in ASP.NET MVC 2 ◦ http://www.asp.net/learn/whitepapers/what-is-new-in- aspnet-mvc/ ◦ 文字通り ASP.NET MVC 2の新機能の概要紹介 ◦ 今日は紹介できなかった機能についても記載されています Scott Gu’s Blog ◦ http://weblogs.asp.net/scottgu/ ◦ マイクロソフト Scott Guthrie 氏のブログ 40
- 41. 「ASP.NET MVC 実践プログラミング」 （山田祥寛 著、秀和シ ステム 刊、3200円） 「ASP.NET MVC入門」 （@IT） ◦ http://www.atmarkit.co.jp/fdotnet/aspnetmvc/index/index .html ◦ これを読めば、今日の話はすべて忘れても大丈夫です 「Web フォームを使用しないで Web アプリケーションを作成す る」 （MSDN マガジン 2008年3月号） ◦ http://msdn.microsoft.com/ja- jp/magazine/cc337884.aspx 「Professional ASP.NET MVC 1.0」 （Wrox） ◦ http://aspnetmvcbook.s3.amazonaws.com/aspnetmvc- nerdinner_v1.pdf ◦ 書籍のオンライン版がタダで読めます 41
- 42. ASP.NET MVC 基礎のキソ ◦ http://tinyurl.com/aspnetmvc-kiso-200912 ASP.NET MVC ～ Part 2 ◦ http://tinyurl.com/aspnetmvc-part2-201002 すみません、半分宣伝です ◦ 勉強会で過去に私が担当したセッションの資料です ◦ ASP.NET MVCの基礎から学んでみたい方はどうぞ 42
- 43. 43