Skip to content
Merged
Show file tree
Hide file tree
Changes from 7 commits
Commits
File filter

Filter by extension

Filter by extension

Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
5 changes: 5 additions & 0 deletions .openpublishing.redirection.json
Original file line number Diff line number Diff line change
Expand Up @@ -1567,6 +1567,11 @@
"source_path": "aspnetcore/blazor/progressive-web-app.md",
"redirect_url": "/aspnet/core/blazor/progressive-web-app/",
"redirect_document_id": false
},
{
"source_path": "aspnetcore/getting-started/index.md",
"redirect_url": "/aspnet/core/get-started",
"redirect_document_id": false
}
]
}
1 change: 0 additions & 1 deletion aspnetcore/data/ef-rp/intro.md
Original file line number Diff line number Diff line change
Expand Up @@ -8,7 +8,6 @@ ms.custom: "mvc"
ms.date: 04/23/2025
uid: data/ef-rp/intro
---

# Razor Pages with Entity Framework Core in ASP.NET Core - Tutorial 1 of 8

[!INCLUDE[](~/includes/not-latest-version.md)]
Expand Down
4 changes: 2 additions & 2 deletions aspnetcore/fundamentals/servers/yarp/direct-forwarding.md
Original file line number Diff line number Diff line change
Expand Up @@ -39,9 +39,9 @@ See [ReverseProxy.Direct.Sample](https://github.com/microsoft/reverse-proxy/tree

### Create a new project

Follow the [Getting Started](xref:getting-started) guide to create a project and add the Yarp.ReverseProxy nuget dependency.
Create a Razor Pages project from the project template and add the [`Yarp.ReverseProxy` NuGet package](https://www.nuget.org/packages/Yarp.ReverseProxy).

### Update Program.cs
### Update `Program.cs`

In this example the IHttpForwarder is registered in DI, injected into the endpoint method, and used to forward requests from a specific route to `https://localhost:10000/prefix/`.

Expand Down
152 changes: 152 additions & 0 deletions aspnetcore/get-started.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,152 @@
---
title: Get started with ASP.NET Core
author: tdykstra
description: A short tutorial using the .NET CLI to create and run a basic Hello World app using ASP.NET Core Blazor.
monikerRange: ">= aspnetcore-3.1"
ms.author: tdykstra
ms.custom: mvc
ms.date: 07/21/2025
uid: get-started
---
# Get started with ASP.NET Core

[!INCLUDE[](~/includes/not-latest-version.md)]

This tutorial shows how to create, run, and modify an ASP.NET Core Blazor Web App using the .NET CLI.

You'll learn how to:

> [!div class="checklist"]
> * Create a Blazor Web App.
> * Run the app.
> * Change the app.
> * Shut the app down.
At the end, you'll have a working web app running on your local machine.

## Prerequisites

Obtain and install the latest .NET SDK at [Download .NET](https://dotnet.microsoft.com/download/dotnet).

## Create a web app project

Open a command shell to a suitable location for the sample app and use the following command to create a Blazor Web App. The `-o|--output` option creates a folder for the project and names the project `BlazorSample`:

```dotnetcli
dotnet new blazor -o BlazorSample
```

## Run the app

Change the directory to the `BlazorSample` folder with the following command:

```dotnetcli
cd BlazorSample
```

The `dotnet watch` command runs the app and opens your default browser to the app's landing page:

```dotnetcli
dotnet watch
```

Using the app's sidebar navigation, visit the Counter page, where you can select the **:::no-loc text="Click me":::** button to increment the counter.

## Edit a Razor component

Leave the browser open with the Counter page loaded. By using the `dotnet watch` command to run the app, you can make changes to the app's markup and code and see the changes immediately reflected in the browser.

The `Counter` Razor component that renders the Counter web page is located at `Components/Pages/Counter.razor` in the project.

Open the `Counter.razor` file in a text editor and note a few interesting lines that render content and make the component's counter feature work.

The file starts with a line that indicates the component's relative path (`/counter`):

```razor
@page "/counter"
```

The title of the page is set by `<PageTitle>` tags:

```razor
<PageTitle>Counter</PageTitle>
```

An H1 heading is displayed to the user:

```razor
<h1>Counter</h1>
```

A paragraph element (`<p>`) displays the current count, which is stored in a variable named `currentCount`:

```razor
<p role="status">Current count: @currentCount</p>
```

A button (`<button>`) allows the user to increment the counter, which occurs when a button click executes a C# method named `IncrementCount`:

```razor
<button class="btn btn-primary" @onclick="IncrementCount">Click me</button>
```

C# code is present in the `@code` block:

```razor
@code {
...
}
```

Within the `@code` block:

* The counter variable `currentCount` is established with an initial value of zero.
* The `IncrementCount` method is defined. The code within the method increments the `currentCount` variable by one each time the method is invoked.

```csharp
private int currentCount = 0;

private void IncrementCount()
{
currentCount++;
}
```

Let's change the increment of the counter in the `IncrementCount` method.

Change the line so that `currentCount` is incremented by a value of ten each time `IncrementCount` is called:

```diff
- currentCount++;
+ currentCount += 10;
```

Save the file.

As soon as you save the file, the running app is updated automatically because you used the `dotnet watch` command. Go back to the app in the browser and select the **:::no-loc text="Click me":::** button in the Counter page. Witness how the counter now increments by ten.

To shut down the app:

* Close the browser window.
* Press <kbd>Ctrl</kbd>+<kbd>C</kbd> in the command shell.

*Congratulations!* You've successfully completed this tutorial.

## Next steps

In this tutorial, you learned how to:

> [!div class="checklist"]
> * Create a Blazor Web App.
> * Run the app.
> * Change the app.
> * Shut the app down.
To learn more about ASP.NET Core, see the following:

> [!div class="nextstepaction"]
> <xref:index#recommended-learning-path>
## Additional resources

[Additional Blazor tutorials](xref:blazor/tutorials/index)
Binary file not shown.
Binary file removed aspnetcore/getting-started/_static/home-page.png
Binary file not shown.
109 changes: 0 additions & 109 deletions aspnetcore/getting-started/index.md

This file was deleted.

10 changes: 0 additions & 10 deletions aspnetcore/getting-started/sample/Index.cshtml

This file was deleted.

4 changes: 2 additions & 2 deletions aspnetcore/includes/trustCertMac.md
Original file line number Diff line number Diff line change
@@ -1,12 +1,12 @@
Visual Studio for Mac displays the following popup:

![HTTPS Development certificate not found. Do you want to install and trust the certificate?](~/getting-started/_static/trustCertMac.png)
![HTTPS Development certificate not found. Do you want to install and trust the certificate?](~/static/trustCertMac.png)

Select **Yes** if you trust the development certificate.

The following dialog is displayed:

![Security warning dialog](~/getting-started/_static/certMac.png)
![Security warning dialog](~/static/certMac.png)

Enter your password and select **OK**

Expand Down
4 changes: 2 additions & 2 deletions aspnetcore/includes/trustCertMac6.md
Original file line number Diff line number Diff line change
@@ -1,12 +1,12 @@
Visual Studio for Mac displays the following popup:

![HTTPS Development certificate not found. Do you want to install and trust the certificate?](~/getting-started/_static/trustCertMac6.png)
![HTTPS Development certificate not found. Do you want to install and trust the certificate?](~/static/trustCertMac6.png)

Select **Install and Trust** if you trust the development certificate.

The following dialog is displayed:

![Security warning dialog](~/getting-started/_static/certMac6.png)
![Security warning dialog](~/static/certMac6.png)

Enter your password and select **Update Settings**

Expand Down
4 changes: 2 additions & 2 deletions aspnetcore/includes/trustCertMacVS22.md
Original file line number Diff line number Diff line change
@@ -1,12 +1,12 @@
Visual Studio for Mac displays the following popup:

![HTTPS Development certificate was not found. Do you want to install and trust the certificate?](~/getting-started/_static/trustCertMacVS22.png)
![HTTPS Development certificate was not found. Do you want to install and trust the certificate?](~/static/trustCertMacVS22.png)

* Select **Install and Trust** if you trust the development certificate.

The following dialog is displayed:

![Security warning dialog](~/getting-started/_static/certMacVS22.png)
![Security warning dialog](~/static/certMacVS22.png)

* Enter your password and select **Update Settings**.

Expand Down
4 changes: 2 additions & 2 deletions aspnetcore/includes/trustCertVS.md
Original file line number Diff line number Diff line change
@@ -1,12 +1,12 @@
Visual Studio displays the following dialog when a project is not yet configured to use SSL:

![This project is configured to use SSL. To avoid SSL warnings in the browser you can choose to trust the self-signed certificate that IIS Express has generated. Would you like to trust the IIS Express SSL certificate?](~/getting-started/_static/trustCert.png)
![This project is configured to use SSL. To avoid SSL warnings in the browser you can choose to trust the self-signed certificate that IIS Express has generated. Would you like to trust the IIS Express SSL certificate?](~/static/trustCert.png)

Select **Yes** if you trust the IIS Express SSL certificate.

The following dialog is displayed:

![Security warning dialog](~/getting-started/_static/cert.png)
![Security warning dialog](~/static/cert.png)

Select **Yes** if you agree to trust the development certificate.

Expand Down
4 changes: 2 additions & 2 deletions aspnetcore/includes/trustCertVS22.md
Original file line number Diff line number Diff line change
@@ -1,12 +1,12 @@
Visual Studio displays the following dialog:

![This project is configured to use SSL. To avoid SSL warnings in the browser you can choose to trust the self-signed certificate that IIS Express has generated. Would you like to trust the IIS Express SSL certificate?](~/getting-started/_static/trustCertVS22.png)
![This project is configured to use SSL. To avoid SSL warnings in the browser you can choose to trust the self-signed certificate that IIS Express has generated. Would you like to trust the IIS Express SSL certificate?](~/static/trustCertVS22.png)

Select **Yes** if you trust the IIS Express SSL certificate.

The following dialog is displayed:

![Security warning dialog](~/getting-started/_static/cert.png)
![Security warning dialog](~/static/cert.png)

Select **Yes** if you agree to trust the development certificate.

Expand Down
2 changes: 1 addition & 1 deletion aspnetcore/includes/trustCertVSC.md
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,7 @@

The preceding command displays the following dialog, provided the certificate was not previously trusted:

![Security warning dialog](~/getting-started/_static/cert.png)
![Security warning dialog](~/static/cert.png)

* Select **Yes** if you agree to trust the development certificate.

Expand Down
2 changes: 1 addition & 1 deletion aspnetcore/index.yml
Original file line number Diff line number Diff line change
Expand Up @@ -21,7 +21,7 @@ highlightedContent:
# Card
- title: "Create an ASP.NET Core app on any platform in 5 minutes"
itemType: get-started
url: getting-started/index.md
url: get-started.md
# Card
- title: "Create your first web UI"
itemType: get-started
Expand Down
Loading