ASP.NET Core Blazor

Bem-vindo ao Blazor!

Blazor é um .NET frontend web framework que suporta renderização do lado do servidor e interatividade do cliente em um único modelo de programação:

• Crie interfaces de usuário interativas avançadas usando C#.
• Partilhe a lógica da aplicação do lado do servidor e do lado do cliente escrita em .NET.
• Renderize a interface do usuário como HTML e CSS para amplo suporte a navegadores, incluindo navegadores móveis.
• Crie aplicativos móveis e de área de trabalho híbridos com .NET e Blazor.

Usar o .NET para desenvolvimento web do lado do cliente oferece as seguintes vantagens:

• Escreva código em C#, o que pode melhorar a produtividade no desenvolvimento e manutenção de aplicativos.
• Tire partido do ecossistema .NET existente de bibliotecas .NET.
• Beneficie do desempenho, fiabilidade e segurança do .NET.
• Mantenha-se produtivo no Windows, Linux ou macOS com um ambiente de desenvolvimento, como Visual Studio ou Visual Studio Code. Integre com plataformas de hospedagem modernas, como Docker.
• Desenvolva um conjunto comum de linguagens, estruturas e ferramentas que são estáveis, ricas em recursos e fáceis de usar.

Observação

Para um tutorial de início rápido Blazor, consulte Criar a sua primeira aplicação Blazor.

Componentes

Blazor aplicativos são baseados em componentes . Um componente no Blazor é um elemento da interface do usuário, como uma página, caixa de diálogo ou formulário de entrada de dados.

Os componentes são classes C# .NET incorporadas em assemblies .NET que:

• Defina uma lógica de renderização flexível da interface do usuário.
• Manipular eventos do usuário.
• Pode ser aninhado e reutilizado.
• Pode ser partilhado e distribuído como Razor bibliotecas de classes ou pacotes NuGet.

A classe de componente é geralmente escrita na forma de uma página de marcação Razor com uma extensão de arquivo .razor. Os componentes em Blazor são formalmente referidos como componentes Razor, informalmente como componentes Blazor. Razor é uma sintaxe para combinar marcação HTML com código C# projetado para produtividade do desenvolvedor. Razor permite alternar entre marcação HTML e C# no mesmo ficheiro, com suporte de programação IntelliSense no Visual Studio.

Blazor usa tags HTML naturais para a composição da interface do usuário. A marcação Razor a seguir demonstra um componente que incrementa um contador quando o usuário seleciona um botão.

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

Os componentes são renderizados em uma representação na memória do DOM (Document Object Model) do navegador chamada de árvore de renderização , que é usada para atualizar a interface do usuário de forma flexível e eficiente.

Crie uma aplicação web full-stack com Blazor

Blazor Web Apps fornecem uma arquitetura baseada em componentes com renderização do lado do servidor e interatividade total do lado do cliente em uma única solução, onde você pode alternar entre os modos de renderização do lado do servidor e do lado do cliente e até mesmo misturá-los na mesma página.

Blazor Web Apps pode rapidamente entregar a interface do utilizador para o navegador ao renderizar estaticamente o conteúdo HTML do servidor em resposta a solicitações. A página é carregada rapidamente porque a renderização da interface do usuário é executada rapidamente no servidor sem a necessidade de baixar um grande pacote JavaScript. Blazor também pode melhorar ainda mais a experiência do usuário com vários aprimoramentos progressivos na renderização do servidor, como navegação aprimorada com postagens de formulário e renderização de streaming de conteúdo gerado de forma assíncrona.

Blazor suporta renderização interativa do lado do servidor (SSR interativo), onde as interações da UI são geridas pelo servidor através de uma conexão em tempo real com o navegador. O SSR interativo permite uma experiência de usuário rica como seria de esperar de um aplicativo cliente, mas sem a necessidade de criar pontos de extremidade de API para acessar os recursos do servidor. O conteúdo da página para páginas interativas é pré-renderizado, onde o conteúdo no servidor é inicialmente gerado e enviado para o cliente sem habilitar manipuladores de eventos para controles renderizados. O servidor emite a interface do usuário HTML da página o mais rápido possível em resposta à solicitação inicial, o que faz com que o aplicativo se sinta mais responsivo aos usuários.

Blazor Web Appsuporta a interatividade com renderização do lado do cliente (CSR) que depende do tempo de execução .NET criado com WebAssembly que pode ser descarregado com a sua aplicação. Ao executar Blazor no WebAssembly, seu código .NET pode acessar todas as funcionalidades do navegador e interoperar com JavaScript. Seu código .NET é executado na área restrita de segurança do navegador com as proteções que a área restrita fornece contra ações maliciosas na máquina cliente.

Blazor aplicações podem ser executadas inteiramente no WebAssembly no navegador sem o envolvimento de um servidor. Para um aplicativo Blazor WebAssembly autônomo, os ativos são implantados como arquivos estáticos em um servidor Web ou serviço capaz de fornecer conteúdo estático aos clientes. Uma vez baixados, os aplicativos Blazor WebAssembly autônomos podem ser armazenados em cache e executados offline como um PWA (Progressive Web App).

Crie um aplicativo cliente nativo com Blazor Hybrid

Blazor Hybrid permite o uso de componentes Razor em um aplicativo cliente nativo com uma mistura de tecnologias nativas e da Web para plataformas Web, móveis e de desktop. O código é executado nativamente no processo .NET e processa a interface do usuário da Web para um controle de Web View incorporado usando um canal de interoperabilidade local. WebAssembly não é usado em aplicativos híbridos. Os aplicativos híbridos são criados com .NET Multi-platform App UI (.NET MAUI), que é uma estrutura multiplataforma para criar aplicativos móveis e de desktop nativos com C# e XAML.

O Blazor Hybrid oferece suporte a Windows Presentation Foundation (WPF) e Windows Forms para fazer a transição de aplicativos de tecnologia anterior para .NET MAUI.

Próximos passos

Blazor Tutorial - Crie a sua primeira aplicação BlazorASP.NET Core Blazor plataformas suportadas