Razor ve Blazor, Visual Studio geliştirme ortamında web uygulamaları oluşturmak için en popüler web UI çerçevelerinden ikisidir. Bu blog yazısı, sözdizimleri, etkileşimleri, faydaları ve dezavantajları baz alınarak bu iki .NET teknolojisi arasındaki benzerlikleri ve farkları inceleyecektir. Ayrıca bazı kullanım senaryolarını kod örnekleri ile gösterecektir.

ASP.NET Core'da Razor ve Blazor nedir?

Razor

Razor, geliştiricilerin HTML ve gömülü .NET sunucu tarafı kod kullanarak dinamik olarak web sayfaları oluşturmasına olanak tanıyan bir sunucu tarafı işaretleme dilidir. Razor, C# veya VB ile yazılmış web sayfası şablon dosyalarından Razor Sayfaları dan web sayfaları üretir. VB kodu ile yazılan Razor sayfaları .vbhtml dosya uzantısını kullanır, C# kodu ile yazılan Razor sayfaları ise .cshtml dosya uzantısını kullanır.

Modern ASP.NET web uygulamaları Razor'u destekler ve Razor, geleneksel ASP.NET işaretlemesinin lehine kullanılabilir.

Blazor

Blazor, geliştiricilerin .NET programlama dillerini kullanarak etkileşimli, istemci tarafı arayüzler oluşturmalarına olanak tanıyan bir web uygulama çerçevesidir. Blazor ile oluşturulan web uygulamaları, tek sayfa uygulamalar (SPA) olup, bir web tarayıcısının istemcisi içinde çalışır (bir web sunucusunda değil). Tarayıcı tarafı uygulama çalışması, tüm modern web tarayıcılarında bulunan ve .NET kaynak kodunu çalıştırabilen bir platformlar arası komut seti kütüphanesi olan WebAssembly sayesinde mümkün olur.

Blazor ile geliştiriciler, C#, HTML ve CSS ile etkileşimli, yine kullanılabilir istemci tarafı web bileşenleri oluşturabilirler (JavaScript'i dahil etme gerekliliği olmadan). Ayrıca, bu bileşenler C# dilinde yazıldıkları için, geliştiriciler uygulama detaylarını, kaynak kodu ve kütüphaneler olarak gerektiği gibi istemci ve sunucu arasında taşıma esnekliğine sahiptirler.

Blazor, Razor Bileşenlerini Kullanır mı?

Blazor, Razor söz dizimini tamamen destekler. Blazor uygulamaları, döngüler, koşullu ifadeler vb. kullanarak Razor'un tam işaretleme özellik setini kullanarak oluşturabilirsiniz. Aşağıdaki örneği düşünün.

@page "/HelloWorld"

<h1>
   Example Component
</h1>

@foreach (var person in People)
{
    <h2>@person.FirstName</h2>
}

@page "/HelloWorld"

<h1>
   Example Component
</h1>

@foreach (var person in People)
{
    <h2>@person.FirstName</h2>
}

Bu Razor bileşeni, foreach döngüsünü kullanarak People adlı koleksiyonun üzerinden iterasyon yapar ve her kişinin adını <h2> etiketleri içinde çıktılar.

Razor ve Blazor Arasındaki Bağlantı

Razor ve Blazor arasında bir ilişki olduğunu açıkça görebiliyoruz. Sonuçta, Blazor'un adı kendisi 'tarayıcı' ve 'ustura' kelimelerinin bir kombinasyonudur.

Razor ve Blazor, her ikisi de HTML ve C# kullanarak web uygulamaları oluşturmak için kullanılır. Açık kaynak kodlu ve ücretsiz olduklarından, geliştiriciler onları hemen ve kısıtlama olmadan kullanabilir. ASP.NET web uygulamaları geliştirirken, ASP.NET Core ve ASP.NET MVC'ye daha yakın olduğu için Razor sözdizimini kullanırız.

Blazor, Razor sözdizimi ile yazılmış bir veya daha fazla bileşenden esnek, etkileşimli kullanıcı arayüzleri oluşturur.

Razor'ın Blazor'da nasıl kullanıldığı konusunda önemli bir ayrım yapmalıyız: Bu, tüm sayfaları oluşturmak için kullanılmaz, bileşenleri (düğmeler, sayfa elemanları, vb.) oluşturur.

Ek olarak, Blazor içindeki Razor dosyaları ( .cshtml uzantısına sahip dosyalar) resmi olarak Razor bileşenleri olarak bilinir, Blazor bileşenleri olarak değil (her iki kelime de birçok geliştirme çevresinde birbirinin yerine kullanılsa da).

Razor Sayfaları ve Blazor Sunucusu Çalışma Prensibi

Razor, tarayıcıya tüm sayfaları sunmak için MVC uygulamaları içinde çalışır.

Razor Sayfaları Eylemde

Bir kullanıcı bir düğmeye veya bağlantıya tıkladığında, tarayıcı sunucuya bir istek gönderir, bu da veritabanına çarpar, .cshtml Razor Görünümünü (veya Razor Sayfasını) alır, verileri ve işaretlemeyi birleştirir ve tümünü tarayıcıya geri döndürür (tüm sayfayı yeniden işler).

Öte yandan Blazor, Razor sözdizimi ile yazılmış bir dizi daha küçük bileşen kullanarak tüm bir web sayfası oluşturmanıza olanak tanır.

Blazor Eylemde

Bu, Blazor WebAssembly'nin (Blazor WASM) işleyişini gösterir.

Blazor WASM uygulamanıza yapılan ilk çağrı, tanımladığınız tüm bileşenleri içeren tam programı döndürür, tıpkı JavaScript kullanılarak oluşturulan Tek Sayfa Uygulaması gibi.

Tarayıcı artık bu elemanlara erişebildiğine göre, bilgileri ve olaylara tepki olarak bunları görüntüleyebilir, gizleyebilir ve güncelleyebilir.

Bu şekilde, Blazor uygulamaları 'modern' JavaScript kütüphaneleri/çerçeveleri kullanarak geliştireceğiniz uygulamalara daha çok benzer, örneğin Vue veya Angular gibi. Blazor uygulamaları, veri alma ve gönderme amacıyla tarayıcıda çalışırken arka uç ile ağ çağrıları yapar.

Şimdi, Blazor uygulaması ve Razor Görünüm motorunun bazı artılarını ve eksilerini tartışalım.

Blazor ve Razor'un Artı ve Eksileri

.NET çerçevesi üzerine kurulmuş etkileşimli web uygulamaları oluşturmaya gelince, Blazor ve Razor oldukça tercih edilir. Bu teknolojiler, standart JavaScript projeleri için birincil programlama dili olarak C# kullanma konusunda yeni bir geçiş sunar.

Razor veya Blazor kullanarak web uygulamaları oluştururken dikkate alınması gereken birkaç fayda ve sakınca.

Blazor'un Faydaları

• İstemci tarafı Blazor, WebAssembly kullanarak .NET kodunu doğrudan tarayıcıda yürütür (bu, daha hızlı ve ağ bant genişliğinden tasarruf sağlar) ve dinamik web içeriği sağlar.
• Sunucu tarafı dillerle aynı sözdizimi ve mantığı kullanır, bu da tüm .NET kütüphaneleri ve araçları ile uyumlu hale getirir.

Blazor'un Sakıncaları

• Blazor kullanarak istemci-tarafı .NET uygulama yürütümü için sınırlı .NET Araçları ve hata ayıklama desteği mevcuttur.
• İstemci tarafı Blazor'un performans avantajları, sunucu tarafı uygulamada mevcut değildir.

Razor'un Faydaları

• Razor, web sayfalarına C# kodunun mantıksal (koşullu) eklenmesini mümkün kılar.
• Razor, oldukça esnektir ve geniş bir uygulama yelpazesi oluşturmak için kullanılabilir.
• Razor'un yapısı iyi organize edilmiştir.

Razor'un Sakıncaları

• Dinamik, istemci-tarafı etkileşimleri gerçekleştirmek için JavaScript gereklidir.
• Birden fazla kendi kendine yeterli sayfa, Razor ile yönetmek ve sürdürmek zor olabilir.

IronPDF'nin öne çıkan özelliği, HTML'yi IronPDF ile PDF'ye dönüştürme işlemi olup, yerleşim ve stilleri korur. Bu işlevsellik, raporlar, faturalar ve belgeler gibi web tabanlı içeriklerden PDF üretmek için idealdir. HTML dosyaları, URL'ler ve HTML dizgileri PDF'lere dönüştürülebilir.

using IronPdf;

class Program
{
    static void Main(string[] args)
    {
        var renderer = new ChromePdfRenderer();
        
        // Convert HTML String to PDF
        var htmlContent = "<h1>Hello, IronPDF!</h1><p>This is a PDF from an HTML string.</p>";
        var pdfFromHtmlString = renderer.RenderHtmlAsPdf(htmlContent);
        pdfFromHtmlString.SaveAs("HTMLStringToPDF.pdf");
        
        // Convert HTML File to PDF
        var htmlFilePath = "path_to_your_html_file.html"; // Specify the path to your HTML file
        var pdfFromHtmlFile = renderer.RenderHtmlFileAsPdf(htmlFilePath);
        pdfFromHtmlFile.SaveAs("HTMLFileToPDF.pdf");
        
        // Convert URL to PDF
        var url = "http://ironpdf.com"; // Specify the URL
        var pdfFromUrl = renderer.RenderUrlAsPdf(url);
        pdfFromUrl.SaveAs("URLToPDF.pdf");
    }
}

using IronPdf;

class Program
{
    static void Main(string[] args)
    {
        var renderer = new ChromePdfRenderer();
        
        // Convert HTML String to PDF
        var htmlContent = "<h1>Hello, IronPDF!</h1><p>This is a PDF from an HTML string.</p>";
        var pdfFromHtmlString = renderer.RenderHtmlAsPdf(htmlContent);
        pdfFromHtmlString.SaveAs("HTMLStringToPDF.pdf");
        
        // Convert HTML File to PDF
        var htmlFilePath = "path_to_your_html_file.html"; // Specify the path to your HTML file
        var pdfFromHtmlFile = renderer.RenderHtmlFileAsPdf(htmlFilePath);
        pdfFromHtmlFile.SaveAs("HTMLFileToPDF.pdf");
        
        // Convert URL to PDF
        var url = "http://ironpdf.com"; // Specify the URL
        var pdfFromUrl = renderer.RenderUrlAsPdf(url);
        pdfFromUrl.SaveAs("URLToPDF.pdf");
    }
}

Imports IronPdf

Module Program
    Sub Main(args As String())
        Dim renderer = New ChromePdfRenderer()

        ' Convert HTML String to PDF
        Dim htmlContent = "<h1>Hello, IronPDF!</h1><p>This is a PDF from an HTML string.</p>"
        Dim pdfFromHtmlString = renderer.RenderHtmlAsPdf(htmlContent)
        pdfFromHtmlString.SaveAs("HTMLStringToPDF.pdf")

        ' Convert HTML File to PDF
        Dim htmlFilePath = "path_to_your_html_file.html" ' Specify the path to your HTML file
        Dim pdfFromHtmlFile = renderer.RenderHtmlFileAsPdf(htmlFilePath)
        pdfFromHtmlFile.SaveAs("HTMLFileToPDF.pdf")

        ' Convert URL to PDF
        Dim url = "http://ironpdf.com" ' Specify the URL
        Dim pdfFromUrl = renderer.RenderUrlAsPdf(url)
        pdfFromUrl.SaveAs("URLToPDF.pdf")
    End Sub
End Module

Imports IronPdf

Module Program
    Sub Main(args As String())
        Dim renderer = New ChromePdfRenderer()

        ' Convert HTML String to PDF
        Dim htmlContent = "<h1>Hello, IronPDF!</h1><p>This is a PDF from an HTML string.</p>"
        Dim pdfFromHtmlString = renderer.RenderHtmlAsPdf(htmlContent)
        pdfFromHtmlString.SaveAs("HTMLStringToPDF.pdf")

        ' Convert HTML File to PDF
        Dim htmlFilePath = "path_to_your_html_file.html" ' Specify the path to your HTML file
        Dim pdfFromHtmlFile = renderer.RenderHtmlFileAsPdf(htmlFilePath)
        pdfFromHtmlFile.SaveAs("HTMLFileToPDF.pdf")

        ' Convert URL to PDF
        Dim url = "http://ironpdf.com" ' Specify the URL
        Dim pdfFromUrl = renderer.RenderUrlAsPdf(url)
        pdfFromUrl.SaveAs("URLToPDF.pdf")
    End Sub
End Module

Bu C# programı, HTML içeriğini PDF belgelerine dönüştürmek için IronPdf kullanımını göstermektedir. Bir HTML dizesi, bir HTML dosyası ve bir URL'den dönüşümleri destekler.

Sonuç

Razor, API mantığını ve sunucu-tarafı şablonlamayı ele alabilir, ancak JavaScript tabanlı olmayan istemci-tarafı mantığı ele alamaz. Blazor, programcıların sadece C# ile hem istemci hem de sunucu tarafı işlevselliğini ele almasına olanak tanır. Razor, HTML içine sunucu-tarafı kodu içeren şablonlar için bir işaretleme sözdizimidir. Öte yandan Blazor, duruma bağlı olarak ya Blazor WebAssembly ya da Blazor Sunucu üzerinde çalışabilecek bir SPA çerçevesidir.

IronPDF'yi Keşfedin ve Razor uygulamaları ve Blazor uygulamaları içinde PDF dosyalarını oluşturmanın, okumanın, güncellemenin ve düzenlemenin en kolay yolunu bulun. IronPDF, Excel, PDF, Barkodlar, QR Kodları ve görüntüler içeren Razor veya Blazor web uygulamaları yaratırken faydalı beş kütüphane içeren Iron Software'in Iron Suite parçasıdır.

Iron Suite, kişisel kullanım için ücretsiz olarak mevcuttur. Ticari lisans almak hakkında daha fazla bilgi için, lütfen Iron Suite Lisans Bilgilerini ziyaret edin.