ASP.NET MVC 5 の概要

作成者 : Rick Anderson

Note

このチュートリアルの更新バージョンは、Visual Studio の最新バージョンを使用してこちらで入手できます。 新しいチュートリアルでは、MVC ASP.NET Core使用します。このチュートリアルでは、このチュートリアルに対して多くの機能強化が提供されます。

このチュートリアルでは、ASP.NET Core MVC のコントローラーとビューについて説明します。 Razor Pages は、ASP.NET Coreの新しい代替手段であり、Web UI の構築を容易かつ生産的にするページ ベースのプログラミング モデルです。 MVC バージョンの前に Razor Pages チュートリアルを試してみることをお勧めします。 この Razor ページのチュートリアルの特徴は次のとおりです。

  • 使いやすい。
  • 多くの機能をカバーしている。
  • 新しいアプリ開発に推奨されるアプローチです。

このチュートリアルでは、 Visual Studio 2017 を使用して ASP.NET MVC 5 Web アプリを構築する基本について説明します。 このチュートリアルの最終的なソース コードは GitHub にあります

このチュートリアルは、Scott Guthrie (twitter@scottgu)Scott Hanselman (twitter: @shanselman)、Rick Anderson ( @RickAndMSFT ) によって作成されました。

このアプリを Azure にデプロイするには、Azure アカウントが必要です。

  • Azure アカウントを無料で開くことができます。 有料の Azure サービスを試すために使用できるクレジットを受け取ります。使い切った後でも、アカウントを保持し、無料の Azure サービスを使用できます。
  • MSDN サブスクライバーの特典を有効にする こともできます - MSDN サブスクリプションにより、有料の Azure のサービスを使用できるクレジットが毎月与えられます。

はじめに

まず、 Visual Studio 2017 をインストールします。 次に、Visual Studio を開きます。

Visual Studio は IDE または統合開発環境です。 Microsoft Word を使用してドキュメントを作成するのと同様に、IDE を使用してアプリケーションを作成します。 Visual Studio の下部には、使用可能なさまざまなオプションを示す一覧があります。 IDE でタスクを実行する別の方法を提供するメニューもあります。 たとえば、[スタート] ページ[新しいプロジェクト] を選択する代わりに、メニュー バーを使用して [ファイル>] [新しいプロジェクト] の順に選択できます。

Visual Studio のスタート ページを示すスクリーンショット。新しいプロジェクトの作成は赤で囲まれています。

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

[ スタート] ページで、[ 新しいプロジェクト] を選択します。 [新しいプロジェクト] ダイアログ ボックスで、左側の [Visual C#] カテゴリ、[Web] の順に選択し、ASP.NET Web アプリケーション (.NET Framework) プロジェクト テンプレートを選択します。 プロジェクトに "MvcMovie" という名前を付け、[ OK] を選択します

[新しいプロジェクト] ウィンドウを示すスクリーンショット。Web および S P ドット NET Web アプリケーションドット NET Framework が選択されています。

[ 新しい ASP.NET Web アプリケーション ] ダイアログで、[ MVC ] を選択し、[ OK] を選択します

[New A S P dot NET Web Application]\(新しい A S P ドット NET Web アプリケーション\) ダイアログを示すスクリーンショット。M V C が選択されている。

Visual Studio では、先ほど作成した ASP.NET MVC プロジェクトに既定のテンプレートが使用されているため、何も行わずに、現在は動作するアプリケーションがあります。 これは単純な "Hello World!" プロジェクトであり、アプリケーションを開始するのに適した場所です。

[概要] ページに開いている M V C ムービー ウィンドウを示すスクリーンショット。

F5 キーを押してデバッグを開始します。 F5 キーを押すと、Visual Studio によってIIS Expressが開始され、Web アプリが実行されます。 その後、Visual Studio によってブラウザーが起動され、アプリケーションのホーム ページが開きます。 ブラウザーのアドレス バーには と表示 localhost:port# され、 のようなもの example.comではないことに注意してください。 これは、常に独自のローカル コンピューターを指しているため localhost です。この場合は、ビルドしたアプリケーションを実行しています。 Visual Studio で Web プロジェクトを実行すると、Web サーバーにランダムなポートが使用されます。 次の図では、ポート番号は 1234 です。 アプリケーションを実行すると、別のポート番号が表示されます。

A S P ドット NET ホーム ページを示すスクリーンショット。

すぐに使用できるこの既定のテンプレートでは、HomeContactおよび About ページが提供されます。 次の図は、[ ホーム]、[ バージョン情報]、[ 連絡先] の各リンクを示していません。 ブラウザー ウィンドウのサイズによっては、ナビゲーション アイコンをクリックしてこれらのリンクを表示する必要がある場合があります。

小さい表示ウィンドウの A S P ドット NET ホーム ページを示すスクリーンショット。ナビゲーション メニューを示す 3 行は赤で囲まれています。

アプリケーションでは、登録とログインのサポートも提供されます。 次の手順では、このアプリケーションの動作を変更し、ASP.NET MVC について少し学習します。 ASP.NET MVC アプリケーションを閉じて、いくつかのコードを変更してみましょう。

現在のチュートリアルの一覧については、「 MVC の推奨記事」を参照してください。