ASP.NET MVC（C#）でHelloWorldする手順

＜目次＞

(１) ASP.NET MVC（C#）でHelloWorldする手順
　 (１-１) プロジェクトの作成
　 (１-２) Controller（コントローラー）の作成
　 (１-３) Veiw（ビュー）の作成
　 (１-４) ソリューションのビルド＆疎通チェック

(１) ASP.NET MVC（C#）でHelloWorldする手順

今回はASP.NETのサブフレームワークである「ASP.NET MVC」のプロジェクトを作成し、HelloWorldを表示するまでの手順をご紹介します。

「ASP.NET MVC」の概要や「MVC方式」について知りたい方は下記も併せてご参照ください。

⇒（参考）C# ASP.NET MVC 入門

(１-１) プロジェクトの作成

①新しいプロジェクトの作成

Visual Studioを開いて「新しいプロジェクトの作成」を選択します。

（図１１１）

②テンプレートの選択

「ASP.NET Web アプリケーション（.NET Framework）」を選択します。

（図１１２）

③名前の入力

プロジェクト名やソリューション名等を入力して「作成」を押下します。

（図１１３）

④新しいASP.NET Webアプリケーションを作成

今回はゼロベースから学ぶ目的で「テンプレート」は「空」を選択します。

また「フォルダおよびコア参照を追加する」で「MVC」を選択します。これによりMVCのフォルダ構成や空のファイルなどの構造を事前に用意した状態でプロジェクトを作成する事ができます。

（図１１４）

（参考）

今回テンプレートは「空」を選びましたが、テンプレートを使う事でASP.NETのサブフレームワークである「Webフォーム」や「ASP.NET MVC」や「ASP.NET Web API」等を手軽に導入する事ができます。例えばMVCを選択すると「フォルダおよびコア参照を追加する」のMVCにも自動で✔が入り、MVCのデフォルトWebサイトが実装された状態で利用出来るようになります。

⑤プロジェクトの構造

作成直後は次のようになっています。MVCを選択したので、ModelsやViewsやControllerを格納するためのフォルダが事前に作成されています。

（図１１５）

そして各フォルダを展開していくと、例えばRouteConfig.csといったMVCの構築に必要な雛形ファイルが事前に作成されています（RouteConfig.csはルーティング、すなわちURLに応じて処理の振り分け先を決定する処理を担うC#プログラムです）。

（図１１６）

＞目次にもどる

(１-２) Controller（コントローラー）の作成

Controllerの作成手順です。

①コントローラーの追加

ソリューションエクスプローラーから「Controller」のフォルダを「右クリック」⇒「追加」⇒「コントローラー」と選択します。

（図１２１）

②新規スキャフォールディングアイテムの追加

「スキャフォールディング」という単語は英語でScaffold＝足場という意味ですが、具体的には「ASP.NET」のウェブアプリケーションを作るための、自動コード生成のフレームワークです。スキャフォールディングを使う事で、ViewやControllerなどのMVCの部品を作る手間を削減する事ができます。そしてT4テンプレートを使って、独自のカスタムスキャフォールディングのテンプレートを作る事も可能です。

今回は練習のため「MVC 5 コントローラー – 空」を選択します。

（図１２２）

③コントローラーの名前を入力

コントローラーの名前を入力して「追加」を押下します。

（図１２３）

追加が完了すると、次のようにデフォルトのコードが記述されたControllerが作成されます。

（雛形）

using System;
using System.Collections.Generic;
using System.Linq;
using System.Web;
using System.Web.Mvc;

namespace MVCtest.Controllers
{
    public class HomeController : Controller
    {
        // GET: Home
        public ActionResult Index()
        {
            return View();
        }
    }
}

（図１２４）

（参考①）

「Controller」クラスは「ControllerBase」クラスを継承しています。上の雛形の「Controller」の部分を右クリックして「定義へ移動」を選択すると、継承している元のクラスを見る事ができます。

（図１２５）

（図１２６）

（参考②）

Viewが無い状態でIIS Expressで実行すると、次のようにControllerのメソッド名（例では「Index」）の名前のViewを作成するように要求されます。

（エラーメッセージ）

'/' アプリケーションでサーバエラーが発生しました。

（図１２７）

＞目次にもどる

(１-３) Veiw（ビュー）の作成

①ビューの追加

ソリューションエクスプローラーで「Views」のフォルダを「右クリック」⇒「追加」⇒「新しい項目」を選択します。

（図１３１）

②新しい項目の追加

左ペインから「Visual C#」⇒「Web」と辿り、中央の選択肢から「MVC5 ビューページ（Razor）」を選択し、「追加」を押下します。

（図１３２）

追加が完了すると、次のようなViewの雛形が作成されます。

（雛形）

@{
    Layout = null;
}

<!DOCTYPE html>

<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title></title>
</head>
<body>
    <div>

    </div>
</body>
</html>

（図１３３）