asp net mvc 基礎のキソ

58
瀬尾佳隆 ([email protected]) Microsoft MVP for Visual C# 1

Upload: yoshitaka-seo

Post on 14-Dec-2014

2.994 views

Category:

Technology


0 download

DESCRIPTION

ASP.NET MVC 基礎のキソ 技術ひろば.net 2009年12月勉強会 セッション資料 (2009年12月19日開催)

TRANSCRIPT

Page 1: Asp Net Mvc 基礎のキソ

瀬尾佳隆 ([email protected])Microsoft MVP for Visual C#

1

Page 2: Asp Net Mvc 基礎のキソ

道場スタイル(風)◦ 資料の説明は極力少なめで◦ 基本を実際に操作してお見せします◦ 自習のきっかけとして見てください

ASP.NET MVC に全く or あまり触ったことがない方、これから触ってみようという方のためのセッションです◦ 漠然とでも、「ASP.NET とはずいぶん違うな~」という感覚◦ ASP.NET MVC は実はそんなに面倒ではないということ◦ 手順(お作法)と基本的な考え方◦ ・・・を体感していただくことを目標としています

経験者には簡単すぎる内容です◦ 寝てるか◦ フォローするか◦ ・・・をお願いします 打たれ弱いので、優しく見守ってください (^^;)

2

Page 3: Asp Net Mvc 基礎のキソ

ASP.NET MVCとは?◦ ASP.NET MVCとは?/MVC パターンとは?

開発手順とデモ◦ ダウンロード&インストール◦ プロジェクトの構成◦ ルーティング◦ Controller の作成、View の作成◦ Controller→View のデータの渡し方◦ POSTの方法◦ DB 連携 データモデルの定義

ASP.NET MVC の DB 連携

3

Page 4: Asp Net Mvc 基礎のキソ

文字通り、MVC パターンの ASP.NET です :-P◦ サーバーコントロールは使いません(使えません)◦ 見た目の部分は HTML や View 埋め込みコードで記述 よく言われるキーワードとしては、デザイナとの協業

でも Windows に慣れた開発者には面倒(?)

◦ レスポンスがシンプル&開発者の意図したとおりになります◦ 単体テストが簡単 開発生産性は ASP.NET のほうが多分上・・・

◦ ASP.NET を置き換える技術、開発手法ではありません 結局 ASP.NET との使い分けが大事 個人的には ASP.NET のほうが好きですが

Silverlight なんかもあったりしますが

4

Page 5: Asp Net Mvc 基礎のキソ

Web 開発では一般的な考え方

Model – View – Controller

が役割を分担◦ Model ・・・データ操作を担当する部分

◦ View ・・・ユーザーと対話する部分

◦ Controller・・・リクエストを処理し、Model と View をつなげる部分

5

※MSDN マガジン 2008年3月号より

Page 6: Asp Net Mvc 基礎のキソ

Visual Studio 2008 SP1

または Visual Web Developer Express Edition (無償)◦ ただし VWD の場合はユニットテストは使えません

6

Page 7: Asp Net Mvc 基礎のキソ

http://www.asp.net/mvc/ でダウンロード(無償)

7

Page 8: Asp Net Mvc 基礎のキソ

8

Page 9: Asp Net Mvc 基礎のキソ

9

Page 10: Asp Net Mvc 基礎のキソ

10

Page 11: Asp Net Mvc 基礎のキソ

11

Page 12: Asp Net Mvc 基礎のキソ

12

Page 13: Asp Net Mvc 基礎のキソ

Controllers

Models

Views◦ MVC の役割ごとのファイルは上のそれぞれのフォルダに配置

Globals.asax

◦ ルーティングのルールはココで決める

*.Tests◦ ユニットテストはここ

13

Page 14: Asp Net Mvc 基礎のキソ

14

Page 15: Asp Net Mvc 基礎のキソ

ルーティングのルールを決めているのは・・・

15

Page 16: Asp Net Mvc 基礎のキソ

16

Page 17: Asp Net Mvc 基礎のキソ

17

Page 18: Asp Net Mvc 基礎のキソ

18

Page 19: Asp Net Mvc 基礎のキソ

まずは View を呼び出すだけの Controller のままで動かしてみます

19

Page 20: Asp Net Mvc 基礎のキソ

20

Page 21: Asp Net Mvc 基礎のキソ

21

Page 22: Asp Net Mvc 基礎のキソ

まずは単なる静的ページ

22

Index.aspx

Page 23: Asp Net Mvc 基礎のキソ

面白みのない当たり前の結果・・・ですが◦ ルーティングされて

◦ Controller が呼び出され

◦ さらに View が呼び出されたものが、これです

23

Page 24: Asp Net Mvc 基礎のキソ

24

Page 25: Asp Net Mvc 基礎のキソ

ViewData を通してデータを受け渡し 表示の際は Html.Encode を使う

◦ クロスサイトスクリプティング対策

25

Index.aspx (変更)

Page 26: Asp Net Mvc 基礎のキソ

26

Page 27: Asp Net Mvc 基礎のキソ

27

Page 28: Asp Net Mvc 基礎のキソ

Input 要素(Html.TextBox ヘルパー)の名前を Controller 側と揃えることに注意

28

Post.aspx

Page 29: Asp Net Mvc 基礎のキソ

特に難しいところはありません

29

Result.aspx

Page 30: Asp Net Mvc 基礎のキソ

30

Page 31: Asp Net Mvc 基礎のキソ

まずは DB の準備

31

Page 32: Asp Net Mvc 基礎のキソ

32

Page 33: Asp Net Mvc 基礎のキソ

33

Page 34: Asp Net Mvc 基礎のキソ

34

Page 35: Asp Net Mvc 基礎のキソ

既定値を変更◦ Discontinued・・・

False

◦ UnitPrice・・・0

◦ UnitsInStock・・・0

◦ UnitsOnOrder・・・0

新規登録時の既定値として使われる値

35

Page 36: Asp Net Mvc 基礎のキソ

“Add Action methods …” のチェックを忘れずに

36

Page 37: Asp Net Mvc 基礎のキソ

37

※ Controller クラスでは Model の using を追加しておくとラク(ファイル先頭付近に “using <プロジェクト名>.Models; ” を追加)

Page 38: Asp Net Mvc 基礎のキソ

38

Page 39: Asp Net Mvc 基礎のキソ

39

Index.aspx (前半)

Page 40: Asp Net Mvc 基礎のキソ

40

Index.aspx (後半)

Page 41: Asp Net Mvc 基礎のキソ

41

Page 42: Asp Net Mvc 基礎のキソ

42

Page 43: Asp Net Mvc 基礎のキソ

43

Page 44: Asp Net Mvc 基礎のキソ

44

Details.aspx (前半)

Page 45: Asp Net Mvc 基礎のキソ

45

Details.aspx (後半)

Page 46: Asp Net Mvc 基礎のキソ

46

Page 47: Asp Net Mvc 基礎のキソ

47

Page 48: Asp Net Mvc 基礎のキソ

48

Page 49: Asp Net Mvc 基礎のキソ

49

Create.aspx

Page 50: Asp Net Mvc 基礎のキソ

50

Page 51: Asp Net Mvc 基礎のキソ

51

Page 52: Asp Net Mvc 基礎のキソ

52

Page 53: Asp Net Mvc 基礎のキソ

53

Edit.aspx (前半)

Page 54: Asp Net Mvc 基礎のキソ

54

Edit.aspx (後半)

Page 55: Asp Net Mvc 基礎のキソ

これで DB 連携の一連の操作は終わり

55

Page 56: Asp Net Mvc 基礎のキソ

最後に紹介する参考文献を読んでください :-P

リクエストがあれば続編をやります(または誰か立候補を!)◦ バリデーション

◦ TextBox 以外のビューへルパ(HTML 要素)

◦ ルーティングのカスタマイズ

◦ 認証

◦ AJAX 化

◦ ユニットテスト

◦ ・・・など、なかなか奥が深いです

56

Page 57: Asp Net Mvc 基礎のキソ

「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◦ 書籍のオンライン版がタダで読めます

「ASP.NET MVC 実践プログラミング」 (山田祥寛 著、秀和システム 刊、3200円)◦ 深いです

57

Page 58: Asp Net Mvc 基礎のキソ

58