Jak działa blazor

Platforma Blazor udostępnia wiele funkcji, które ułatwiają rozpoczęcie pracy i szybkie dostarczanie kolejnego projektu aplikacji internetowej. Zapoznajmy się z podstawowymi możliwościami platformy Blazor, aby ułatwić podjęcie decyzji, czy należy używać platformy Blazor do następnej wspaniałej aplikacji internetowej.

Składniki platformy Blazor

Aplikacje platformy Blazor są tworzone na podstawie składników. Komponent Blazor jest elementem internetowego interfejsu użytkownika wielokrotnego użytku. Składnik Blazor hermetyzuje zarówno logikę renderowania, jak i obsługi zdarzeń interfejsu użytkownika. Platforma Blazor zawiera różne wbudowane składniki do obsługi formularzy, walidacji danych użytkownika, wyświetlania dużych zestawów danych, uwierzytelniania i autoryzacji. Deweloperzy mogą również tworzyć i udostępniać własne składniki niestandardowe, a wiele wstępnie utworzonych składników platformy Blazor jest dostępnych w ekosystemie platformy Blazor.

Korzystanie ze standardowych technologii internetowych

Składniki platformy Blazor są tworzone przy użyciu składni Razor, wygodnej kombinacji języków HTML, CSS i C#. Plik Razor zawiera zwykły kod HTML, a następnie język C#, aby zdefiniować dowolną logikę renderowania, na przykład w przypadku warunkowych, przepływu sterowania i oceny wyrażeń. Pliki Razor są następnie kompilowane w klasach języka C#, które hermetyzują logikę renderowania składnika. Ponieważ składniki platformy Blazor utworzone w języku Razor to tylko klasy języka C#, można wywołać dowolny kod platformy .NET ze składników.

Obsługa zdarzeń interfejsu użytkownika i powiązanie danych

Interaktywne składniki platformy Blazor mogą obsługiwać standardowe interakcje interfejsu użytkownika internetowego przy użyciu procedur obsługi zdarzeń języka C#. Składniki mogą aktualizować swój stan w odpowiedzi na zdarzenia interfejsu użytkownika i odpowiednio dostosowywać renderowanie. Platforma Blazor obejmuje również obsługę dwukierunkowego powiązania danych z elementami interfejsu użytkownika w celu zachowania synchronizacji stanu składnika z elementami interfejsu użytkownika.

Poniższy przykład to prosty komponent licznikowy Blazor, napisany w Razor. Większość zawartości to HTML, a @code blok zawiera język C#. Za każdym razem, gdy przycisk jest naciskany, wywoływana jest metoda języka C# IncrementCount, co zwiększa pole currentCount, a następnie składnik renderuje zaktualizowaną wartość.

<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++;
    }
}

Renderowanie po stronie serwera i klienta

Platforma Blazor obsługuje renderowanie składników po stronie serwera i klienta w celu obsługi różnych architektur interfejsu użytkownika sieci Web. Składniki renderowane z serwera mogą uzyskiwać dostęp do zasobów serwera, takich jak bazy danych i usługi zaplecza. Domyślnie składniki platformy Blazor są renderowane statycznie z serwera, generując kod HTML w odpowiedzi na żądania.

Można również skonfigurować składniki serwera w sposób interaktywny, aby mogły obsługiwać dowolne zdarzenia interfejsu użytkownika, utrzymywać stan podczas interakcji i dynamicznie renderować aktualizacje. Interaktywne składniki serwera obsługują interakcje interfejsu użytkownika i aktualizacje za pośrednictwem połączenia protokołu WebSocket z przeglądarką.

Alternatywnie składniki platformy Blazor można renderować interaktywnie z poziomu klienta. Składnik jest pobierany do klienta i uruchamiany z przeglądarki za pośrednictwem zestawu WebAssembly. Interaktywne składniki zestawu WebAssembly mogą uzyskiwać dostęp do zasobów klienta za pośrednictwem platformy internetowej, takiej jak magazyn lokalny i sprzęt, a nawet działać w trybie offline po pobraniu.

Możesz renderować różne składniki z serwera lub klienta w ramach tej samej aplikacji. Wiele stron w aplikacji może w ogóle nie wymagać żadnej interakcyjności i może być renderowanych statycznie z serwera. Podczas gdy inne bardziej interaktywne części aplikacji mogą być obsługiwane z serwera lub klienta. Możesz zdecydować, który tryb renderowania składników ma być używany w czasie projektowania lub w czasie wykonywania. Dzięki platformie Blazor masz elastyczność tworzenia architektury aplikacji internetowej, która jest odpowiednia dla danego scenariusza.

Tworzenie pizzerii przy użyciu platformy Blazor

Interfejs użytkownika aplikacji do pizzerii dzieli się na wiele składników wielokrotnego użytku: układ strony z paskiem nawigacyjnym, poszczególnymi stronami, katalogiem pizzy i edytorem, składnikiem zamówienia itd. Platforma Blazor zapewnia wbudowaną obsługę wielu z tych składników, takich jak składniki formularzy i walidacji. Wiele stron w aplikacji można obsłużyć z serwera przy użyciu statycznego renderowania po stronie serwera, dzięki czemu witryna jest w większości bezstanowa i gotowa do skalowania. Gdy potrzebna jest większa interakcyjność, składniki są tworzone interakcyjnie przez zastosowanie trybu renderowania interakcyjnego. Aby odciążyć pracę z serwera, składniki interaktywne są renderowane na kliencie za pośrednictwem zestawu WebAssembly. Tworząc całą aplikację za pomocą jednego stosu technologicznego, aplikacja powstaje szybko i wkrótce zamówienia na pizzę zaczynają napływać.