JavaScript Interop in Blazor Applications
The JavaScript ecosystem is huge. This course teaches you how to use existing JavaScript libraries and JavaScript components in your Blazor applications.
What you'll learn
At the core of using JavaScript libraries and JavaScript components in your Blazor application is a thorough knowledge of JavaScript Interop. In this course, JavaScript Interop in Blazor Applications, you will learn the skills you need to work with JavaScript in your Blazor apps. First, you will learn how to invoke JavaScript functions from .NET and how to invoke .NET methods from JavaScript. Next, you will discover how to use JavaScript Interop to access browser APIs like the local storage. Finally, you will see how to wrap JavaScript components in .NET. You will also learn how to wrap the popular JavaScript data grid called ag-grid in a Blazor component. When you’re finished with this course, you’ll have a foundational knowledge of JavaScript Interop in Blazor that will help you as you move forward to use JavaScript libraries and components in your Blazor applications.
Table of contents
- Introduction 1m
- Add a JavaScript File to Your Blazor App 2m
- Create a JavaScript Function in the Global Scope 3m
- Call a JavaScript Function That Returns Void 5m
- Pass a .NET Object to a JavaScript Function 3m
- Call a JavaScript Function That Returns a Value 4m
- Get an Object as a Return Value 3m
- Pass an HTML Element Reference to a JavaScript Function 4m
- Understand JavaScript Interop in the Component Lifecycle 4m
- See Server Prerendering in Action 4m
- Use JavaScript Interop in the Component Lifecycle 6m
- Focus a Blazor Component via JavaScript 3m
- Handle JavaScript Errors in .NET 4m
- Invoke JavaScript Functions Synchronously 3m
- Work with JavaScript Modules 9m
- Summary 1m
- Introduction 1m
- Understand the Scenario to Use a Data Grid 1m
- Look at a JavaScript Sample That Uses the Ag-Grid 5m
- Create a BlazorAgGrid Component 3m
- Initialize the Wrapped JavaScript Component 3m
- Use the BlazorAgGrid in the Blazor App 3m
- Add a RowData Component Parameter 4m
- Support Multiple BlazorAgGrids on a Single Page 6m
- Implement IDisposable to Clean Up 4m
- Understand Server Prerendering and Disposing 4m
- Add an OnSelectionChanged Event 4m
- Use the OnSelectionChanged Event 3m
- Override the ShouldRender Method 4m
- Pass Column Definitions from .NET to JavaScript 5m
- Add an AutoGenerateColumns Component Parameter 3m
- Create a BlazorAgGridColumn Component 7m
- Summary 2m