ソースコードから理解する技術-UnderSourceCode

手を動かす(プログラムを組む)ことで技術を理解するブログ

ASP.NET MVC 2 - My MVC Applicationの実装ポイント(2)

前回の手順で新たにASP.NET MVC のプロジェクトを作成すると
テンプレートとしてMy MVC Applicationが自動生成されます。

このMy MVC Application を元に、別のアプリケーションを実装してみます。
実装するのはウィスキーの試飲会を予約するシステムとします。

まずはトップページを改修し、以下のようなページとします。
f:id:UnderSourceCode:20130504135945j:plain

次にトップページの「こちら」リンクをクリックすると表示される
試飲会の一覧を表示する以下の画面を、新規に作成します。
f:id:UnderSourceCode:20130504111856j:plain

以下、今回の実装ポイントです。

Site.css
このスタイルシートで、アプリケーション全体のスタイルを管理している。

・背景を黒くする
f:id:UnderSourceCode:20130504111909j:plain

・試飲会一覧のテーブルのヘッダーをセンタリングする。
f:id:UnderSourceCode:20130504111931j:plain

Site.Master
全ページのベースとなるページ。

・タイトルを変更する
f:id:UnderSourceCode:20130504111942j:plain

Controllerありきの開発スタイル
Controllerにactionを作成し、そこから対応するViewを作成する。
下記は(Modelと)Controller → View と作成した例。

1. 試飲会のModellの設計、作成(つまりデータ設計)
f:id:UnderSourceCode:20130504111953j:plain

2. 試飲会の一覧を表示するControllerを作成
f:id:UnderSourceCode:20130504112013j:plain

3. 一度実行後、ContollerよりViewを作成
f:id:UnderSourceCode:20130504112026j:plain