A simple starter site for Umbraco v9, making use of Blazor WebAssembly with Tailwind CSS/UI. A project that I use to play around and experiment with Umbraco 9, Blazor WebAssembly, TailwindCSS, the Block List Editor, and several other concepts!
Hopefully this site can inspire others to delve deeper into the world of Umbraco9 and Blazor, by showcasing 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
- Server Side Rendering Blazor for SEO purpose
- Models Builder for all our Umbraco Models
- Collections to store data (like FAQ's) outside of our Website Root nodes
- Displaying Charts using Chart.js with Umbraco configurable Data & Chart types
- Talwind CSS (Primarily used from the Tailwind Components and other open-source locations)
- More to come...
Just clone the site to your local machine, restore the nuget packages, build, and run both the Backoffice & Blazor project (in that order)!
The admin login credentials for the Backoffice are as follows:
[email protected]
1234567890
The list of currently added elements will expand as time passes. The current elements that are implemented and are shown below are as follows (in order):
- Hero Element
- Paragraph Element
- Frequently Asked Questions Element
- Testimonials Element
- Chart Element
To be added in the future!
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent