How To Create Razor Pages In ASP.NET Core 6.0

Introduction

In this article, I am going to explain to you, what are Razor pages. And how to create Razor Pages in ASP.NET Core 6.0 application step by step.

What are Razor Pages?

Razor pages are introduced in ASP.NET Core 2.0. Razor pages are simple and introduce a page-focused framework that is used to create cross-platform, data-driven, server-side web pages with clean separation of concerns. In MVC we have Model, View, and Controllers folder but in Razor pages, we have only Pages Folder.

But Razor Page is only for small applications where you have to mainly focus on View. If you make any changes, then you have to manipulate your Razor Page [.cshtml]. Server-side logic can be written on the Razor Page.

Prerequisites

1. Install Visual Studio 2022 updated version 17.0 or later.
2. Install .NET SDK 6.0

Now let's start creating Razor Pages in the ASP.NET Core 6.0 web application.

Step 1. Install Visual Studio

First, install Visual Studio 2022 in your system.

Step 2. Open Visual Studio.

Open Visual Studio 2022.

Step 3. Then click on Continue Without Code as shown in the following image.

Step 4. Then from the Visual Studio Menu, click on File -> New-> Project, as shown in the following image.

Click on the New Project, then the following window appears as shown in step 5.

Step 5. Choose Project Template.

You can see various project template types, choose the ASP.NET Core Web App This project template creates the web app, as shown in the following image.

.

After choosing the project template click on Next.

Step 6. Define Project Name and Location.

In the project configuration window, you will see the following options.

• Project Name: Define any name for your project as per your choice. Here I have chosen the project name as “WebAppDemo4”.
• Location: Choose the location to save the project files on your hard drive of the system. I have chosen the Project/VS folder of the E drive of the system.
• Solution Name: The solution name is auto-defined based on the project name, but you can change the name based on your own choice. But I have not changed my solution name. Solution name and project name both are same.

Additionally, there is a checkbox, if you have checked it, then the solution file (.Soln) and project files will be saved in the same folder. As shown in the following image.

After defining the required details, click on Next.

Step 7. Choose the Target Framework

Choose the target framework .NET 6.0 (Long-term support) which is the latest as shown in the following image.

After providing the required details, click the Create button. It will create the Razor pages in ASP.NET Core 6.0 web application as shown in step 8.

Step 8. Razor Pages In ASP.NET Core 6.0 Folder Structure

The following is the default folder structure of the Razor Pages In ASP.NET Core 6.0 application.

Step 9. Razor Pages Are Enabled In the Program.cs

Razor Pages is enabled in the program. cs.

• AddRaorPages adds services for Razor Pages to the application.
• MapRazorPages adds endpoints for Razor Pages to the IEndpointRouteBuilder.

As shown in the below image.

Step 10. Run the Razor Pages In ASP.NET Core 6.0 Application.

You can build and run the application with default contents or let open the Index.cshtml file and put some contents there. Here I have some changes to the index page.

Now press F5 on the keyboard or use the run option from Visual Studio to run the application in the browser. After running the application, it will show in the browser as shown in the following image.

The above output comes from the Index.cshtml page under the Pages folder.

Every Razor page has a @Page directive which indicates that this is not a normal MVC Razor View but it is a Razor Page.

I hope you have learned how to create the Razor Pages in ASP.NET Core 6.0 Web Application.

Conclusion

In this article, we explained how to create Razor Pages in ASP.NET Core 6.0 application. I hope this article is useful to understand.