Not
Bu sayfaya erişim yetkilendirme gerektiriyor. Oturum açmayı veya dizinleri değiştirmeyi deneyebilirsiniz.
Bu sayfaya erişim yetkilendirme gerektiriyor. Dizinleri değiştirmeyi deneyebilirsiniz.
Uyarı
Bu makalenin en son sürümü değil. Mevcut sürüm için, bu makalenin .NET 9 versiyonuna bakın.
Uyarı
Bu ASP.NET Core sürümü artık desteklenmiyor. Daha fazla bilgi için .NET ve .NET Core Destek Politikası sayfasına bakın. Mevcut sürüm için, bu makalenin .NET 9 versiyonuna bakın.
Önemli
Bu bilgi, ticari olarak piyasaya sürülmeden önce önemli ölçüde değiştirilebilecek bir ön sürüm ürünle ilgilidir. Burada sağlanan bilgilerle ilgili olarak, Microsoft açık veya zımni hiçbir garanti vermez.
Mevcut sürüm için, bu makalenin .NET 9 versiyonuna bakın.
BlazorHoş geldiniz!
Blazor sunucu tarafı işleme ve istemci etkileşimini tek bir programlama modelinde destekleyen bir .NET ön yüz web framework'üdür.
Blazor, .NET ile etkileşimli istemci tarafı web kullanıcı arayüzlerini oluşturan bir yapıdır.
- Zengin etkileşimli arayüzler oluşturmak için C# kullanın.
- Sunucu tarafı ve istemci tarafı uygulama mantığını .NET'te yazılmış olarak paylaşın.
- Kullanıcı arayüzünü mobil tarayıcılar da dahil olmak üzere geniş tarayıcı desteği için HTML ve CSS olarak oluşturun.
- Hem masaüstü hem de mobil hibrit uygulamaları .NET ve Blazor ile oluşturun.
- Zengin etkileşimli arayüzler oluşturmak için C# kullanın.
- Sunucu tarafı ve istemci tarafı uygulama mantığını .NET'te yazılmış olarak paylaşın.
- Kullanıcı arayüzünü mobil tarayıcılar da dahil olmak üzere geniş tarayıcı desteği için HTML ve CSS olarak oluşturun.
.NET kullanarak istemci taraflı web geliştirme için aşağıdaki avantajları sunar:
- C# dilinde yazılım geliştirme ve bakım süreçlerinde verimliliği artırabilecek kod yazın.
- Mevcut .NET .NET kütüphaneleri ekosisteminden yararlanın.
- .NET'in performans, güvenilirlik ve güvenliğinden faydalanın.
- Windows, Linux veya macOS üzerinde, Visual Studio veya Visual Studio Code gibi bir geliştirme ortamı ile verimli kalın. Modern barındırma platformlarıyla, örneğin Docker ile entegre olun.
- Ortak bir dil, framework ve araç seti üzerine inşa edin; bu set, kararlı, zengin özelliklere sahip ve kullanımı kolaydır.
Uyarı
Hızlı başlangıç eğitimi için, Blazor bölümüne bakın.
Bileşenler
Blazor uygulamalar bileşenlere dayanır. Blazor içindeki bir bileşen, bir sayfa, diyalog veya veri giriş formu gibi bir kullanıcı arayüzü (UI) unsurudur.
Bileşenler, .NET derlemelerine yerleştirilmiş .NET C# sınıflarıdır.
- Esnek UI işleme mantığını tanımla.
- Kullanıcı etkinliklerini yönet.
- İç içe geçirilebilir ve yeniden kullanılabilir.
- Razor sınıf kitaplıkları veya NuGet paketleri olarak paylaşılabilir ve dağıtılabilir.
Bileşen sınıfı genellikle bir Razor işaretleme sayfası biçiminde, .razor
dosya uzantısıyla yazılır.
Blazor içindeki bileşenlere, resmi olarak Razor bileşenleri, gayri resmi olarak ise Blazor bileşenleri denir.
Razor HTML işaretlemesini C# kodu ile birleştirmek için geliştirici verimliliğine yönelik bir sözdizimidir.
Razor size HTML işaretlemesi ile C# arasında aynı dosyada Visual Studio'da IntelliSense programlama desteğiyle geçiş yapma imkanı tanır.
Blazor UI bileşimi için doğal HTML etiketlerini kullanır. Aşağıdaki Razor işaretleme, kullanıcının bir düğmeye tıkladığında bir sayacı artıran bir bileşeni göstermektedir.
<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++;
}
}
Bileşenler, kullanıcı arabirimini esnek ve verimli bir şekilde güncelleştirmek için kullanılan işleme ağacı olarak adlandırılan tarayıcının Belge Nesne Modeli'nin (DOM) bellek içi gösterimine işlenir.
ile tam yığın web uygulaması oluşturma Blazor
Blazor Web Apps, sunucu tarafı işleme ve tam istemci tarafı etkileşimi ile bileşen tabanlı bir mimari sağlar ve bu tek bir çözümde sunar. Sunucu tarafı ve istemci tarafı işleme modları arasında geçiş yapabilir ve hatta aynı sayfada farklı modları birleştirebilirsiniz.
Blazor Web Apps, istekler karşısında sunucudan HTML içeriğini statik olarak oluşturarak tarayıcıya hızlı bir şekilde kullanıcı arayüzü iletebilir. Sayfa hızlı yükleniyor çünkü UI oluşturma, büyük bir JavaScript paketi indirmeye gerek kalmadan sunucuda hızlı bir şekilde gerçekleştiriliyor. Blazor ayrıca form gönderileriyle geliştirilmiş gezinme ve eşzamansız oluşturulan içeriğin akışkan render edilmesi gibi sunucu render işlemini aşamalı iyileştirmelerle kullanıcı deneyimini daha da iyileştirebilir.
Blazor etkileşimli sunucu tarafı oluşturmayı (etkileşimli SSR) destekler, burada kullanıcı arayüzü etkileşimleri, tarayıcı ile sunucu arasındaki gerçek zamanlı bir bağlantı üzerinden sunucu tarafından yönetilir. Etkileşimli SSR, bir istemci uygulamasından beklenen zengin kullanıcı deneyimini sunar, ancak sunucu kaynaklarına erişmek için API uç noktaları oluşturma gereğini ortadan kaldırır. Etkileşimli sayfaların sayfa içeriği önceden oluşturulur; bu içerik, sunucuda başlangıçta üretilip müşteri tarafına gönderilir ve render edilen kontroller için olay yöneticileri etkinleştirilmeden gönderilir. Sunucu, ilk isteğe yanıt olarak sayfanın HTML arayüzünü olabildiğince hızlı bir şekilde gönderir, bu da uygulamanın kullanıcılar için daha duyarlı hissetmesini sağlar.
Blazor Web App'nin istemci tarafı işleme (CSR) ile etkileşimi desteklemesi, uygulamanızla indirebileceğiniz bir WebAssembly ile oluşturulmuş .NET çalışma zamanı ile desteklenir. WebAssembly üzerinde Blazor çalıştırırken, .NET kodunuz tarayıcının tüm işlevselliğine erişebilir ve JavaScript ile etkileşimde bulunabilir. .NET kodunuz, tarayıcı güvenlik alanında, güvenlik alanının müşteri makinesindeki zararlı eylemlere karşı sağladığı korumalarla çalışır.
Blazor uygulamalar, bir sunucuya ihtiyaç duymadan tarayıcıda WebAssembly üzerinde çalışmaya tamamen odaklanabilir. Bağımsız bir Blazor WebAssembly için, varlıklar bir web sunucusuna veya statik içeriği müşterilere iletebilecek bir hizmete statik dosyalar olarak dağıtılır. İndirildikten sonra, bağımsız Blazor WebAssembly uygulamalar önbelleğe alınabilir ve Çevrimdışı Çalıştırılabilen Bir İleri Web Uygulaması (PWA) olarak kullanılabilir.
Yerel bir istemci uygulaması oluşturun Blazor Hybrid
Blazor Hybrid, web, mobil ve masaüstü platformlar için yerel ve web teknolojilerinin bir karışımıyla, yerel istemci uygulamasında Razor bileşenlerini kullanmayı sağlar. Kod, yerel bir etkileşim kanalı kullanarak gömülü bir Web View kontrolüne web UI'yi işlerken .NET sürecinde yerel olarak çalışır. WebAssembly, hibrit uygulamalarda kullanılmaz. Hibrit uygulamalar, C# ve XAML ile yerel mobil ve masaüstü uygulamaları oluşturmak için kullanılan çoklu platform çerçevesi .NET Multi-platform App UI (.NET MAUI) ile oluşturulur.
Blazor Hybrid, uygulamaları önceki teknolojiden 'ye geçirebilmek için Windows Presentation Foundation (WPF) ve .NET MAUI'u destekler.
Blazor Server
Blazor Server bir ASP.NET Core uygulamasında sunucuda Razor bileşenlerini barındırmak için destek sağlar. UI güncellemeleri, SignalR bağlantısı üzerinden işlenir.
Çalışma zamanı sunucuda kalır ve aşağıdakileri işler:
- Uygulamanın C# kodu çalıştırılıyor.
- Tarayıcıdan sunucuya UI olayları gönderme.
- Sunucu tarafından geri gönderilen bir bileşene UI güncellemelerini uygulama.
tarafından Blazor Server tarayıcıyla iletişim kurmak için kullanılan bağlantı, JavaScript birlikte çalışma çağrılarını işlemek için de kullanılır.
Blazor Server uygulamalar, içerikleri Razor görünümler veya Razor Sayfalar kullanarak ASP.NET Core uygulamalarındaki geleneksel UI oluşturma modellerinden farklı şekilde oluşturur. Her iki model de Razor dilini HTML içeriğini görselleştirmek için kullanır, ancak işaretleme nasıl işleniyorsa önemli ölçüde farklılık gösterir.
Bir Razor Sayfa veya görünüm oluşturulduğunda, her satır Razor kodu metin formunda HTML üretir. Rendering işleminden sonra, sunucu, üretilen herhangi bir durumu içeren sayfa veya görünüm örneğini yok eder. Sayfaya başka bir istek geldiğinde, tüm sayfa yeniden HTML olarak render edilir ve istemciye gönderilir.
Blazor Server , HTML veya XML DOM'sine benzer şekilde görüntülenecek bileşenlerin grafiğini oluşturur. Bileşen grafiği, özellikler ve alanlarda tutulan durumu kapsamaktadır. Blazor , işleme için istemciye gönderilen işaretlemenin ikili gösterimini oluşturmak için bileşen grafiğini değerlendirir. Müşteri ve sunucu arasındaki bağlantı kurulduktan sonra, bileşenin statik önceden işlenmiş öğeleri interaktif öğelerle değiştirilir. Sunucu üzerinde içerik önceden oluşturularak, istemci üzerinde HTML içeriğinin hızlıca yüklenmesi sağlanır ve bu da uygulamanın istemciye daha duyarlı olmasını sağlar.
Bileşenler istemcide etkileşimli olduktan sonra kullanıcı etkileşimi ve uygulama olayları tarafından kullanıcı arabirimi güncelleştirmeleri tetiklenir. Bir güncelleştirme gerçekleştiğinde bileşen grafı yeniden oluşturulur ve kullanıcı arabirimi farkları (fark) hesaplanır. Bu değişiklik, istemcideki kullanıcı arabirimini güncellemek için gereken en küçük DOM düzenlemeleri kümesidir. Fark, istemciye binary formatta gönderilir ve tarayıcı tarafından uygulanır.
Bir bileşen, kullanıcı bileşenden uzaklaştıktan sonra kaldırılır.
Blazor WebAssembly
Blazor WebAssembly , .NET ile etkileşimli istemci tarafı web uygulamaları oluşturmaya yönelik tek sayfalı bir uygulama (SPA) çerçevesidir .
.NET kodunun web tarayıcılarında çalıştırılması WebAssembly (kısaltılmış) tarafından mümkün kılındı wasm
. WebAssembly, hızlı indirme ve maksimum yürütme hızı için optimize edilmiş kompakt bir bayt kodu formatıdır. WebAssembly, açık bir web standartıdır ve web tarayıcılarında eklenti olmadan desteklenir. WebAssembly, mobil tarayıcılar dahil olmak üzere tüm modern web tarayıcılarında çalışır.
WebAssembly kodu, JavaScript aracılığıyla tarayıcının tam işlevselliğine erişebilir. Bu, genellikle JavaScript uyumluluğu olarak adlandırılır ve kısaca JavaScript interop veya JS interop olarak kısaltılır. Tarayıcıda WebAssembly aracılığıyla çalıştırılan .NET kodu, tarayıcının JavaScript alanında çalışır ve bu alan, istemci makinede kötü niyetli eylemlere karşı koruma sağlar.
Blazor WebAssembly uygulaması oluşturulup çalıştırıldığında:
- C# kod dosyaları ve Razor dosyaları, .NET derlemelerine derlenir.
- Assembly'ler ve .NET çalışma zamanı tarayıcıya indirilir.
- Blazor WebAssembly, .NET WebAssembly çalışma zamanını başlatır ve uygulamanın derlemelerini yüklemesi için çalışma zamanını yapılandırır. Çalışma zamanı, DOM işlemlerini ve tarayıcı API çağrılarını gerçekleştirmek için JavaScript interoperabilitesini kullanır.
Yayımlanan uygulamanın boyutu ve yük boyutu, bir uygulamanın kullanılabilirliği için kritik bir performans faktörüdür. Büyük bir uygulamanın tarayıcıya indirilmesi oldukça uzun sürer ve bu da kullanıcı deneyimini azaltır. Blazor WebAssembly indirme sürelerini azaltmak için yük boyutunu iyileştirir:
- Kullanılmayan kod Ara Dil (IL) Düzelticisi tarafından yayımlandığında uygulamadan çıkarılır.
- HTTP yanıtları sıkıştırılır.
- .NET çalışma zamanı ve derlemeleri tarayıcıda önbelleğe alınır.
Blazor Hybrid
Hibrit uygulamalar, yerel ve web teknolojilerinin bir karışımını kullanır. Bir Blazor Hybrid uygulama yerel istemci uygulamasında kullanır Blazor . Razor bileşenleri, .NET sürecinde yerel olarak çalışır ve yerel bir birlikte çalışma kanalı kullanarak web kullanıcı arabirimini gömülü bir Web View kontrolüne işler. WebAssembly, hibrit uygulamalarda kullanılmaz. Hibrit uygulamalar aşağıdaki teknolojileri içerir:
- .NET Multi-platform App UI (.NET MAUI): C# ve XAML ile yerel mobil ve masaüstü uygulamalar oluşturmak için platformlar arası bir framework.
- Windows Presentation Foundation (WPF): Çözünürlükten bağımsız ve vektör tabanlı bir render motoru kullanan, modern grafik donanımlarından faydalanmak için geliştirilmiş bir kullanıcı arayüzü (UI) framework'ü.
- Windows Forms: Windows için zengin masaüstü istemci uygulamaları oluşturan bir kullanıcı arayüzü çerçevesi. Windows Forms geliştirme platformu, kontroller, grafikler, veri bağlama ve kullanıcı girişi dahil olmak üzere geniş bir uygulama geliştirme özellikleri setini destekler.
JavaScript ile birlikte çalışabilirlik (interoperabilite)
Tarayıcı API'lerine ve üçüncü taraf JavaScript kütüphanelerine erişim gerektiren uygulamalar için, bileşenler JavaScript ile etkileşime girer. Bileşenler, JavaScript'in kullanabildiği herhangi bir kütüphane ya da API'yi kullanabilme yeteneğine sahiptir. C# kodu JavaScript kodunu çağırabilir ve JavaScript kodu C# kodunu çağırabilir.
Kod paylaşımı ve .NET Standard
Blazor, .NET Standard özelliklerine uyan kütüphanelerin projeleri tarafından referans alınmasına olanak sağlayan Blazor'ı uygular. .NET Standard, çeşitli .NET uygulamaları arasında ortak olan .NET API'lerinin resmi bir spesifikasyonudur. .NET Standart sınıf kitaplıkları Blazor, .NET Framework, .NET Core, .NET Multi-platform App UI (.NET MAUI), Mono ve Unity gibi farklı .NET platformlarında paylaşılabilir.
Web tarayıcısında geçerli olmayan API'ler (örneğin, dosya sistemine erişim, bir soket açma ve iş parçacığı) bir PlatformNotSupportedException fırlatır.
Sonraki adımlar
ASP.NET Core