:::moniker range="aspnetcore-9.0"

This is the first tutorial of a series that teaches the basics of building an ASP.NET Core Razor Pages web app.

For a more advanced introduction aimed at developers who are familiar with controllers and views, see Introduction to Razor Pages. For a video introduction, see Entity Framework Core for Beginners.

[!INCLUDE Choose web UI]

At the end of this tutorial, you'll have a Razor Pages web app that manages a database of movies.

Prerequisites

Visual Studio

[!INCLUDE]

Visual Studio Code

[!INCLUDE]

Create a Razor Pages web app

Visual Studio

Start Visual Studio and select New project.
In the Create a new project dialog, select ASP.NET Core Web App (Razor Pages) > Next.
In the Configure your new project dialog, enter RazorPagesMovie for Project name. It's important to name the project RazorPagesMovie, including matching the capitalization, so the namespaces will match when you copy and paste example code.
Select Next.
In the Additional information dialog:
- Select .NET 9.0.
- Verify: Do not use top-level statements is unchecked.
Select Create.

The following starter project is created:

For alternative approaches to create the project, see Create a new project in Visual Studio.

Visual Studio Code

The tutorial assumes familiarity with VS Code. For more information, see Getting started with VS Code.

Select New Terminal from the Terminal menu to open the integrated terminal.
Change to the directory (cd) that will contain the project.
Run the following commands:
dotnetcli
```
dotnet new webapp -o RazorPagesMovie
code -r RazorPagesMovie
```
The dotnet new command creates a new Razor Pages project in the RazorPagesMovie folder.

The code command opens the RazorPagesMovie folder in the current instance of Visual Studio Code.

[!INCLUDE]

Run the app

Visual Studio

Select RazorPagesMovie in Solution Explorer, and then press <kbd>Ctrl</kbd>+<kbd>F5</kbd> to run the app without the debugger.

Visual Studio displays the following dialog when a project is not yet configured to use SSL:

Select Yes if you trust the IIS Express SSL certificate.

The following dialog is displayed:

Select Yes if you agree to trust the development certificate.

[!INCLUDEtrust FF]

Visual Studio:

Runs the app, which launches the Kestrel server.
Launches the default browser at https://localhost:<port>, which displays the apps UI. <port> is the random port that is assigned when the app was created.

Close the browser window.

Visual Studio Code

[!INCLUDE]

In Visual Studio Code, press <kbd>Ctrl</kbd>+<kbd>F5</kbd> to run the app without debugging.

At the Select debugger prompt, select C#.

At the Select Launch Configuration prompt, select C#: RazorPagesMovie [https] RazorPagesMovie.

The default browser launched with the following URL: https://localhost:<port> where <port> is the randomly generated port number.

Close the browser window.

In Visual Studio Code, from the Run menu, select Stop Debugging or press <kbd>Shift</kbd>+<kbd>F5</kbd> to stop the app.

Examine the project files

The following sections contain an overview of the main project folders and files that you'll work with in later tutorials.

Pages folder

Contains Razor pages and supporting files. Each Razor page is a pair of files:

A .cshtml file that has HTML markup with C# code using Razor syntax.
A .cshtml.cs file that has C# code that handles page events.

Supporting files have names that begin with an underscore. For example, the _Layout.cshtml file configures UI elements common to all pages. _Layout.cshtml sets up the navigation menu at the top of the page and the copyright notice at the bottom of the page. For more information, see xref:mvc/views/layout.

wwwroot folder

Contains static assets, like HTML files, JavaScript files, and CSS files. For more information, see xref:fundamentals/static-files.

`appsettings.json`

Contains configuration data, like connection strings. For more information, see xref:fundamentals/configuration/index.

Program.cs

Contains the following code:

[!code-csharp]

The following lines of code in this file create a WebApplicationBuilder with preconfigured defaults, add Razor Pages support to the Dependency Injection (DI) container, and builds the app:

[!code-csharp]

The developer exception page is enabled by default and provides helpful information on exceptions. Production apps should not be run in development mode because the developer exception page can leak sensitive information.

The following code sets the exception endpoint to /Error and enables HTTP Strict Transport Security Protocol (HSTS) when the app is not running in development mode:

[!code-csharp]

For example, the preceding code runs when the app is in production or test mode. For more information, see Use multiple environments in ASP.NET Core.

The following code enables various Middleware:

app.UseHttpsRedirection(); : Redirects HTTP requests to HTTPS.
app.UseRouting(); : Adds route matching to the middleware pipeline. For more information, see xref:fundamentals/routing.
app.UseAuthorization(); : Authorizes a user to access secure resources. This app doesn't use authorization, therefore this line could be removed.
app.MapRazorPages();: Configures endpoint routing for Razor Pages.
app.MapStaticAssets(); : Optimize the delivery of static assets in an app, such as HTML, CSS, images, and JavaScript. For more information, see xref:aspnetcore-9#optimizing-static-web-asset-delivery.
app.Run(); : Runs the app.

Troubleshooting with the completed sample

If you run into a problem you can't resolve, compare your code to the completed project. View or download completed project (how to download).

Next steps

[!div class="step-by-step"] Next: Add a model

:::moniker-end