ASP.NET Core Blazor

Bienvenue dans Blazor !

Blazor est une infrastructure web frontend .NET full-stack qui prend en charge à la fois le rendu côté serveur et l'interactivité client dans un modèle de programmation unique :

• Créez des interfaces utilisateur interactives enrichies à l’aide de C#.
• Partagez la logique d’application côté serveur et côté client écrite dans .NET.
• Affichez l’interface utilisateur en langage HTML et CSS pour une large prise en charge des navigateurs, y compris les navigateurs mobiles.
• Générez des applications de bureau et mobiles hybrides avec .NET et Blazor.

L’utilisation de .NET dans le développement web côté client offre les avantages suivants :

• Écrivez du code en C#, ce qui peut améliorer la productivité dans le développement et la maintenance des applications.
• Tirez parti de l’écosystème .NET existant des bibliothèques .NET.
• Bénéficiez des performances, de la fiabilité et de la sécurité de .NET.
• Restez productif sur Windows, Linux ou macOS avec un environnement de développement tel que Visual Studio ou Visual Studio Code. Effectuez des intégrations aux plateformes d’hébergement modernes, par exemple Docker.
• Développez avec un ensemble commun de langages, de frameworks et d’outils stables, riches en fonctionnalités et faciles à utiliser.

Remarque

Pour accéder à un tutoriel de démarrage rapide sur Blazor, consultez Générer votre première application Blazor.

Composants

Les applications Blazor sont basées sur des composants. Dans Blazor, un composant est un élément d’IU, par exemple une page, une boîte de dialogue ou un formulaire d’entrée de données.

Les composants sont des classes C# .NET intégrées dans des assemblys .NET qui :

• Définissent la logique de rendu de l’interface utilisateur flexible.
• Gèrent les événements de l’utilisateur.
• Peuvent être imbriqués et réutilisés.
• Peuvent être partagés et distribués en tant que bibliothèques de classes Razor ou en tant que packages NuGet.

La classe de composant est généralement écrite sous la forme d’une page de balises Razor avec l’extension de fichier .razor. Dans Blazor, les composants sont appelés officiellement composants Razor, et officieusement composants Blazor. Razor est une syntaxe qui combine des balises HTML à du code C# destiné à améliorer la productivité des développeurs. Razor vous permet de basculer entre les balises HTML et C# dans le même fichier avec la prise en charge de la programmation IntelliSense dans Visual Studio.

Blazor utilise des balises HTML naturelles pour la composition de l’IU. Les balises Razor suivantes illustrent un composant qui incrémente un compteur lorsque l’utilisateur sélectionne un bouton.

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

Les composants s’affichent dans une représentation en mémoire du modèle DOM (Document Object Model) du navigateur, appelée arborescence de rendu, qui permet de mettre à jour l’IU de manière flexible et efficace.

Créer une application web de pile complète avec Blazor

Les Blazor Web App fournissent une architecture basée sur des composants avec un rendu côté serveur et une interactivité complète côté client dans une seule solution, où vous pouvez basculer entre les modes de rendu côté serveur et côté client et même les mélanger dans la même page.

Les Blazor Web App peuvent fournir rapidement l’interface utilisateur au navigateur en rendant statiquement du contenu HTML à partir du serveur en réponse aux demandes. La page se charge rapidement car le rendu de l'interface utilisateur est effectué rapidement sur le serveur sans qu'il soit nécessaire de télécharger un gros pack JavaScript. Blazor peut également améliorer l’expérience utilisateur avec diverses améliorations progressives du rendu du serveur, telles que la navigation améliorée avec des billets de formulaire et le rendu en streaming de contenu généré de manière asynchrone.

Blazor prend en charge le rendu côté serveur interactif du serveur, où les interactions de l’interface utilisateur sont gérées à partir du serveur via une connexion en temps réel avec le navigateur. Le rendu côté serveur interactif permet une expérience utilisateur riche comme celle que l’on attendrait d’une application cliente, mais sans qu’il soit nécessaire de créer des points de terminaison d’API pour accéder aux ressources du serveur. Le contenu de page pour les pages interactives est prérendu, où le contenu sur le serveur est initialement généré et envoyé au client sans activer les gestionnaires d’événements pour les contrôles rendus. Le serveur génère l’interface utilisateur HTML de la page dès que possible en réponse à la demande initiale, ce qui rend l’application plus réactive pour les utilisateurs.

Les Blazor Web App prennent en charge l’interactivité avec le rendu côté client (CSR), qui s’appuie sur un runtime .NET créé avec WebAssembly que vous pouvez télécharger avec votre application. En exécutant Blazor sur WebAssembly, votre code .NET peut accéder à toutes les fonctionnalités du navigateur et inter-opérer avec JavaScript. Votre code .NET s’exécute dans le bac à sable de sécurité du navigateur avec les protections offertes par le bac à sable contre les actions malveillantes sur l’ordinateur client.

Les applications Blazor peuvent entièrement cibler l’exécution sur WebAssembly dans le navigateur sans l’implication d’un serveur. Pour une application Blazor WebAssembly autonome, les ressources sont déployées en tant que fichiers statiques sur un serveur web ou un service capable de fournir un contenu statique aux clients. Une fois téléchargées, les applications autonomes Blazor WebAssembly peuvent être mises en cache et exécutées hors connexion en tant qu’application web progressive (PWA).

Créer une application cliente native avec Blazor Hybrid

Blazor Hybrid permet d’utiliser des composants Razor dans une application cliente native avec un mélange de technologies natives et web pour les plateformes web, mobiles et de bureau. Le code s’exécute de manière native dans le processus .NET et affiche l’interface utilisateur web dans un contrôle Web View incorporé à l’aide d’un canal d’interopérabilité local. WebAssembly n’est pas utilisé dans les applications hybrides. Les applications hybrides sont construites avec .NET Multi-platform App UI (.NET MAUI), qui est une infrastructure multi-plateforme pour la création d’applications mobiles et de bureau natives en C# et XAML.

Le Blazor Hybrid prend en charge Windows Presentation Foundation (WPF) et Windows Forms pour assurer la transition des applications de la technologie antérieure vers .NET MAUI.

Étapes suivantes

BlazorTutoriel : créer votre première Blazor applicationASP.NET plateformes prises en charge par CoreBlazor