Jørgen Tonvang
Apr 2, 2020
  4274
(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
Integrating Optimizely DAM with Your Website

This article is the second in a series about integrating Optimizely DAM with websites. It discusses how to install the necessary package and code t...

Andrew Markham | Sep 28, 2024 | Syndicated blog

Opticon 2024 - highlights

I went to Opticon in Stockholm and here are my brief highlights based on the demos, presentations and roadmaps  Optimizely CMS SaaS will start to...

Daniel Ovaska | Sep 27, 2024

Required fields support in Optimizely Graph

It's been possible to have "required" properties (value must be entered) in the CMS for a long time. The required metadata haven't been reflected i...

Jonas Bergqvist | Sep 25, 2024

How to write a bespoke notification management system

Websites can be the perfect vehicle for notifying customers of important information quickly, whether it’s the latest offer, an operational message...

Nicole Drath | Sep 25, 2024

Optimizely DAM – An Introduction

I presented a talk about the Optimizely DAM at the OMVP summit during Opticon 2024 in Sweden. I have now converted that talk into two blog posts....

Andrew Markham | Sep 25, 2024 | Syndicated blog

Simple and Effective Personalization with Optimizely Data Platform (ODP)

As we dive into the amazing capabilities of Optimizely One, let’s shine a spotlight on the Optimizely Data Platform (ODP). This simple tool unifies...

Alex Harris - Perficient | Sep 24, 2024 | Syndicated blog