ASP.NET Core kullanmaya başlayın

Bu öğreticide .NET CLI kullanarak ASP.NET Core Blazor Web App oluşturma, çalıştırma ve değiştirme işlemleri gösterilmektedir. Blazor , tek bir programlama modelinde hem sunucu tarafı işlemeyi hem de istemci etkileşimini destekleyen bir .NET ön uç web çerçevesidir.

Nasıl yapılacağını öğreneceksiniz:

• oluşturun Blazor Web App.
• Uygulamayı çalıştırın.
• Uygulamayı değiştirin.
• Uygulamayı kapatın.

Prerequisites

. NET'i İndir'de en son .NET SDK'sını edinin ve yükleyin.

Bir Blazor Web App oluştur

Örnek uygulama için uygun bir konuma bir komut kabuğu açın ve Blazor Web App oluşturmak için aşağıdaki komutu kullanın. seçeneği proje -o|--output için bir klasör oluşturur ve projeyi BlazorSampleolarak adlandırmaktadır:

dotnet new blazor -o BlazorSample

Uygulamayı çalıştırma

Aşağıdaki komutu kullanarak dizini BlazorSample klasörüne değiştirin:

cd BlazorSample

Komut uygulamayı dotnet watch çalıştırır ve varsayılan tarayıcınızı uygulamanın giriş sayfasında açar:

dotnet watch

Uygulamanın kenar çubuğu menüsünü kullanarak Sayaç sayfasını ziyaret edin, burada sayacı artırmak için Click me düğmesini seçebilirsiniz.

Uygulamayı değiştirme

Sayaç sayfası yüklü olarak tarayıcıyı açık bırakın. Uygulamayı çalıştırmak için komutunu kullanarak dotnet watch , tarayıcıda yapılan değişiklikleri yansıtacak şekilde uygulamayı yeniden oluşturmak zorunda kalmadan uygulamanın işaretlemesinde ve kodunda değişiklik yapabilirsiniz.

Counter Razor Bileşeni Sayaç web sayfasını oluşturan bileşen projede Components/Pages/Counter.razor konumunda bulunur. Razor, HTML işaretlemesini geliştirici üretkenliği için tasarlanmış C# koduyla birleştirmeye yönelik bir söz dizimidir.

Counter.razor Dosyayı bir metin düzenleyicisinde açın ve içeriği işleyen ve bileşenin sayaç özelliğinin çalışmasını sağlayan birkaç ilginç satırı not edin.

Components/Pages/Counter.razor:

@page "/counter"

<PageTitle>Counter</PageTitle>

<h1>Counter</h1>

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

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

@code {
    private int currentCount = 0;

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

Dosya, bileşenin göreli yolunu belirten bir satırla başlar (/counter).

@page "/counter"

Sayfanın başlığı <PageTitle> etiketleri tarafından belirlenir.

<PageTitle>Counter</PageTitle>

Bir H1 başlığı görüntülenir:

<h1>Counter</h1>

Paragraf öğesi (<p>), adlı currentCountdeğişkende depolanan geçerli sayıyı görüntüler:

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

Düğme (<button>), kullanıcının sayacı artırmasına olanak tanır. Bu, bir düğme tıklaması adlı IncrementCountbir C# yöntemini yürüttüğünde gerçekleşir:

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

Blok, @code bileşenin yürüttüğü C# kodunu içerir:

• Sayaç değişkeni currentCount , sıfır başlangıç değeriyle oluşturulur.
• IncrementCount yöntemi tanımlanır. Yöntem her çağrıldığında, yöntem içindeki kod currentCount değişkenini bir artırır.

private int currentCount = 0;

private void IncrementCount()
{
    currentCount++;
}

Sayacın artışını IncrementCount metodunda değiştirelim.

Her çağrılışında currentCount on değeri artırılarak satırı IncrementCount değiştirin:

- currentCount++;
+ currentCount += 10;

Dosyayı kaydedin.

Dosyayı kaydettiğiniz anda, dotnet watch komutunu kullandığınız için çalışmakta olan uygulama otomatik olarak güncellenir. Tarayıcıda uygulamaya geri dönün ve Sayaç sayfasındaki düğmeyi Click me seçin. Sayacın mevcut değeri olan bir değerinden on bir değerine nasıl artmaya devam ettiğine tanık olun. Düğme her seçildiğinde değer on artar.

Uygulamayı kapatma

Şu adımları izleyin:

• Tarayıcı penceresini kapatın.
• Uygulamayı kapatmak için komut kabuğunda Ctrl+C tuşuna basın.

Congratulations! Bu öğreticiyi başarıyla tamamladınız.

Sonraki Adımlar

Bu öğreticide şunların nasıl yapılacağını öğrendiniz:

• oluşturun Blazor Web App.
• Uygulamayı çalıştırın.
• Uygulamayı değiştirin.
• Uygulamayı kapatın.

ASP.NET Core'un temelleri hakkında daha fazla bilgi edinmek için aşağıdakilere bakın:

ASP.NET Temel bilgilerine genel bakış

Ek öğreticiler

Uygulama türü	Scenario	Tutorials
Web uygulaması	Yeni sunucu ve istemci web geliştirme Blazor ile	Yapılacaklar listesi uygulaması oluştur Blazor ve Film veritabanı uygulaması oluştur Blazor (Genel Bakış)
Web API'si	Minimum API'ler ile sunucu tabanlı veri işleme	Öğretici: ASP.NET Core ile Minimal API oluşturma
Uzaktan Yordam Çağrısı (RPC) uygulaması	Protokol Arabelleklerini kullanan sözleşme öncelikli hizmetler	ASP.NET Core'da .NET gRPC istemcisi ve sunucusu oluşturma
Gerçek zamanlı uygulama	Sunucu/istemci çift yönlü iletişim	ASP.NET Core kullanmaya başlama SignalR

Ek kaynaklar

• .NET'e giriş
• Visual Studio
• Visual Studio Code
• .NET Geliştirici Topluluğu
• .NET Live TV