ASP.NET MVC 4 ことはじめ（１）Hello World まで - アーキテクチャをスマートに。

ネットで情報収集をしていて、ASP.NET MVC 4 の情報があまりないな〜と思ったので、学習の記録を残すことにしました。
ASP.NET MVC の基本的な考え方を、Visual Studio 2012 で ASP.NET MVC 4 を使いながら習得できるようなチュートリアル的な内容を目指します。
基本的な考え方さえわかれば、あとはググッていけば何とかなるレベルだと思うし、ASP.NET MVC 3 の情報は多いので、基本的にはそれらの情報をベースに学習していけばよいと思います。*1

対象とする開発環境

Windows 7
IE 9
Visual Studio Express 2012 for Web (Update 2)

前提知識

Visual Studio と C# での開発経験
ASP.NET、Ruby on Rails、Java 等、なんらかの Web 開発の経験

まずは Hello World

Visual Studio 2012 を起動し、新規プロジェクトを作成します。テンプレート「ASP.NET MVC 4 Web アプリケーション」を選択します。
名前：HelloWorld1
場所：どこでもいいです

プロジェクトテンプレートは「基本」を選択します。

プロジェクトが作成されました。
で、この状態でいきなり F5 を押して実行してみると、、、
ビルドが正常終了し、IEが起動して自動的にトップURLにアクセスしてくれますが、なんとエラーが表示されます。

原因は、デフォルトのページコントローラがないためです。
ではIEを閉じて、デフォルトのページコントローラを作りましょう。
ソリューションエクスプローラにて、「Controllers」フォルダ上で右クリックし、[追加]→[コントローラ] を選択します。

コントローラ名は、「HomeController」にします。
この名前が重要です。ASP.NET MVC では"CoC"（設定より規約）の精神なので、ネーミングによって呼び出されるクラスが決定されます。（この辺の仕組み的なお話にも、もう少し後で触れます）
テンプレートは「空の MVC コントローラー」でいきましょう。

ひな形のソースコードが自動生成され、編集可能になります。ソースコードはとりあえずこのままでよいので、続いてビューの作成をします。

ビューについても、ネーミングルールによって呼び出されるクラスが決まってきます。HomeController に対するデフォルトのビューは、Views/Home/Index.cshtml となります。

というわけで、まずは「Views」フォルダの下に「Home」フォルダを作りましょう。
ソリューションエクスプローラにて、「Views」フォルダ上で右クリックし、[追加]→[新しいフォルダー] を選択します。

フォルダ名は「Home」にします。
続いて、「Home」フォルダ上で右クリックし、[追加]→[ビュー] を選択します。

ビュー名は「Index」にします。

これで Views/Home/Index.cshtml が作成されました。ここまでくれば、実行してもエラーになりません。F5 を押して実行してみて下さい。

ビューにデータを渡す

コントローラからビューにデータを渡すには、ViewData を使うのが最も簡単です。
ViewData は親クラスで定義されているメンバ変数で、Dictionary のようにキーと値でデータを受け渡しできます。

こんな感じです。

Controllers/HomeController.cs

namespace HelloWorld1.Controllers
{
    public class HomeController : Controller
    {
        //
        // GET: /Home/

        public ActionResult Index()
        {
            ViewData["msg"] = "Hello World !";
            return View();
        }
    }
}

Views/Home/Index.cshtml

@{
    ViewBag.Title = "Index";
}

<h2>Index</h2>

<p>
    @ViewData["msg"]
</p>

これで実行すれば、ブラウザに「Hello World !」と表示されます。

Razorビューエンジン

ビューのソースコードでは、Razor というビューエンジンを使うようになっています。これまでの <% 〜 %> を使ったコード埋め込みにとって変わる、"@" を使った新しい記法です。

Razor記法については、ネット上にすでに情報があるので詳しくはググッて下さい。*2

ちなみにビューエンジンは、Razor 以外にもいくつか使用可能なものがありますので、好みのものを選んでインストールすればRazorの代わりに使うことができます。（個人的には、Sparkが良さそうな気がしています。）参考:ASP.NET MVCの4つのビューエンジン

*1:ちなみに、ASP.NET MVC 3 の学習にあたっては、しばやんさんの「ASP.NET MVC 3 開発入門」とか @ITの記事がわかりやすかったです。

*2:この辺がわかりやすかったです。 http://www.atmarkit.co.jp/fdotnet/aspnetmvc3/aspnetmvc3_06/aspnetmvc3_06_01.html http://www.atmarkit.co.jp/fdotnet/scottgublog/20100714razor/razor.html