--- title: Best Blazor posts of 2024 | daily.dev description: The most upvoted Blazor posts of 2024, curated by the daily.dev community. canonical: https://daily.dev/tags/blazor/best-of/2024 twitter:card: summary_large_image twitter:site: @dailydotdev og:url: https://daily.dev/tags/blazor/best-of/2024 og:type: website og:site_name: daily.dev og:title: Best Blazor posts of 2024 | daily.dev og:description: The most upvoted Blazor posts of 2024, curated by the daily.dev community. og:image: https://media.daily.dev/image/upload/s--VAY5ToZt--/f_auto/v1724209435/public/daily.dev%20-%20open%20graph --- # Best of Blazor — 2024 1. 1 [](/posts/authentication-and-authorization-enhancements-in-net-9-0-zadhkrhqz "Authentication and Authorization Enhancements in .NET 9.0") Article Auth0 · 2y Authentication and Authorization Enhancements in .NET 9.0 NET 9 includes various enhancements for authentication and authorization, focusing on cloud-native development and performance. Key features include support for Pushed Authorization Requests (PAR) to enhance security in OAuth 2.0 and OpenID Connect environments, simplified methods for adding custom OAuth/OIDC parameters, configuration flags for Windows Authentication under HTTP.sys, and methods to serialize authentication states in Blazor Web Apps. These updates aim to simplify developers' tasks, improve security, and reduce potential bugs. 47 2. 2 [](/posts/i-hate-javascript-thank-you-blazor-l22jmnzuz "I Hate JavaScript, Thank You Blazor") Article Medium · 3y I Hate JavaScript, Thank You Blazor Blazor has addressed the frustrations with JavaScript by providing a component-based architecture, seamless code sharing between server and client, and the advantages of C# and compile-time error checking. 38 15 3. 3 [](/posts/get-ready-for-net-conf-2024--nqts5jera "Get Ready for .NET Conf 2024!") Article ASP.NET Blog · 2y Get Ready for .NET Conf 2024! Get ready for .NET Conf 2024, a free three-day virtual conference from November 12-14, showcasing the latest in .NET. Highlights include the release of .NET 9, specialized sessions from global experts, continuous broadcasts, and exclusive digital swag. Don't miss live presentations by the .NET team and the chance to win valuable prizes. 23 1 4. 4 [](/posts/the-free-way-to-create-awesome-pdfs-in-net-s50pfne75 "The Free Way to Create Awesome PDFs in .NET") Video Nick Chapsas · 2y The Free Way to Create Awesome PDFs in .NET Learn how to generate PDFs in .NET for free without relying on paid libraries. This method uses HTML and Playwright to create flexible, componentized PDFs, suitable for most use cases. By leveraging Razor components and avoiding the need for libraries like iron PDF or quest PDF, this approach ensures cost-effectiveness and versatility, especially for generating invoices or similar documents. 21 5. 5 [](/posts/net-announcements-updates-from-microsoft-build-2024-zfdawfjei ".NET Announcements & Updates from Microsoft Build 2024") Article .NET Blog · 2y .NET Announcements & Updates from Microsoft Build 2024 Microsoft Build 2024 announced new features and tools to make .NET development faster and easier. The updates include improvements in AI development with .NET, new features in .NET 9 for cloud-native development, enhancements in web development with ASP.NET Core and Blazor, and improvements in multi-platform development with .NET MAUI. 19 6. 6 [](/posts/learn-to-build-your-first-blazor-hybrid-app--2jf4iaehr "Learn to Build Your First Blazor Hybrid App!") Article DevBlogs · 2y Learn to Build Your First Blazor Hybrid App! The official Blazor Hybrid workshop teaches the basics of building a cross-platform app using Blazor Hybrid, featuring step-by-step instructions for creating the MonkeyFinder app. It covers project structure, data loading, third-party libraries, platform functionalities, theming, and combining Blazor with .NET MAUI native pages. It's suitable for both self-paced learning and teaching others, with resources including code, slides, and extensive instructions. A full 4-hour course by Gerald is also available on YouTube. 18 7. 7 [](/posts/asp-net-core-updates-in-net-9-preview-2-blazor-oidc-oauth-and-configuring-http-sys-s6fdj4nfr "ASP.NET Core Updates in .NET 9 Preview 2: Blazor, OIDC, OAuth and Configuring HTTP.sys") Article InfoQ · 3y ASP.NET Core Updates in .NET 9 Preview 2: Blazor, OIDC, OAuth and Configuring HTTP.sys ASP.NET Core in .NET 9 Preview 2 brings updates including Blazor component constructor injection, WebSocket compression for Blazor interactive server components, customizing OAuth and OIDC authorization parameters, and configuring HTTP.sys extended authentication flags. 17 8. 8 [](/posts/how-use-a-blazor-quickgrid-with-graphql-4wcimfn3q "How use a Blazor QuickGrid with GraphQL") Article ASP.NET Blog · 2y How use a Blazor QuickGrid with GraphQL Learn how to integrate a Blazor QuickGrid component with a GraphQL data source using Strawberry Shake. The post details steps to set up the project, create a GraphQL client, and employ the QuickGrid's virtualization feature for optimal performance. It also includes customization tips and how to modify GraphQL queries for pagination. 14 9. 9 [](/posts/showing-blog-articles-in-blazor-with-graphql-1rrqnbgoy "Showing Blog Articles in Blazor with GraphQL") Article Community Picks · 2y Showing Blog Articles in Blazor with GraphQL Learn how to display blog articles from a Hashnode headless blog in a Blazor site using GraphQL. The process involves setting up your Blazor project, activating Hashnode's headless feature, installing the necessary GraphQL client libraries, creating proper models and services, and setting up dependency injection. Finally, a Blazor component is created to display the articles formatted using Bootstrap CSS. 13 1 10. 10 [](/posts/i-confronted-microsoft-about-blazor-s-future-axffaswls "I Confronted Microsoft About Blazor's Future") Video Nick Chapsas · 2y I Confronted Microsoft About Blazor's Future Nick holds an extensive discussion with Dan Roth, the principal program manager for Blazor at Microsoft, addressing various aspects of Blazor's future. They talk about challenges, the impact of .NET 9 release, and the adoption of Blazor both inside and outside Microsoft. The conversation touches on issues like the annual release cadence for .NET, the comparison between short-term support (STS) and long-term support (LTS) versions, and the misconceptions about Blazor's stability. They also highlight the growth and usage of Blazor in different organizations and internal tools within Microsoft. 11 11. 11 [](/posts/blazor-basics-styling-blazor-components-with-css-lljf9yz17 "Blazor Basics: Styling Blazor Components with CSS") Article Telerik · 2y Blazor Basics: Styling Blazor Components with CSS Learn how CSS support works in Blazor and how CSS isolation addresses common web development problems. Blazor supports standard CSS properties and allows the use of third-party CSS frameworks like Bootstrap and Tailwind CSS. CSS isolation in Blazor enables defining CSS classes specific to Blazor components, preventing global CSS clashes. It also uses a unique identifier to apply styles locally within the component. While Sass and Less are not supported out-of-the-box, they can be implemented using pre-build tasks or third-party packages. 12 12. 12 [](/posts/top-net-videos-live-streams-of-2024-w3zy6brej "Top .NET Videos & Live Streams of 2024") Article ASP.NET Blog · 2y Top .NET Videos & Live Streams of 2024 2024 saw significant engagement with .NET content through the .NET YouTube channel, featuring over 260 new videos and 150 live streams, covering topics like async/await, ASP.NET Core, .NET Aspire, and Blazor. Key events included .NET Conf 2024, which launched .NET 9, and other dedicated streams focusing on AI development and Azure integration. Popular series included Deep .NET by Scott Hanselman and Stephen Toub, and the Let’s Learn .NET live stream series. 11 13. 13 [](/posts/blazor-basics-calling-net-from-javascript-vghmpdysi "Blazor Basics: Calling .NET from JavaScript") Article Telerik · 2y Blazor Basics: Calling .NET from JavaScript Learn how to call .NET methods from JavaScript in Blazor applications, both Blazor Server and Blazor WebAssembly. The post demonstrates the process through the implementation of a simple chat application where messages are managed via JavaScript and integrated into a Blazor component. Key topics covered include the use of the IJSRuntime interface, JSInvokable attribute, and implementing the Dispose method for efficient resource management. 11 14. 14 [](/posts/blazor-basics-blazor-javascript-interop-calling-javascript-from-net-b24rlqiav "Blazor Basics: Blazor JavaScript Interop—Calling JavaScript from .NET") Article Telerik · 2y Blazor Basics: Blazor JavaScript Interop—Calling JavaScript from .NET Learn how to integrate JavaScript code and libraries into a Blazor web application using ASP.NET Core Blazor JavaScript interoperability. The post demonstrates various levels of JavaScript integration into Blazor, explaining how to call JavaScript functions from .NET code and use their return values. It also covers the integration of a JavaScript library like Chart.js to create dynamic charts within Blazor applications, providing code examples and best practices for seamless integration and debugging. 11 15. 15 [](/posts/the-blazor-competitor-is-here--la1pxauuo "The Blazor Competitor is Here!") Video Nick Chapsas · 2y The Blazor Competitor is Here! Hydro is introduced as a competitor to Blazor, offering a simpler yet powerful way to create reactive applications in .NET. The post explores the features and benefits of Hydro and showcases a sample application using Hydro components. 11 16. 16 [](/posts/latest-net-9-previews-bring-long-awaited-blazor-improvements-l3tfvoi1x "Latest .NET 9 Previews Bring Long-Awaited Blazor Improvements") Article Telerik · 2y Latest .NET 9 Previews Bring Long-Awaited Blazor Improvements The latest .NET 9 previews introduce significant improvements to Blazor, focusing on better error handling for lost Blazor Server connections, a new API for handling static web assets, and easier serialization/deserialization of AuthenticationState. These updates make Blazor more robust and user-friendly, particularly in handling static assets and managing network issues. .NET 9 is scheduled for release in November 2024. 10 17. 17 [](/posts/how-to-cancel-an-http-request-on-leaving-a-blazor-component-p6nnkibbc "How to Cancel an HTTP Request on Leaving a Blazor Component") Article Code Maze · 2y How to Cancel an HTTP Request on Leaving a Blazor Component The post explains how to cancel an HTTP request within a Blazor component when a user navigates away. It covers setting up a Blazor project using the new .NET 8 Blazor Web App template, implementing backend API endpoints, and utilizing cancellation tokens to abort requests. The example uses the Weather component, showcasing both client-side and server-side setups. A complete setup for disposing of a CancellationTokenSource is provided, ensuring HTTP requests are cancelled properly. 10 18. 18 [](/posts/building-a-full-stack-application-with-blazor-and-cqrs-backend-development-part-1--oiwybsed6 "Building a Full-Stack Application with Blazor and CQRS: Backend Development (Part 1)") Article ITNEXT · 2y Building a Full-Stack Application with Blazor and CQRS: Backend Development (Part 1) This post discusses the development of a full-stack web application using Blazor and CQRS. It covers the purpose of using Blazor, the benefits of using CQRS, and the project structure based on Clean Architecture principles. 10 19. 19 [](/posts/blazor-basics-9-best-practices-for-building-blazor-web-apps-7jtikzokp "Blazor Basics: 9 Best Practices for Building Blazor Web Apps") Article Telerik · 2y Blazor Basics: 9 Best Practices for Building Blazor Web Apps Learn nine best practices for building Blazor web applications, including understanding component lifecycle, splitting components, render mode agnosticism, event callbacks, state management techniques, code organization, web security best practices, and keeping it simple. 10 20. 20 [](/posts/create-responsive-web-designs-like-a-pro-with-blazor-media-query-rduximbru "Create Responsive Web Designs Like a Pro with Blazor Media Query") Article Syncfusion · 3y Create Responsive Web Designs Like a Pro with Blazor Media Query Learn how to create responsive web designs using the Syncfusion Blazor Media Query component. Discover its key features, such as predefined media breakpoints, customization options, and integration with other components. 10 [See all Blazor archives](/tags/blazor/best-of) ```json {"@context":"https://schema.org","@graph":[{"@type":"Organization","@id":"https://daily.dev/#organization","name":"daily.dev","url":"https://daily.dev","logo":{"@type":"ImageObject","url":"https://daily.dev/apple-touch-icon.png","width":180,"height":180},"sameAs":["https://twitter.com/dailydotdev","https://github.com/dailydotdev","https://www.linkedin.com/company/daily-dev-ltd"]},{"@type":"WebSite","@id":"https://daily.dev/#website","url":"https://daily.dev","name":"daily.dev","publisher":{"@id":"https://daily.dev/#organization"},"potentialAction":{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https://daily.dev/search?q={search_term_string}"},"query-input":"required name=search_term_string"}}]} {"@context":"https://schema.org","@graph":[{"@type":"CollectionPage","@id":"https://daily.dev/tags/blazor/best-of/2024#page","url":"https://daily.dev/tags/blazor/best-of/2024","name":"Best Blazor Posts of 2024","description":"The most upvoted Blazor posts of 2024, curated by the daily.dev community.","isPartOf":{"@type":"WebSite","url":"https://daily.dev"}},{"@type":"ItemList","@id":"https://daily.dev/tags/blazor/best-of/2024#items","numberOfItems":20,"itemListElement":[{"@type":"ListItem","position":1,"url":"https://daily.dev/posts/authentication-and-authorization-enhancements-in-net-9-0-zadhkrhqz","name":"Authentication and Authorization Enhancements in .NET 9.0"},{"@type":"ListItem","position":2,"url":"https://daily.dev/posts/i-hate-javascript-thank-you-blazor-l22jmnzuz","name":"I Hate JavaScript, Thank You Blazor"},{"@type":"ListItem","position":3,"url":"https://daily.dev/posts/get-ready-for-net-conf-2024--nqts5jera","name":"Get Ready for .NET Conf 2024!"},{"@type":"ListItem","position":4,"url":"https://daily.dev/posts/the-free-way-to-create-awesome-pdfs-in-net-s50pfne75","name":"The Free Way to Create Awesome PDFs in .NET"},{"@type":"ListItem","position":5,"url":"https://daily.dev/posts/net-announcements-updates-from-microsoft-build-2024-zfdawfjei","name":".NET Announcements & Updates from Microsoft Build 2024"},{"@type":"ListItem","position":6,"url":"https://daily.dev/posts/learn-to-build-your-first-blazor-hybrid-app--2jf4iaehr","name":"Learn to Build Your First Blazor Hybrid App!"},{"@type":"ListItem","position":7,"url":"https://daily.dev/posts/asp-net-core-updates-in-net-9-preview-2-blazor-oidc-oauth-and-configuring-http-sys-s6fdj4nfr","name":"ASP.NET Core Updates in .NET 9 Preview 2: Blazor, OIDC, OAuth and Configuring HTTP.sys"},{"@type":"ListItem","position":8,"url":"https://daily.dev/posts/how-use-a-blazor-quickgrid-with-graphql-4wcimfn3q","name":"How use a Blazor QuickGrid with GraphQL"},{"@type":"ListItem","position":9,"url":"https://daily.dev/posts/showing-blog-articles-in-blazor-with-graphql-1rrqnbgoy","name":"Showing Blog Articles in Blazor with GraphQL"},{"@type":"ListItem","position":10,"url":"https://daily.dev/posts/i-confronted-microsoft-about-blazor-s-future-axffaswls","name":"I Confronted Microsoft About Blazor's Future"},{"@type":"ListItem","position":11,"url":"https://daily.dev/posts/blazor-basics-styling-blazor-components-with-css-lljf9yz17","name":"Blazor Basics: Styling Blazor Components with CSS"},{"@type":"ListItem","position":12,"url":"https://daily.dev/posts/top-net-videos-live-streams-of-2024-w3zy6brej","name":"Top .NET Videos & Live Streams of 2024"},{"@type":"ListItem","position":13,"url":"https://daily.dev/posts/blazor-basics-calling-net-from-javascript-vghmpdysi","name":"Blazor Basics: Calling .NET from JavaScript"},{"@type":"ListItem","position":14,"url":"https://daily.dev/posts/blazor-basics-blazor-javascript-interop-calling-javascript-from-net-b24rlqiav","name":"Blazor Basics: Blazor JavaScript Interop—Calling JavaScript from .NET"},{"@type":"ListItem","position":15,"url":"https://daily.dev/posts/the-blazor-competitor-is-here--la1pxauuo","name":"The Blazor Competitor is Here!"},{"@type":"ListItem","position":16,"url":"https://daily.dev/posts/latest-net-9-previews-bring-long-awaited-blazor-improvements-l3tfvoi1x","name":"Latest .NET 9 Previews Bring Long-Awaited Blazor Improvements"},{"@type":"ListItem","position":17,"url":"https://daily.dev/posts/how-to-cancel-an-http-request-on-leaving-a-blazor-component-p6nnkibbc","name":"How to Cancel an HTTP Request on Leaving a Blazor Component"},{"@type":"ListItem","position":18,"url":"https://daily.dev/posts/building-a-full-stack-application-with-blazor-and-cqrs-backend-development-part-1--oiwybsed6","name":"Building a Full-Stack Application with Blazor and CQRS: Backend Development (Part 1)"},{"@type":"ListItem","position":19,"url":"https://daily.dev/posts/blazor-basics-9-best-practices-for-building-blazor-web-apps-7jtikzokp","name":"Blazor Basics: 9 Best Practices for Building Blazor Web Apps"},{"@type":"ListItem","position":20,"url":"https://daily.dev/posts/create-responsive-web-designs-like-a-pro-with-blazor-media-query-rduximbru","name":"Create Responsive Web Designs Like a Pro with Blazor Media Query"}]},{"@type":"BreadcrumbList","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https://daily.dev"},{"@type":"ListItem","position":2,"name":"Tags","item":"https://daily.dev/tags"},{"@type":"ListItem","position":3,"name":"Blazor","item":"https://daily.dev/tags/blazor"},{"@type":"ListItem","position":4,"name":"Best of","item":"https://daily.dev/tags/blazor/best-of"},{"@type":"ListItem","position":5,"name":"2024"}]}]} ```