Blazor, a framework that has caught my interest for a while now. Some people love it, some don't see a use for it. Myself? I see chances to experiment and find out for myself what I can do with it! I have messed around with Umbraco a lot this past year, just look at the sheer amount of blog posts that were Umbraco 8 & 9 related! Even with Blazor I have done some experimenting in the past, albeit Server-Side Blazor.
While looking for an excuse to experiment with Blazor WebAssembly, the amazing Umbraco community came up with some suggestions, and they have inspired me to experiment with Umbraco 9 & Blazor WebAssembly by creating a Starterkit! (Kind people including but not limited to CodeSharePaul & YodasMyDad!). What better way to experiment with new frameworks and technologies, than by creating a web-project on which I can freely test, break, innovate, and try new things on, right?
So that's what I did! Around a month ago I started creating a new Solution, consisting of a blank Umbraco 9 project, and a blank Blazor WebAssembly project, and started thinking "How can I merge these two projects together?"... And this is what came out so far!
While still being very far from being finished in any way, shape or form, I thought it would be a good idea to make the repository public early on, so that those who are interested can follow my progress as I go, learn new things, give me feedback, and even contribute if they wish to do so!
What's currently in it?
Currently, the project showcases some of the following concepts:
- An Umbraco9.Backoffice project used to run and maintain Umbraco and its Web API's
- An Umbraco9.Blazor project used as our (Headless) Blazor WebAssembly Client
- An Umbraco9.Core project used to be able to share Models between the Backoffice and the Client
- Using the Block List Editor to add components to our page(s)
- Using an UmbracoApiController to serialize our models to be used in our Client
- Examples of using Blazor components with Dependency Injection
- Models Builder for all our Umbraco Models
- Collections to store data (like FAQ's) outside of our Website Root nodes
- Tailwind CSS (Primarily used from the Tailwind Components, and other open-source locations)
- More to come...
And implements the following elements:
- Hero Element
- Paragraph Element
- Frequently Asked Questions Element
- More to come...
I hope I can inspire both you and others to delve deeper into the world of Umbraco 9 and Blazor, and I would love to hear what kind of cool projects you can think of with these technologies! Check out the repository here:
Disclaimer: This GitHub repository and all it's contents are made or implemented for experimental purpose only, for me to learn new concepts and inspire others. I would not (as of right now) recommend using this setup for any production environment, not any projects that you may end up depending on. Use at your own risk.
You've scrolled down this far? You've earned yourself a cookie! 🍪