Successfully reported this slideshow.
We use your LinkedIn profile and activity data to personalize ads and to show you more relevant ads. You can change your ad preferences anytime.
~新機能の紹介~


瀬尾佳隆 (y.seo@seosoft.jp)
 Microsoft MVP for Visual C#
              技術ひろば.net




                              ...
   瀬尾 佳隆 (せお よしたか)
    ◦ MVP for Visual C# (Jan 2009 – Dec 2010)
    ◦ 好きなもの:Windowsアプリ、Office、SharePoint
         あれっ、W...
   ASP.NET MVC 2の機能強化/機能追加の概要を
    お持ち帰りいただくこと
    ◦ ご自身で評価、自習する際の手引きになれば幸いです
   ASP.NET MVCにあまり慣れていない方に基本的な
    操作を感じてい...
   3月11日に RTMがリリース されました!
    ◦ Visual Studio 2010な方はあと半月ほど待ちましょう
      2010にインストールしようとすると怒られます
    ◦ 今日は Visual Studio ...
   MVCの超入門
   HTMLヘルパー
    ◦   DisplayFor
    ◦   TextBoxFor など
    ◦   LabelFor
    ◦   EditorFor
   Area




        ...
念のため見ておきましょう




               6
   Web開発では一般的な考え方
   Model – View – Controller
    が役割を分担

     Model       • 操作・表示対象のデータ



      View       • ユーザーと対話す...
   ASP.NETをベースとしたMVCパターンの
    フレームワーク
    ◦ サーバーコントロールは使いません(使えません)
    ◦ 見た目の部分はHTML や埋め込みのスクリプトで記述
      レスポンスがシンプル&開発...
•DB連携ならばADO.NET Entity Data Model または LINQ to SQL Classを使う
 Model


          •Controllersフォルダーで右クリック→[Add]→[Controller]
 ...
Viewの記述を “手助け” してくれる
ヘルパーメソッド




                       10
MVC 2でのメソッド名         機能                    MVC 1.0で対応するもの

                     プロパティー値を表示            Html.Encode (※1)
Htm...
Details.aspxの場合(抜粋)
<p>                                     <div class="display-label">
  ProductID:                      ...
   Html.Encodeの単純な置き換えという意味では、
    DisplayForに変更する必要はありません
    ◦ DisplayForの本質はモデルに適した表示ができることです
      あとで改めて
    ◦ プロパテ...
<p>                            <div class="editor-label">
 <label for="ProductName">      <%= Html.LabelFor(
             ...
   積極的に使うことをおすすめします
    ◦ IntelliSenseが使えます
    ◦ つまり、コンパイル時にタイプミスなどのエラーがわかります
    ◦ 1.0では冗長だった
      “ProductName”, Mode...
<p>                            <div class="editor-label">
 <label for="ProductName">      <%= Html.LabelFor(
             ...
   Html.LabelFor
    ◦ Model側でエンティティーのキャプションを一元管理できます
      日本人ならば “ProductName” ではなく “製品名” と表示したい
       ところ
      Mod...
   モデルに適した出力をします
    ◦ デフォルトではモデルに含まれるプロパティ名と値を
      列挙するだけ
    ◦ テンプレートを用意することで出力結果を制御できます


   もう少し具体的に見てみましょう




  ...
もう少し具体的なソースコードで
使い方を見てみましょう




                  19
   特定のView (複数でもよい)で特定のプロパティーの
    スタイルや書式を変更したい場合
    ◦ Viewのサブフォルダーに “DisplayTemplates” フォルダーを
      作成して、その中に Partial ...
   Partial Viewと出力Viewを以下のように




                                 21
   出力結果




           22
   アプリケーション全体のViewに共通して
    スタイルや書式を変更したい場合
    ◦ “DisplayTemplates” フォルダーにPartial Viewを作成する
    ◦ ModelのPartialクラスを作り、さら...
24
25
26
   プロパティーのキャプションを日本語にするなど、
    文字通り “ラベル” の操作を行います
    ◦ ModelのMetadataクラスで、キャプションを操作したい
      プロパティーを DisplayName 属性付きで定...
28
   Formを部品化することができます
    ◦ Viewのサブフォルダーに “EditorTemplates” を作成して
      部品化したいエンティティーの Partial View を作成
      Add View ダイ...
30
31
独立したサブセクションを実現する
機能




                   32
   独立したサブセクションを
    簡単に実現する機能
    ◦ フラットな構造だと、
      Controllersフォルダ、
      Viewsフォルダがどんどん
      乱雑になります
   下位コンテンツごとに
 ...
34
   プロジェクト(またはAreasフォルダ)で右クリック
    →[Add]→[Area]
   Area名を入力
   あとはそれぞれのAreaで普通のMVC開発手順で開発




                         ...
   大規模アプリケーションになるとAreaを使っても
    プロジェクトが乱雑になる可能性があります
   その場合は複数プロジェクトに分けるほうが
    より生産性・保守性が上がることがあります
    ◦ Areaに相当するプロジ...
そろそろ終わりです




            37
   ASP.NET MVC 2には今日紹介できなかった
    機能が他にもあります
    ◦ DefaultValue属性
      “/Controller/Action/id?page=1” のようなURLが可能
    ◦ 検...
   HTMLヘルパーが強化されました
    ◦ 非常に強い型付けのおかげで、Intellisenseや
      コンパイル時エラーが利用できます
    ◦ モデルに適した出力ができます
    ◦ 特定のViewのみのスタイル、アプ...
   ASP.NET MVC 公式サイト
    ◦ http://www.asp.net/mvc/
    ◦ 何はなくともここだけは

   What’s New in ASP.NET MVC 2
    ◦ http://www.as...
   「ASP.NET MVC 実践プログラミング」 (山田祥寛 著、秀和シ
    ステム 刊、3200円)

   「ASP.NET MVC入門」 (@IT)
    ◦ http://www.atmarkit.co.jp/fdotne...
   ASP.NET MVC 基礎のキソ
    ◦ http://tinyurl.com/aspnetmvc-kiso-200912
   ASP.NET MVC ~ Part 2
    ◦ http://tinyurl.com/asp...
43
Upcoming SlideShare
Loading in …5
×

ASP.NET MVC 2 ~新機能の紹介~

40,280 views

Published on

ASP.NET MVC 2 概要

2010 Community Open Day セッション資料

Published in: Technology
  • Be the first to comment

  • Be the first to like this

ASP.NET MVC 2 ~新機能の紹介~

  1. 1. ~新機能の紹介~ 瀬尾佳隆 (y.seo@seosoft.jp) Microsoft MVP for Visual C# 技術ひろば.net 1
  2. 2.  瀬尾 佳隆 (せお よしたか) ◦ MVP for Visual C# (Jan 2009 – Dec 2010) ◦ 好きなもの:Windowsアプリ、Office、SharePoint  あれっ、Webは?・・・やります、やります! ◦ 個人事業主です (屋号は瀬尾ソフト) ◦ 根っからの技術屋・開発屋 ◦ どうでもいい情報としては、ミュージカルが大好きです  技術ひろば.net ◦ http://hiroba-tech.net/ ◦ 毎月第3土曜日(原則)にオフライン勉強会を開催 ◦ モットーは「技術を楽しむ、技術でつながる」 ◦ 人と技術に敬意を払える方ならばどなたでも大歓迎! 2
  3. 3.  ASP.NET MVC 2の機能強化/機能追加の概要を お持ち帰りいただくこと ◦ ご自身で評価、自習する際の手引きになれば幸いです  ASP.NET MVCにあまり慣れていない方に基本的な 操作を感じていただくこと  Webアプリケーションのフレームワークとしての ASP.NET MVCの面白さを再認識/認識して いただくこと 3
  4. 4.  3月11日に RTMがリリース されました! ◦ Visual Studio 2010な方はあと半月ほど待ちましょう  2010にインストールしようとすると怒られます ◦ 今日は Visual Studio 2010 RC (+ MVC 2 RC2) を 使います 4
  5. 5.  MVCの超入門  HTMLヘルパー ◦ DisplayFor ◦ TextBoxFor など ◦ LabelFor ◦ EditorFor  Area 5
  6. 6. 念のため見ておきましょう 6
  7. 7.  Web開発では一般的な考え方  Model – View – Controller が役割を分担 Model • 操作・表示対象のデータ View • ユーザーと対話する部分 • リクエストを処理し、Model と Controller View をつなげる部分 ※MSDN マガジン 2008年3月号より 7
  8. 8.  ASP.NETをベースとしたMVCパターンの フレームワーク ◦ サーバーコントロールは使いません(使えません) ◦ 見た目の部分はHTML や埋め込みのスクリプトで記述  レスポンスがシンプル&開発者の意図したとおりにしやすい  ただし ASP.NETも 4 になって、かなりスッキリしました  よく言われるキーワードとしては、デザイナとの協業 ◦ 単体テストがやりやすい  ASP.NETを置き換える技術ではありません  ASP.NETの生産性  SilverlightのUX  適材適所、使い分けが大事 8
  9. 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
  10. 10. Viewの記述を “手助け” してくれる ヘルパーメソッド 10
  11. 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. 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. 13.  Html.Encodeの単純な置き換えという意味では、 DisplayForに変更する必要はありません ◦ DisplayForの本質はモデルに適した表示ができることです  あとで改めて ◦ プロパティー単位で表示のスタイル、書式を指定したい 場合にも使います  DateTime型に対して日付だけを表示したい  金額に対して通貨記号を付加して表示したい  名前は少し大きめのフォントにしたい  など・・・ 13
  14. 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. 15.  積極的に使うことをおすすめします ◦ IntelliSenseが使えます ◦ つまり、コンパイル時にタイプミスなどのエラーがわかります ◦ 1.0では冗長だった “ProductName”, Model.ProductName という表記を使わずにすみます 15
  16. 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. 17.  Html.LabelFor ◦ Model側でエンティティーのキャプションを一元管理できます  日本人ならば “ProductName” ではなく “製品名” と表示したい ところ  ModelMetadataを宣言することで可能になります(後述) ◦ IntelliSenseも使えます 17
  18. 18.  モデルに適した出力をします ◦ デフォルトではモデルに含まれるプロパティ名と値を 列挙するだけ ◦ テンプレートを用意することで出力結果を制御できます  もう少し具体的に見てみましょう 18
  19. 19. もう少し具体的なソースコードで 使い方を見てみましょう 19
  20. 20.  特定のView (複数でもよい)で特定のプロパティーの スタイルや書式を変更したい場合 ◦ Viewのサブフォルダーに “DisplayTemplates” フォルダーを 作成して、その中に Partial View (ascx) を作成する ◦ 書式についてはModelのDisplayFormat属性でも可能 20
  21. 21.  Partial Viewと出力Viewを以下のように 21
  22. 22.  出力結果 22
  23. 23.  アプリケーション全体のViewに共通して スタイルや書式を変更したい場合 ◦ “DisplayTemplates” フォルダーにPartial Viewを作成する ◦ ModelのPartialクラスを作り、さらにMetadataを定義する  この方法ではDisplayForの引数にTemplate名を指定しなくてもいい 23
  24. 24. 24
  25. 25. 25
  26. 26. 26
  27. 27.  プロパティーのキャプションを日本語にするなど、 文字通り “ラベル” の操作を行います ◦ ModelのMetadataクラスで、キャプションを操作したい プロパティーを DisplayName 属性付きで定義 27
  28. 28. 28
  29. 29.  Formを部品化することができます ◦ Viewのサブフォルダーに “EditorTemplates” を作成して 部品化したいエンティティーの Partial View を作成  Add View ダイアログで作成したひな形を編集するとラク 29
  30. 30. 30
  31. 31. 31
  32. 32. 独立したサブセクションを実現する 機能 32
  33. 33.  独立したサブセクションを 簡単に実現する機能 ◦ フラットな構造だと、 Controllersフォルダ、 Viewsフォルダがどんどん 乱雑になります  下位コンテンツごとに 別々のMVC を持てます 33
  34. 34. 34
  35. 35.  プロジェクト(またはAreasフォルダ)で右クリック →[Add]→[Area]  Area名を入力  あとはそれぞれのAreaで普通のMVC開発手順で開発 35
  36. 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. そろそろ終わりです 37
  38. 38.  ASP.NET MVC 2には今日紹介できなかった 機能が他にもあります ◦ DefaultValue属性  “/Controller/Action/id?page=1” のようなURLが可能 ◦ 検証機能  サーバーサイドで DataAnnotation を使用する方法  クライアントサイドでスクリプトを使用する方法 ◦ 非同期Controller  モデルの操作に時間がかかる場合に便利 38
  39. 39.  HTMLヘルパーが強化されました ◦ 非常に強い型付けのおかげで、Intellisenseや コンパイル時エラーが利用できます ◦ モデルに適した出力ができます ◦ 特定のViewのみのスタイル、アプリケーション共通の スタイルを任意に組み合わせて利用できます  AreaによりコンテンツごとにMVCを持つことが できます ◦ ただし大規模アプリケーションではサブプロジェクトの利用も 検討してください 39
  40. 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. 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. 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. 43

×