Jørgen Tonvang
Apr 2, 2020
  4207
(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
Opti ID overview

Opti ID allows you to log in once and switch between Optimizely products using Okta, Entra ID, or a local account. You can also manage all your use...

K Khan | Jul 26, 2024

Getting Started with Optimizely SaaS using Next.js Starter App - Extend a component - Part 3

This is the final part of our Optimizely SaaS CMS proof-of-concept (POC) blog series. In this post, we'll dive into extending a component within th...

Raghavendra Murthy | Jul 23, 2024 | Syndicated blog

Optimizely Graph – Faceting with Geta Categories

Overview As Optimizely Graph (and Content Cloud SaaS) makes its global debut, it is known that there are going to be some bugs and quirks. One of t...

Eric Markson | Jul 22, 2024 | Syndicated blog

Integration Bynder (DAM) with Optimizely

Bynder is a comprehensive digital asset management (DAM) platform that enables businesses to efficiently manage, store, organize, and share their...

Sanjay Kumar | Jul 22, 2024

Frontend Hosting for SaaS CMS Solutions

Introduction Now that CMS SaaS Core has gone into general availability, it is a good time to start discussing where to host the head. SaaS Core is...

Minesh Shah (Netcel) | Jul 20, 2024

Optimizely London Dev Meetup 11th July 2024

On 11th July 2024 in London Niteco and Netcel along with Optimizely ran the London Developer meetup. There was an great agenda of talks that we put...

Scott Reed | Jul 19, 2024