Razor Web アプリの作成Create Razor web apps

このガイドでは、最初の Razor Web アプリの作成に関する概要について説明します。This guide offers an introduction to creating your first Razor web app. 詳しいガイダンスが必要であれば、「ASP.NET Core での Razor ページの概要」を参照してください。For more in-depth guidance, see Introduction to Razor Pages in ASP.NET Core.

Visual Studio for Mac には、 .cshtml ファイルでの IntelliSense や構文の強調表示など、Razor 編集のサポートが用意されています。Visual Studio for Mac provides support for Razor editing, including IntelliSense and syntax highlighting in .cshtml files. Visual Studio 2019 for Mac 8.3+ の新機能として、Razor ファイル内で IntelliSense がコンテキストを認識できるようになりました。ドキュメント内で現在編集中の言語に一致する IntelliSense が表示されます。New in Visual Studio 2019 for Mac 8.3+ is the ability to have context aware IntelliSense within a Razor file, so that you receive IntelliSense that matches the language you are currently editing within a document.

Visual Studio for Mac での Razor 編集

新しい Razor プロジェクトの作成Creating a new Razor project

  1. ようこそ画面で、 [新規] を選択して新しいプロジェクトを作成します。On the welcome screen, select New to create a new project:

    Visual Studio for Mac での新しいプロジェクト

  2. [新しいプロジェクト] ダイアログ ボックスで、 [.NET Core][アプリ][Web アプリケーション] の順に移動し、 [次へ] ボタンをクリックします。In the New Project dialog box, go to .NET Core > App > Web Application and select Next:

    Razor プロジェクト テンプレート

  3. お使いの .NET Core ターゲット フレームワークを選択し (バージョン 2.2 以降推奨)、 [次へ] を選択します。Select your .NET Core target framework (we recommend version 2.2 or later), and then select Next. 自分のプロジェクトの名前を選択し、必要に応じて Git サポートを追加します。Choose a name for your project, and add Git support if necessary. [作成] を選択して、プロジェクトを作成します。Select Create to create the project.

    Razor プロジェクト名

    Visual Studio for Mac により、お客様のプロジェクトがコード レイアウト ウィンドウで開かれます。Visual Studio for Mac opens your project in the Code layout window.

  4. Command + Option + F5 キーを使用し、デバッグなしでプロジェクトを実行します。Run the project without debugging by using Command+Option+F5.

    Visual Studio で Kestrel が起動し、ブラウザーが開いて https://localhost:5001 にアクセスし、初めての Razor Web アプリが表示されます。Visual Studio starts Kestrel, opens a browser to https://localhost:5001, and displays your first Razor web app.

    Safari での Razor Web アプリ

プロジェクトの構造Project anatomy

Razor Web アプリには次の構成要素が含まれています。Razor web apps include the following components.

Pages フォルダーPages folder

このフォルダーには、プロジェクトの Web ページと各ページのコードビハインドが含まれています。This folder contains a project's webpages, along with the code-behind for each:

  • HTML マークアップと Razor 構文のための " *.cshtml" ファイル。A *.cshtml file for the HTML markup and Razor syntax.
  • ページ イベントを処理するための C# コードビハインドの " *.cshtml.cs" ファイル。A *.cshtml.cs file for your C# code-behind for handling page events.

サポート ファイルには、アンダー スコアで始まる名前が付けられます。Supporting files have names that begin with an underscore. たとえば、 _Layout.cshtml ファイルでは、すべてのページに共通の UI 要素が構成されます。For example, the _Layout.cshtml file configures UI elements common to all pages. このファイルでは、ページの上部に表示されるナビゲーション メニューと下部に表示される著作権の通知が設定されます。This file sets up the navigation menu at the top of the page and the copyright notice at the bottom. 詳細については、「ASP.NET Core でのレイアウト」をご覧ください。For more information, see Layout in ASP.NET Core.

起動設定Launch settings

launchSettings.json ファイルには、IIS 設定、アプリケーションの URL、その他の関連する設定が含まれています。The launchSettings.json file contains the IIS settings, the application URL, and other related settings.

アプリの設定App settings

appSettings.json ファイルには、接続文字列などの構成データが含まれています。The appSettings.json file contains configuration data such as connection strings.

構成について詳しくは、ASP.NET での構成ガイドに関する記事をご覧ください。For more information about configuration, see the Configuration in ASP.NET guide.

wwwroot フォルダーwwwroot folder

このフォルダーには、HTML ファイル、JavaScript ファイル、CSS ファイルなど、静的ファイルが含まれています。This folder contains static files, such as HTML, JavaScript, and CSS files. 詳細については、「ASP.NET Core の静的ファイル」をご覧ください。For more information, see Static files in ASP.NET Core.

Program.csProgram.cs

このファイルには、プログラムのエントリ ポイントが含まれています。This file contains the entry point for the program. 詳細については、「ASP.NET Core の Web ホスト」をご覧ください。For more information, see ASP.NET Core Web Host.

Startup.csStartup.cs

このファイルには、cookie に対する同意をアプリで要求するかなど、アプリの動作を構成するコードが含まれています。This file contains code that configures app behavior, such as whether the app requires consent for cookies. 詳細については、「ASP.NET Core でのアプリケーションのスタートアップ」をご覧ください。For more information, see App startup in ASP.NET Core.

関連項目See also

Razor Web アプリの作成に関するより包括的なガイドについては、「ASP.NET Core での Razor ページの概要」をご覧ください。For a more comprehensive guide to creating Razor web apps, see Introduction to Razor Pages in ASP.NET Core.