├── BlazorExample.Site ├── umbraco │ ├── models │ │ ├── ood.flag │ │ ├── Folder.generated.cs │ │ ├── File.generated.cs │ │ ├── UmbracoMediaAudio.generated.cs │ │ ├── UmbracoMediaVideo.generated.cs │ │ ├── UmbracoMediaArticle.generated.cs │ │ ├── UmbracoMediaVectorGraphics.generated.cs │ │ ├── Website.generated.cs │ │ ├── Image.generated.cs │ │ └── Member.generated.cs │ └── Data │ │ ├── Umbraco.mdf │ │ └── Umbraco_log.ldf ├── Tailwind │ └── styles.css ├── App_Plugins │ └── CustomPlugins │ │ ├── tailwindstyles.css │ │ ├── PropertyEditors │ │ ├── suggestionsexample.html │ │ └── suggestionsexample.js │ │ ├── Dashboards │ │ ├── lang │ │ │ └── en-US.xml │ │ ├── twitterdashboard.js │ │ └── twitterdashboard.html │ │ ├── package.manifest │ │ └── styles.min.css ├── tailwind.config.js ├── appsettings-schema.json ├── Views │ ├── Partials │ │ ├── grid │ │ │ ├── editors │ │ │ │ ├── embed.cshtml │ │ │ │ ├── rte.cshtml │ │ │ │ ├── macro.cshtml │ │ │ │ ├── textstring.cshtml │ │ │ │ ├── base.cshtml │ │ │ │ └── media.cshtml │ │ │ ├── bootstrap3-fluid.cshtml │ │ │ └── bootstrap3.cshtml │ │ ├── blockgrid │ │ │ ├── default.cshtml │ │ │ ├── areas.cshtml │ │ │ ├── area.cshtml │ │ │ └── items.cshtml │ │ └── blocklist │ │ │ └── default.cshtml │ ├── _ViewImports.cshtml │ └── Website.cshtml ├── tailwindcss-pluginconfig.js ├── package.json ├── Program.cs ├── Properties │ └── launchSettings.json ├── appsettings.json ├── Controllers │ └── Api │ │ ├── UtilitiesApiController.cs │ │ └── TwitterApiController.cs ├── Startup.cs ├── BlazorExample.Site.csproj ├── .gitignore ├── wwwroot │ └── css │ │ └── styles.css └── package-lock.json ├── package.json ├── .idea └── .idea.BlazorExample │ └── .idea │ ├── encodings.xml │ ├── vcs.xml │ ├── indexLayout.xml │ ├── misc.xml │ └── .gitignore ├── .gitignore ├── BlazorExample.Shared ├── Extensions │ └── StringExtensions.cs ├── BlazorExample.Shared.csproj ├── Comparers │ └── TweetComparer.cs └── Models │ └── Config │ └── BlazorExampleAppSettings.cs ├── BlazorExample.Components ├── Components │ ├── PropertyEditors │ │ ├── SuggestionsExample.razor │ │ └── SuggestionsExample.razor.cs │ ├── GetUmbracoData.razor │ ├── Icons │ │ └── AnimatedSpinner.razor │ ├── GetUmbracoData.razor.cs │ └── Dashboards │ │ ├── LatestUmbracoTweets.razor │ │ └── LatestUmbracoTweets.razor.cs ├── _Imports.razor ├── Program.cs ├── Properties │ └── launchSettings.json └── BlazorExample.Components.csproj ├── BlazorExample.Tests ├── StringTests.cs └── BlazorExample.Tests.csproj ├── BlazorExample.sln └── ReadMe.md /BlazorExample.Site/umbraco/models/ood.flag: -------------------------------------------------------------------------------- 1 | THIS FILE INDICATES THAT MODELS ARE OUT-OF-DATE 2 | 3 | -------------------------------------------------------------------------------- /BlazorExample.Site/Tailwind/styles.css: -------------------------------------------------------------------------------- 1 | @tailwind base; 2 | @tailwind components; 3 | @tailwind utilities; -------------------------------------------------------------------------------- /BlazorExample.Site/App_Plugins/CustomPlugins/tailwindstyles.css: -------------------------------------------------------------------------------- 1 | @tailwind base; 2 | @tailwind components; 3 | @tailwind utilities; -------------------------------------------------------------------------------- /BlazorExample.Site/umbraco/Data/Umbraco.mdf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/YodasMyDad/UmbracoBlazor/HEAD/BlazorExample.Site/umbraco/Data/Umbraco.mdf -------------------------------------------------------------------------------- /BlazorExample.Site/umbraco/Data/Umbraco_log.ldf: -------------------------------------------------------------------------------- https://raw.githubusercontent.com/YodasMyDad/UmbracoBlazor/HEAD/BlazorExample.Site/umbraco/Data/Umbraco_log.ldf -------------------------------------------------------------------------------- /BlazorExample.Site/App_Plugins/CustomPlugins/PropertyEditors/suggestionsexample.html: -------------------------------------------------------------------------------- 1 |
This property editor is a Blazor component
3 |@_suggestionValue
4 | 5 |@Text
3 |Click the button below to get the name of the root node in the backoffice.
4 |5 | 8 |
9 |@((MarkupString)WebsiteContent)
10 |@ex.ToString()11 | } 12 | 13 | @functions{ 14 | 15 | public static string EditorView(dynamic contentItem) 16 | { 17 | string view = contentItem.editor.render != null ? contentItem.editor.render.ToString() : contentItem.editor.view.ToString(); 18 | view = view.ToLower().Replace(".html", ".cshtml"); 19 | 20 | if (!view.Contains("/")) 21 | { 22 | view = "grid/editors/" + view; 23 | } 24 | 25 | return view; 26 | } 27 | 28 | } -------------------------------------------------------------------------------- /BlazorExample.Components/Program.cs: -------------------------------------------------------------------------------- 1 | using Microsoft.AspNetCore.Components.Web; 2 | using Microsoft.AspNetCore.Components.WebAssembly.Hosting; 3 | using BlazorExample.Components.Components; 4 | using BlazorExample.Components.Components.Dashboards; 5 | using BlazorExample.Components.Components.PropertyEditors; 6 | 7 | var builder = WebAssemblyHostBuilder.CreateDefault(args); 8 | builder.Services.AddScoped(sp => new HttpClient { BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) }); 9 | builder.RootComponents.RegisterCustomElement
This is a Blazor component, showing the latest tweets with the hashtag #umbraco. Refreshes every 10 seconds
5 |Looks like you haven't added the Twitter API credentials in the appsettings.json.
26 |You will need to create a Twitter App via https://developer.twitter.com/en/portal/projects-and-apps
27 |
27 | Could not render component of type: @(item.Content.ContentType.Alias)
28 |
29 | This likely happened because the partial view @partialViewName could not be found.
30 |
@Model.value.caption
62 | } 63 | } -------------------------------------------------------------------------------- /BlazorExample.Site/umbraco/models/Folder.generated.cs: -------------------------------------------------------------------------------- 1 | //------------------------------------------------------------------------------ 2 | //Example Umbraco 9 site showing the following features:
26 |33 | Blazor in the back office, running in dashboards. Project structure shows setup of how to get Blazor WASM hosted in same site as Umbraco 34 |
35 |42 | Tailwind Css running in the front end and also using Tailwind Css for the Umbraco backoffice dashboard. Using prefixes so it doesn't clash with the umbraco styles. 43 |
44 |Please make sure you read the ReadMe file which outlines the current issues with Blazor. The back office login details are
47 |admin@admin.com
48 |1234567890
49 |