Introduction to Razor Pages

Overview

• Presenter: Yannick
• Topic: Introduction to Razor Pages in ASP.NET Core
• Target Audience: Beginners and those familiar with ASP.NET Core MVC

Setting Up Razor Pages

• Open Visual Studio and search for ASP.NET Core templates.
• Select ASP.NET Core Web App template (includes Razor Pages).
• Discussed other templates: Empty, MVC (with Views, Models, Controllers).

Creating a New Application

• Steps to create a new application from scratch:
  1. Choose project name (e.g., tutorial2you)
  2. Select .NET 7
  3. No authentication needed.
  4. Create the app.

Project Structure

• Program.cs: Contains application configuration (service container, etc.)
  • Registers Razor Pages.
• appsettings.json: Configuration settings.
• Pages Folder: Contains Page Models (no MVC structure).

Index.cshtml

• Contains Razor syntax and attributes:
  • @page decorator indicates a Razor Page.
  • Binds a model (e.g., IndexModel).

Index.cshtml.cs (Code Behind)

• Inherits from PageModel.
• MVC functionalities available (e.g., BadRequest, LocalRedirect).
• Constructor for dependency injection.

HTTP Request Methods

• OnGet: Executes on GET request to the page URL (e.g., /).
• OnPost: Executes on POST request to the page URL.

Creating a Person Model

• Create a Models folder.
• Add a class Person with properties:
  • int ID
  • string Name
  • int Age
• ID for unique identification (best practice).

Adding a New Razor Page

• Right-click on Pages folder, add a new Razor Page called People.
• Create a corresponding PeopleModel class.
• Automatically provides OnGet method.

Navigation and Layout

• Update layout.cshtml for navigation to the new People page.
• Add link to the People page in the navigation bar.

Adding Functionality

• Entity Framework Core (EF Core) for in-memory database:
  • Install EF Core and EF Core In-Memory packages.
• Create a DbContext class for database context.
  • Define a property for the People table.
• Register the DbContext in Program.cs.

Implementing the People Model

• Create a list of people to display on the page.
• Utilize dependency injection to access the DbContext.
• Implement OnGet method to retrieve people from the database.

Creating Forms for Data Entry

• Create a form in People.cshtml to add new people.
• Bind form inputs to the Person properties using Razor syntax.
• Use OnPost method to handle form submission and add new person to the database.
• Ensure to save changes to the context after adding.

Displaying the List of People

• Use a table to display the list of people.
• Implement a foreach loop in Razor to iterate over people and populate table rows.
• Test adding new entries.

Conclusion

• Summary of what was learned:
  • Basics of Razor Pages, creating a simple application, using Entity Framework for data management.
• Encouraged viewers to check out further training and subscribe for more content.