【ASP】【C#】ASP.NET MVC 2 ~ Hello World的なアプリ作成 ~

作成方法

 [1] Visual Web Developer(VWD) 2010 Express を起動
 [2] [ファイル]-[新しいプロジェクト]-[ASP.NET MVC 2 Web アプリケーション]を選択
   (画面左側のインストールされているテンプレート欄には[Visual C#]-[Web]が選択されている)

アプリ作成・準備

SQL Serverへの接続

 [1] [表示]-[その他のウィンドウ]-[データベース エクスプローラー]を選択し、
    「ソリューション エクスプローラー」配下の「データベース エクスプローラー」タブを表示
 [2] 「データベース エクスプローラー」の「データの接続」を右クリックし、「接続の追加」を選択
 [3] 「接続の追加」で、以下を入力し、「OK」押下
  ・サーバー名:「localhost\SQLEXPRESS」
  ・データベース名の選択または入力:例「SampleDB」
 => 「データベース'SampleDB'が存在しないか、表示するのに必要なアクセス許可がありません。作成しますか?」] 
     が表示されたら、「はい」を選択

テーブルの作成

 [1] 「データベース エクスプローラー」の「テーブル」を右クリックし、「新しいテーブルの追加」を選択
 [2] 好みのテーブルを作成する(以下、サンプルを参照のこと)
 [3] 手順[2]後、保存し、テーブル名を入力する(例「Person」。以下、サンプルを参照のこと)

サンプル

【例:Personテーブル】
 * Id int型
   + 主キーに設定
   + Null許容:チェック外す
   + IDENTITYの指定で「(Is Identity):はい」「IDENTITYインクリメント:1」
 * Name nvarchar(50)
 * Address nvarchar(50)
 * Email nvarchar(50)
 * Age int型

アプリ作成(Model/Controller/Viewの作成)

【1】Model作成

Modelの自動生成の手順

 [1] 「ソリューション エクスプローラー」の「Models」を右クリックし、[追加]-[新しい項目]を選択
 [2] 「新しい項目の追加」において、[データ]-[ADO.NET Entity Data Model]を選択し、
      名前には任意のファイルを入力し(例「Persons.edmx」)「追加」押下
 [3] [データベースから生成]を選択
 [4] 該当するデータベースを選択し、エンティティ文字列(接続に使う下の欄の名前)を入力し
     (例「SampleDBEntities」)、「次へ」押下
 [5] 該当するテーブルを選択し、「完了」押下
 →複雑なデータを処理する場合は自動生成が最適とは言えないらしい。。。

補足:データベースが更新された場合

 * 該当するモデルを右クリックし、[データベースからモデルを更新]を選択
 → 上記を行うと、Modelのファイルが更新される

【2】Controller作成

Controller作成手順

 [1] 「ソリューション エクスプローラー」の「Controllers」を右クリックし、[追加]-[コントローラ]を選択
 [2] 「コントローラの追加」ダイアログにおいて、名前には任意のコントローラ名を入力し
     (例「PersonsController」)「追加」押下
 →「PersonsController.cs」が自動生成される
 [3] 下記サンプルを参考に、コードを記述

サンプル

private SampleDBEntities dataBase = new SampleDBEntities(); // 追加

public ActionResult Index()
{
    return View(dataBase.Person.ToList());
}

public ActionResult Create()
{
    return View();
}

[HttpPost]
[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Create([Bind(Exclude = "Id")] Models.Person personToCreate)
{
    if (!ModelState.IsValid)
    {
        return View();
    }
    dataBase.AddToPerson(personToCreate);
    dataBase.SaveChanges();
    return RedirectToAction("Index");
}

public ActionResult Edit(int id)
{
    var edittedPerson = (
        from p in dataBase.Person
        where p.Id == id
        select p).First();
    return View(edittedPerson);
}

[AcceptVerbs(HttpVerbs.Post)]
public ActionResult Edit(Models.Person person)
{
    var edittedPerson = (
        from p in dataBase.Person
        where p.Id == person.Id
        select p).First();

    if (!ModelState.IsValid)
    {
        return View(edittedPerson); 
    }
    UpdateModel(edittedPerson);
    dataBase.SaveChanges();
    return RedirectToAction("Index");
}

public ActionResult Delete(int id)
{
    var personToDelete = (from p in dataBase.Person where p.Id == id select p).First();
    return View(personToDelete);
}

[HttpPost]
public ActionResult Delete(Models.Person person)
{
    var personToDelete = (from p in dataBase.Person where p.Id == person.Id select p).First();
    dataBase.DeleteObject(personToDelete);
    dataBase.SaveChanges();
    return RedirectToAction("Index");
}

public ActionResult Details(int id)
{
    var personForDetails = (from p in dataBase.Person where p.Id == id select p).First();
    return View(personForDetails);
}

【3】View作成

ControllerからViewを作成する手順(Index編)

 [1] ControllerのソースコードのIndex()を右クリックし、[ビューの追加]を選択
 [2] 「ビューの追加」ダイアログにおいて、以下を入力し、「追加」押下
  * ビュー名:「Index」
  * 「厳密に型指定されたビューを作成する」:チェックを入れる
  * ビュー データ クラス:「MvcSample.Models.Person」
  * ビュー コンテンツ:「List」
 →[Views]-[Person]の下に、「Index.aspx」が自動作成されていることを確認できる

ControllerからViewを作成する手順(Create/Edit/Delete/Detail編)

 [1] ControllerのソースコードのCreate()を右クリックし、[ビューの追加]を選択
 [2] 「ビューの追加」ダイアログにおいて、以下を入力し、「追加」押下
  * ビュー名:「Create」(Edit/Delete/Detail)
  * 「厳密に型指定されたビューを作成する」:チェックを入れる
  * ビュー データ クラス:「MvcSample.Models.Person」
  * ビュー コンテンツ:「Create」(Edit/Delete/Detail)
 →[Views]-[Person]の下に、「Create.aspx」(Edit/Delete/Detail)が自動作成されていることを確認できる

Global.asaxについて

 * ルーティングを設定するファイル
 * 以下「サンプル」のように、Controllerの部分を「Home(デフォルト)」→「Persons」のように指定すると、
  「http://localhost:XXXX/(XXXX:ポート番号)」へのアクセスは、
  「http://localhost:XXXX/Persons/Index」にルーティングされる

サンプル

・・・略・・・
routes.MapRoute(
    "Default", // ルート名
    "{controller}/{action}/{id}", // パラメーター付きの URL
    new { controller = "Persons", action = "Index", id = UrlParameter.Optional } // パラメーターの既定値
);
・・・略・・・

参考文献

http://www.atmarkit.co.jp/fdotnet/dotnettips/1031aspmvcrouting1/aspmvcrouting1.html

関連記事

VBASP.NET MVC 5 ~ Hello World的なアプリ作成 ~

http://blogs.yahoo.co.jp/dk521123/25390191.html