Jørgen Tonvang
Apr 2, 2020
  3178
(7 votes)

MusicFestival Blazor WebAssembly site!

While we're waiting for the official .NET Core support for Episerver to come out (my beta invite must have been lost in the e-mail), I've ported the excellent MusicFestival SPA to run on Blazor WebAssembly - so you can have SPA templates running purely on .NET Core and Blazor with Episerver CMS today.

What is Blazor and why should you care?

Blazor is a free and open source web framework from Microsoft that allows us to create rich and interactive front-ends using C# and .NET Core. The application is compiled to WebAssembly and served by the browser. 

This enables us to create a dynamic front-end totally independent of Javascript, which means you can say good bye to the ever changing chaos of Babel, Webpack, Linters and the several billion files in your node_modules folder. 

I can't speak for all developers, obviously, but after working with AngularJS, ReactJS and Vue the past 6-7 years - the simplicity of Blazor is very refreshing. While it is still in preview and parts of it are a little rough around the edges, it gets new releases frequently and Microsoft definitely puts a lot of effort into it. 

How does it work with Episerver?

Since Blazor requires .NET Core, the application needs to have it's own project - but the compiled WebAssembly-application can be hosted anywhere. 

For this site, I've set it up so that the Blazor application is published to a subfolder on the Episerver site whenever the project is built. Then there are URL-rewrite rules in place that rewrites all requests to the subdirectory, with exceptions for requests to Content Delivery API and the Episerver-interface. 

Blazor's built in router doesn't support loading components dynamically from routes that are unknown at compile time, so I made a custom router for this that replaces the default. 

I'll make another blog post or two covering the specifics of working with Episerver and Blazor, but until then, please check it out on Github:

https://github.com/jtonvang/musicfestival-blazor

Apr 02, 2020

Comments

valdis
valdis Apr 2, 2020 03:01 PM

very interesting! :) thanks for efforts putting this together

MartinOttosen
MartinOttosen Apr 8, 2020 08:54 AM

Nice work! I've sent you an email to verify we have the correct contact details for the beta, if nothing comes through, please ping me at first.last@epi

Please login to comment.
Latest blogs
Customizing Property Lists in Optimizely CMS

Generic property lists is a cool editorial feature that has gained a lot of popularity - in spite of still being unsupported (officially). But if y...

Allan Thraen | Oct 2, 2022 | Syndicated blog

Content Delivery API – The Case of the Duplicate API Refresh Token

Creating a custom refresh provider to resolve the issues with duplicate tokens in the DXC The post Content Delivery API – The Case of the Duplicate...

David Lewis | Sep 29, 2022 | Syndicated blog

New Optimizely certifications - register for beta testing before November 1st

In January 2023, Optimizely is making updates to the current versions of our certification exams to make sure that each exam covers the necessary...

Jamilia Buzurukova | Sep 28, 2022

Optimizely community meetup - Sept 29 (virtual + Melbourne)

Super excited to be presenting this Thursday the 29th of September at the Optimizely community meetup. For the full details and RSVP's see the...

Ynze | Sep 27, 2022 | Syndicated blog

Preview multiple Visitor Groups directly while browsing your Optimizely site

Visitor groups are great - it's an easy way to add personalization towards market segments to your site. But it does come with it's own set of...

Allan Thraen | Sep 26, 2022 | Syndicated blog

The Report Center is finally back in Optimizely CMS 12

With Episerver.CMS.UI 12.12.0 the Report Center is finally re-introduced in the core product.

Tomas Hensrud Gulla | Sep 26, 2022 | Syndicated blog