ASP.NET Core MVC の概要

作成者: Rick Anderson

このチュートリアルでは、コントローラーとビューを使用した ASP.NET Core MVC の Web 開発について説明します。 ASP.NET Core の Web 開発の経験がない場合は、入門者向けであるこのチュートリアルの Razor Pages バージョンを検討してください。 UI 開発について Razor Pages、MVC、Blazor が比較されている、ASP.NET Core UI を選択する を参照してください。

これは、コントローラーとビューを使用した ASP.NET Core MVC Web 開発について説明するシリーズの最初のチュートリアルです。

シリーズの最後には、映画のデータを管理および表示できるアプリができあがります。 以下の方法について説明します。

  • Web アプリを作成する。
  • モデルを追加してスキャフォールディングする。
  • データベースを使用する。
  • 検索と検証を追加する。

サンプル コードを表示またはダウンロードします (ダウンロード方法)。

必須コンポーネント

Web アプリの作成

  • Visual Studio を開始し、 [新しいプロジェクトの作成] を選択します。
  • [新しいプロジェクトの作成] ダイアログで、 [ASP.NET Core Web アプリ (Model-View-Controller)] > [次へ] の順に選択します。
  • [新しいプロジェクトの構成] ダイアログで、 [プロジェクト名] に「MvcMovie」と入力します。 プロジェクトに MvcMovie という名前を付けることが重要です。 コードをコピーする際に、大文字と小文字の区別が各 namespace と一致する必要があります。
  • [次へ] を選択します。
  • [追加情報] ダイアログで、 [.NET 6.0 (プレビュー)] を選択します。
  • [作成] を選択します。

[追加情報] ダイアログ

プロジェクトを作成する別の方法については、「Visual Studio で新しいプロジェクトを作成する」をご覧ください。

Visual Studio により、作成した MVC プロジェクトに既定のプロジェクト テンプレートが使用されます。 作成したプロジェクトは:

  • 動作するアプリです。
  • 基本的なスターター プロジェクトです。

アプリを実行する

  • Ctrl + F5 キーを選択して、デバッガーなしでアプリを実行します。

    SSL を使用するようにプロジェクトがまだ構成されていない場合、Visual Studio に次のダイアログが表示されます。

    このプロジェクトは SSL を使用するように構成されています。 ブラウザーに SSL 警告を表示しないようにするために、IIS Express によって生成された自己署名証明書を信頼することを選択できます。 IIS Express SSL 証明書を信頼しますか。

    IIS Express SSL 証明書を信頼する場合、[はい] を選択します。

    次のダイアログが表示されます。

    セキュリティ警告のダイアログ

    開発証明書を信頼することに同意する場合は、 [はい] を選択します。

    Firefox ブラウザーを信頼する方法の詳細については、「Firefox SEC_ERROR_INADEQUATE_KEY_USAGE 証明書エラー」を参照してください。

Visual Studio によってアプリが実行され、既定のブラウザーが開かれます。

アドレス バーには、example.com などではなく、localhost:port# が表示されます。 ローカル コンピューターの標準的なホスト名は localhost です。 Visual Studio で Web プロジェクトが作成されるとき、Web サーバーにはランダムなポートが使用されます。

Ctrl + F5 キーを選択してデバッグなしでアプリを起動すると、次の操作を行えます。

  • コードを変更します。
  • ファイルを保存します。
  • ブラウザーをすぐに更新して、コードの変更を確認します。

[デバッグ] メニューから、デバッグ モードまたは非デバッグ モードでアプリを起動できます。

[デバッグ] メニュー

ツール バーの [MvcMovie] ボタンを選択して、アプリをデバッグできます。

[MvcMovie] デバッグ ボタン

次の図はアプリを示しています。

Home またはインデックス ページ

このシリーズの次のチュートリアルでは、MVC について説明し、コードの作成を開始します。

このチュートリアルでは、コントローラーとビューを使用した ASP.NET Core MVC の Web 開発について説明します。 ASP.NET Core の Web 開発の経験がない場合は、入門者向けであるこのチュートリアルの Razor Pages バージョンを検討してください。 UI 開発について Razor Pages、MVC、Blazor が比較されている、ASP.NET Core UI を選択する を参照してください。

これは、コントローラーとビューを使用した ASP.NET Core MVC Web 開発について説明するシリーズの最初のチュートリアルです。

シリーズの最後には、映画のデータを管理および表示できるアプリができあがります。 以下の方法について説明します。

  • Web アプリを作成する。
  • モデルを追加してスキャフォールディングする。
  • データベースを使用する。
  • 検索と検証を追加する。

サンプル コードを表示またはダウンロードします (ダウンロード方法)。

必須コンポーネント

Web アプリの作成

  • Visual Studio を開始し、 [新しいプロジェクトの作成] を選択します。
  • [新しいプロジェクトの作成] ダイアログで、 [ASP.NET Core Web アプリケーション] > [次へ] の順に選択します。
  • [新しいプロジェクトの構成] ダイアログで、 [プロジェクト名] に「MvcMovie」と入力します。 プロジェクトに MvcMovie という名前を付けることが重要です。 コードをコピーする際に、大文字と小文字の区別が各 namespace と一致する必要があります。
  • [作成] を選択します
  • [新しい ASP.NET Core Web アプリケーションの作成] ダイアログで、次のものを選択します。
    • ドロップダウンで [.NET Core][ASP.NET Core 5.0]
    • ASP.NET Core Web アプリ (Model-View-Controller)
    • Create

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

プロジェクトを作成する別の方法については、「Visual Studio で新しいプロジェクトを作成する」をご覧ください。

Visual Studio により、作成した MVC プロジェクトに既定のプロジェクト テンプレートが使用されました。 作成したプロジェクトは:

  • 動作するアプリです。
  • 基本的なスターター プロジェクトです。

アプリを実行する

  • Ctrl + F5 キーを選択して、デバッガーなしでアプリを実行します。

    SSL を使用するようにプロジェクトがまだ構成されていない場合、Visual Studio に次のダイアログが表示されます。

    このプロジェクトは SSL を使用するように構成されています。 ブラウザーに SSL 警告を表示しないようにするために、IIS Express によって生成された自己署名証明書を信頼することを選択できます。 IIS Express SSL 証明書を信頼しますか。

    IIS Express SSL 証明書を信頼する場合、[はい] を選択します。

    次のダイアログが表示されます。

    セキュリティ警告のダイアログ

    開発証明書を信頼することに同意する場合は、 [はい] を選択します。

    Firefox ブラウザーを信頼する方法の詳細については、「Firefox SEC_ERROR_INADEQUATE_KEY_USAGE 証明書エラー」を参照してください。

    Visual Studio:

    • IIS Express を起動します。
    • アプリを実行します。

    アドレス バーには、example.com などではなく、localhost:port# が表示されます。 ローカル コンピューターの標準的なホスト名は localhost です。 Visual Studio で Web プロジェクトが作成されるとき、Web サーバーにはランダムなポートが使用されます。

Ctrl + F5 キーを選択してデバッグなしでアプリを起動すると、次の操作を行えます。

  • コードを変更します。
  • ファイルを保存します。
  • ブラウザーをすぐに更新して、コードの変更を確認します。

[デバッグ] メニュー項目から、デバッグ モードまたは非デバッグ モードでアプリを起動できます。

[デバッグ] メニュー

[IIS Express] ボタンを選択することで、アプリをデバッグできます。

IIS Express

次の図はアプリを示しています。

Home またはインデックス ページ

このチュートリアルの次のパートでは、MVC について説明し、コードの作成を開始します。

このチュートリアルでは、コントローラーとビューを使用した ASP.NET Core MVC の Web 開発について説明します。 ASP.NET Core の Web 開発の経験がない場合は、入門者向けであるこのチュートリアルの Razor Pages バージョンを検討してください。 UI 開発について Razor Pages、MVC、Blazor が比較されている、ASP.NET Core UI を選択する を参照してください。

これは、コントローラーとビューを使用した ASP.NET Core MVC Web 開発について説明するシリーズの最初のチュートリアルです。

シリーズの最後には、映画のデータを管理および表示できるアプリができあがります。 以下の方法について説明します。

  • Web アプリを作成する。
  • モデルを追加してスキャフォールディングする。
  • データベースを使用する。
  • 検索と検証を追加する。

サンプル コードを表示またはダウンロードします (ダウンロード方法)。

必須コンポーネント

Web アプリの作成

  • Visual Studio から [新しいプロジェクトの作成] を選択します。

  • [ASP.NET Core Web アプリケーション] > [次へ] の順に選択します。

    新しい ASP.NET Core Web アプリケーション プロジェクトを作成します

  • プロジェクトに MvcMovie という名前を付けて、 [作成] を選択します。 コードをコピーするときに名前空間が一致するように、プロジェクトに MvcMovie と名前を付けることが重要です。

    新しいプロジェクトを構成する

  • [Web アプリケーション (モデル ビュー コントローラー)] を選択します。 ドロップダウン ボックスから [.NET Core][ASP.NET Core 3.1] を選択した後、 [作成] を選択します。

    [新しいプロジェクト] ダイアログ、左ウィンドウの .NET Core、ASP.NET Core Web

Visual Studio により、作成した MVC プロジェクトに既定のプロジェクト テンプレートが使用されました。 作成したプロジェクトは:

  • 動作するアプリです。
  • 基本的なスターター プロジェクトです。

アプリを実行する

  • Ctrl + F5 キーを選択して、デバッグなしでアプリを実行します。

    SSL を使用するようにプロジェクトがまだ構成されていない場合、Visual Studio に次のダイアログが表示されます。

    このプロジェクトは SSL を使用するように構成されています。 ブラウザーに SSL 警告を表示しないようにするために、IIS Express によって生成された自己署名証明書を信頼することを選択できます。 IIS Express SSL 証明書を信頼しますか。

    IIS Express SSL 証明書を信頼する場合、[はい] を選択します。

    次のダイアログが表示されます。

    セキュリティ警告のダイアログ

    開発証明書を信頼することに同意する場合は、 [はい] を選択します。

    Firefox ブラウザーを信頼する方法の詳細については、「Firefox SEC_ERROR_INADEQUATE_KEY_USAGE 証明書エラー」を参照してください。

    Visual Studio:

    • IIS Express を起動します。
    • アプリを実行します。

    アドレス バーには、example.com などではなく、localhost:port# が表示されます。 ローカル コンピューターの標準的なホスト名は localhost です。 Visual Studio で Web プロジェクトが作成されるとき、Web サーバーにはランダムなポートが使用されます。

Ctrl + F5 キーを選択してデバッグなしでアプリを起動すると、次の操作を行えます。

  • コードを変更します。
  • ファイルを保存します。
  • ブラウザーをすぐに更新して、コードの変更を確認します。

[デバッグ] メニュー項目から、デバッグ モードまたは非デバッグ モードでアプリを起動できます。

[デバッグ] メニュー

[IIS Express] ボタンを選択することで、アプリをデバッグできます。

IIS Express

次の図はアプリを示しています。

Home またはインデックス ページ

このチュートリアルの次のパートでは、MVC について説明し、コードの作成を開始します。