HTMX voor ASP.NET Core-developers HTMX for ASP.NET Core Developers

In deze video laat JetBrains-developer advocate Khalid Abuhakmeh je kennismaken met HTMX. HTMX is een JavaScript-library die het plezier terugbrengt in het bouwen van robuuste client-side applicaties. HTMX gebruikt op de server gerenderde HTML om client-side ervaringen te maken, met een toegankelijke, declaratieve set attributen die alle HTTP-methoden ondersteunt die normaal niet beschikbaar zijn in traditionele HTML-formulieren. We lopen 15 stappen door voor het gebruik van HTMX. Van het installeren van de library in een bestaande ASP.NET Core-applicatie tot 13 voorbeelden waarin HTMX UI-ervaringen levert, van heel eenvoudig tot extreem complex. Tot slot bekijken we een voorbeeld "uit de praktijk" van HTMX in een webwinkel met winkelwagen. 0:00 HTMX voor ASP.NET Core-developers 0:03 Installatie 2:01 Hello World 6:02 State management 9:31 Trapsgewijze selects 16:34 Zoeken met typeahead 22:22 Infinite scrolling 26:02 Modale dialoogvensters 33:32 Server-side tabs 38:21 Sneltoetsen 40:04 Server-side formuliervalidatie 45:22 Long polling 49:09 Server-sent events 55:17 HTMX NuGet-packages voor ASP.NET Core 58:33 Client-side templates met HTMX, Mustache.js en ASP.NET Core 1:01:44 Out-of-band swaps 1:05:21 De demo van de JetSwag Store Alle code uit de video staat op https://github.com/khalidabuhakmeh/htmx-aspnetcore en je kunt de uitleg lezen en meevolgen op https://www.jetbrains.com/dotnet/guide/ Bekijk ook zeker JetBrains Rider op https://jetbrains.com/rider, dat in deze video als enige ontwikkelomgeving wordt gebruikt. Andere links: HTMX - https://htmx.org .NET - https://dot.net JetBrains - https://jetbrains.com Khalid Abuhakmeh - https://twitter.com/buhakmeh #htmx #csharp #dotnet

In this video, JetBrains developer advocate Khalid Abuhakmeh introduces you to HTMX. HTMX is a JavaScript library designed to bring the fun back into building robust client-side applications. HTMX relies on server-rendered HTML to create client-side experiences with an approachable declarative set of attributes that support all of the HTTP methods typically unavailable as part of traditional HTML forms. We’ll walk through 15 steps of using HTMX. From installing the library into an existing ASP.NET Core application to 13 examples of using HTMX to provide UI experiences from the simple to the extremely complex. Finally, we’ll look at a “real world” sample of HTMX in use in a shopping cart site. 0:00 HTMX for ASP.NET Core developers 0:03 Installation 2:01 Hello World 6:02 State Management 9:31 Cascading Selects 16:34 Typeahead Search 22:22 Infinite Scrolling 26:02 Modal dialogs 33:32 Server-side Tabs 38:21 Keyboard Shortcuts 40:04 Server-side Form Validation 45:22 Long Polling 49:09 Server-sent Events 55:17 HTMX NuGet Packages for ASP.NET Core 58:33 Client-side Templates with HTMX, Mustache.js, and ASP.NET Core 1:01:44 Out of Band Swaps 1:05:21 The JetSwag Store Demo All code shown in the video is available at https://github.com/khalidabuhakmeh/htmx-aspnetcore and you can read and follow along with the explanations at https://www.jetbrains.com/dotnet/guide/ Be sure to also check out JetBrains Rider at https://jetbrains.com/rider, which is used exclusively in this video as the development environment. Other links: HTMX - https://htmx.org .NET - https://dot.net JetBrains - https://jetbrains.com Khalid Abuhakmeh - https://twitter.com/buhakmeh #htmx #csharp #dotnet