MVCフレームワーク-最初のアプリケーション

ビューとコントローラーを使用して、最初のMVCアプリケーションを作成してみましょう。基本的なMVCアプリケーションがどのように機能するかについての小さな実地体験ができたら、次の章ですべての個々のコンポーネントと概念を学習します。

最初のMVCアプリケーションを作成する

ステップ1 *-Visual Studioを起動し、[ファイル]→[新規]→[プロジェクト]を選択します。 Web→ASP.NET MVC Web Applicationを選択し、このプロジェクトに *FirstMVCApplicatio という名前を付けます。場所を C：\ MVC として選択します。 OKをクリックしてください。

Create MVC Project Step 1 Create MVC Project Step 2

ステップ2 *-これにより、[プロジェクトテンプレート]オプションが開きます。空のテンプレートを選択し、Razorとしてエンジンを表示します。 OKをクリックしてください。

MVCテンプレートの選択

これで、Visual Studioは次のスクリーンショットに示すように、最初のMVCプロジェクトを作成します。

MVCプロジェクトの構造

ステップ3 *-アプリケーションで最初のコントローラーを作成します。コントローラーは、アクションメソッドと呼ばれる複数のパブリックメソッドを含む単純なC＃クラスです。新しいコントローラーを追加するには、プロジェクトのControllersフォルダーを右クリックし、追加→コントローラーを選択します。 ControllerにHomeControllerという名前を付け、[追加]をクリックします。

MVCコントローラーの追加ホームコントローラーの作成

これにより、次のデフォルトコードでControllersフォルダーの下に HomeController.cs クラスファイルが作成されます。

using System;
using System.Web.Mvc;

namespace FirstMVCApplication.Controllers {

   public class HomeController : Controller {

      public ViewResult Index() {
         return View();
      }
   }
}

上記のコードは、基本的にHomeController内でパブリックメソッドIndexを定義し、ViewResultオブジェクトを返します。次の手順では、ViewResultオブジェクトを使用してビューを返す方法を学習します。

ステップ4 *-次に、新しいビューをHome Controllerに追加します。新しいビューを追加するには、ビューフォルダを右クリックして、追加→ビューをクリックします。

MVCビューの追加

ステップ5 *-新しいビューにインデックスとして、ビューエンジンにRazor（SCHTML）として名前を付けます。追加をクリックします。

インデックスビューの作成

これにより、Views/Homeフォルダ内に次のコードを含む新しい cshtml ファイルが追加されます-

@{
   Layout = null;
}

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

   <body>
      <div>

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

ステップ6 *-上記のビューのボディコンテンツを次のコードで変更します-

<body>
   <div>
      Welcome to My First MVC Application (<b>From Index View</b>)
   </div>
</body>

ステップ7 *-アプリケーションを実行します。これにより、ブラウザに次の出力が表示されます。この出力は、Viewファイルのコンテンツに基づいてレンダリングされます。アプリケーションは最初にControllerを呼び出し、ControllerはこのViewを呼び出して出力を生成します。

mvc_welcome_message

ステップ7で受け取った出力は、Viewファイルのコンテンツに基づいており、コントローラーとの対話はありませんでした。次にステップを進めて、ViewとControllerの対話を使用して、現在の時刻でWelcomeメッセージを表示する小さな例を作成します。

ステップ8 *-MVCはViewBagオブジェクトを使用して、コントローラーとビューの間でデータを渡します。 HomeController.csを開き、Index関数を次のコードに編集します。

public ViewResult Index() {
   int hour = DateTime.Now.Hour;

   ViewBag.Greeting =
   hour < 12
   ? "Good Morning. Time is" +  DateTime.Now.ToShortTimeString()
   : "Good Afternoon. Time is " + DateTime.Now.ToShortTimeString();

   return View();
}

上記のコードでは、ViewBagオブジェクトのGreeting属性の値を設定します。コードは現在の時間をチェックし、それに応じてreturn View（）ステートメントを使用しておはよう/午後のメッセージを返します。ここで、GreetingはViewBagオブジェクトで使用した属性の例にすぎないことに注意してください。 Greetingの代わりに他の属性名を使用できます。

ステップ9 *-Index.cshtmlを開き、本文セクションに次のコードをコピーします。

<body>
   <div>
      @ViewBag.Greeting (<b>From Index View</b>)
   </div>
</body>

上記のコードでは、＆commat;を使用してViewBagオブジェクトのGreeting属性の値にアクセスしています。（コントローラーから設定されます）。

ステップ10 *-アプリケーションを再度実行します。今回は、コードで最初にコントローラーを実行し、ViewBagを設定してから、Viewコードを使用してレンダリングします。出力は次のようになります。

MVCの例

Mvc-framework-first-application

MVCフレームワーク-最初のアプリケーション

最初のMVCアプリケーションを作成する