Create Custom Elements with Blazor Webinar [Show Notes]

This blog provides the show notes for our February 3, 2022, webinar, “Create Blazor Custom Elements and 2021 Volume 4 Updates for Blazor and JavaScript.” The webinar was presented and hosted by Uma Maheswari Chandrabose, who taught the audience how to create Blazor custom elements. If you missed it, or would like to watch it again, you can find the recording on our YouTube page or following.

Overview

During this webinar, we took a look at how to build Blazor custom elements in a Blazor WebAssembly app. We saw how to add our Syncfusion Blazor components inside a Blazor custom element and render them from an Angular project template. We also looked at the new features added in the 2021 Vol. 4 release to our Blazor and Essential JS 2 components.

Agenda

• What’s new in Blazor for the 2021 Volume 4 release.
• What’s new for the web in the 2021 Volume 4 release.
• Build a Blazor custom element and use it with any web framework.

What’s New in Blazor for 2021 Volume 4

• .NET 6 support.
• Breadcrumb component moved from preview to production-ready.
• New Icon component moved from preview to production-ready.
• Signature control now has GUI to draw text or a signature digitally.
• DataGrid control allows you to select multiple rows or cells by dragging.
• Charts control features:
  • Grouping in a column chart.
  • Right-to-left charts.
  • Reversed legend.
  • Legend wrap.
• TreeGrid control has adaptive view support.
• Diagram control features:
  • Touch gestures.
  • Tooltip.
  • Print and export.
• Scheduler control features:
  • Custom month view.
  • Time zone display name.
  • Excel export customization.
  • Minimum event duration.
  • Spanned event.
• Rich Text Editor control now has Enter key customization.
• Tabs control as an active tab in the pop-up.
• Kanban control now has complex data-binding support.
• Gantt Chart control offers predecessor support for parent tasks.
• TextBox control has validation on key press.
• File Manager library now offers a sortable navigation pane.
• Word Processor control has Word 2013 justification.

What’s New for Essential JS 2 in 2021 Volume 4

• Breadcrumb component:
  • Moves from preview to production-ready.
  • New overflow modes.
• Charts component features:
  • Y-axis label rotation.
  • Grouping in a column chart.
  • Right-to-left charts.
  • Reversed legend.
• Maps component gains a LineString geometry type.
• Scheduler component features:
  • Custom month view.
  • Time zone display name.
  • Excel export customization.
  • Minimum event duration.
  • Spanning events.
• TreeGrid component offers adaptive view support.
• Tabs component has an active tab in the pop-up.
• Pivot Table component features:
  • Grand total placement.
  • Notification of UI actions.
• TreeView component now has text wrap support.

Build Blazor Custom Elements and Render Them Dynamically from Other Web Frameworks

Visual Studio Extensions

• Visual Studio extensions:
  • .NET 6.0 support added to the Blazor Template Studio, ASP.NET Core.
• VS Code extensions:
  • .NET 6.0 support added to the Blazor VS Code extension (Sync Blazor Project Template).
  • Angular and React templates updated to the latest Angular and React versions in the Syncfusion Web Template Studio Visual Studio Code extension.
• Sample editor:
  • VS 2022 and .NET 6.0 support provided for Syncfusion ASP.NET Core sample creator.
  • VS 2022 support for MVC sample creator.

Prerequisites to Work with Blazor Custom Elements

• .NET 6
• Latest version of Visual Studio 2022 with the required workloads.
• Reference: Blazor Custom elements demo on GitHub.

Summary

During this webinar, we took a look at how to build Blazor custom elements using Syncfusion Blazor components and render them from an Angular project template. We also looked at what’s new in the Essential Studio 2021 Volume 4 release for the Blazor and JS 2 suites. We hope you enjoyed this webinar and please keep an eye out for our future Blazor webinars.

Recommended resources (related links)

• Getting started with Syncfusion Blazor Components

Related blogs