Blazor Server App with .NET 6 and Syncfusion UI Components – Full Course

Опубликовано: 17 Сентябрь 2024
на канале: freeCodeCamp.org

69k

Learn how to harness the power of the Syncfusion UI components from within a Blazor server application. We’ll also integrate the Microsoft Identity technology into our Blazor application to leverage login, registration, authorization and authentication functionality. Syncfusion provides a UI component suite for building powerful web, desktop, and mobile apps.

️ Gavin Lon created this course.

Free Syncfusion Community License:

Code for full application:

️ Syncfusion Components Integrated into the Sales Management Application ️
DataGrid:
Spinner:
ListView:
ComboBox:
Toast:
Charts:
Dashboard Layout:
Diagram:
Scheduler:

️ Copy Code from Syncfusion Demo Documentation ️
Toast:
Dashboards - Copy Layout code:
Diagram - Employee Hierarchy:
Scheduler:

️ Copy Code from GitHub ️
Copy EmployeeModel class and Employee List Data to wire up to the Syncfusion DataGrid:
Add Employee Data:
Add Product Data:
Add Client Data:
Register Employee Details with Identity System:
Copy Chart Code for Sales Manager’s Dashboard from GitHub:
Download Images (Profile Pictures for Employees and Product Images):
SalesOrderReport.cs:
OrderService.cs:
Add Logo Image and Styling (to help during the creation of the Sales Management Application):

️ Styling the Syncfusion ListView Component ️
Customizing Templates:
Css structure:

️ Software ️
Visual Studio 2022 for Windows Community edition:
SQL Server 2019:

️ Course Contents ️
⌨️ (0:00:13) Introduction
⌨️ (0:00:49) Course Overview
⌨️ (0:10:25) Technologies used to Develop the Sales Management Application
⌨️ (0:13:20) Getting Started - Create the Blazor Project through Visual Studio 2022
⌨️ (0:15:02) Introduction to the Syncfusion DataGrid Component
⌨️ (0:43:39) Create the Database using Ef Core Code First Migrations
⌨️ (1:22:02) Integrate the Syncfusion DataGrid Component into the Application
⌨️ (3:02:44) Integrate the Syncfusion ListView component into the Sale Management Application
⌨️ (4:25:23) Integration of the Syncfusion Charts into the Sales Management Application to Display Sales Order Analytical Data
⌨️ (5:11:04) Create Dashboards for Employees
⌨️ (6:03:51) Integrate the Syncfusion Diagram into the Sales Management Application
⌨️ (6:22:25) Integrate the Syncfusion Scheduler into the Sales Management Application
⌨️ (6:52:53) Integrate Microsoft Identity into the Sales Management Application
⌨️ (7:40:34) Wrapping up