ASP.NET Core Tag Helpers Video Tutorial: Getting Started with Telerik Tag Helpers

In this series of videos, get introduced to ASP.NET Core Tag Helpers and learn how you can use them to build better real-world applications with the help of Telerik UI for ASP.NET Core.

This instructional video series is a hands-on demo of ASP.NET Core Tag Helpers with the help of Telerik UI for ASP.NET Core. Learn the basics of working with Tag Helpers by building a fully functional app using multiple UI components (grid, chart, date picker and more). The course is guided by industry pros: Scott Addie, Sr. Content Developer for Microsoft, and Ed Charbeneau, three-time Microsoft MVP.

What are ASP.NET Core Tag Helpers

To really understand how ASP.NET Core Tag Helpers can make you more productive we’ll begin with an introduction to the basics of Tag Helpers. In this video we’ll learn why Tag Helpers were added in ASP.NET Core and how they improve the readability of our markup through better IntelliSense and easier context switching.

Useful Links

• Tag Helpers in ASP.NET Core

Let’s Build an App

In the Tag Helper video series we’ll learn how to build the Team Efficiency Dashboard, a single page, responsive web application. The application uses date picker, responsive panel, chart, grid and tree view Tag Helpers to create an interactive reporting experience. In this video we’ll take a look at the completed app we’ll be building.

Useful Links

• Telerik UI Documentation
• Start a free 30 day trial of Telerik UI for ASP.NET Core
• Telerik UI for ASP.NET Core Tag Helpers
• Completed Dashboard Application

Introducing Telerik UI for ASP.NET Core: Tag Helpers

ASP.NET Core comes with a handful of Tag Helpers, just a fraction of what is needed to build a real-world application. For a complete toolbox of components the Telerik UI for ASP.NET Core features over 60 Tag Helpers. In this video we discuss the features of Telerik UI for ASP.NET Core and how to install, where to find documentation and get a free trial.

Useful Links

• Telerik UI Documentation
• Start a free 30 day trial of Telerik UI for ASP.NET Core
• Telerik UI for ASP.NET Core Tag Helpers
• Telerik Theme Builder

Let’s Start with a Prototype

In this video we discuss the prototype application which we will transform over the course of the video series into a fully functional application. The prototype application is a simple bootstrap layout with placeholder elements which will be replaced with Telerik UI for ASP.NET Core Tag Helpers.

Useful Links

• Telerik UI Documentation
• Start a free 30 day trial of Telerik UI for ASP.NET Core
• Telerik UI for ASP.NET Core Tag Helpers
• Prototype Dashboard Application on GitHub

Form Basics: Label and Date Picker Tag Helpers

Scott Addie introduces us to the ASP.NET Core Label Tag Helper and the Telerik Date Picker Tag Helper. This introduction shows how to write markup using Tag Helpers and discusses the advantages of the generated UI.

Useful Links

• Label Tag Helper
• Date Picker Tag Helper

Using the Tree View Tag Helper to Master Hierarchical Data

Microsoft MVP Ed Charbeneau shows us how to use the Telerik ASP.NET Core Tree View Tag Helper. The Tree View Tag Helper is a UI component that can be data bound naturally to hierarchical data sources.

Useful Links

• Tree View Tag Helper

Refactoring with the ASP.NET Core 2.1 Partial Tag Helper

In this video we learn how to refactor application view code with the Partial Tag Helper. The Partial Tag Helper is a new feature in ASP.NET Core 2.1 used to encapsulate markup.

Useful Links

• Partial Tag Helpers

Responsive Panel

In this video we see how to create a mobile responsive panel with the Responsive Panel Tag Helper. This Tag Helper creates a drawer that collapses off screen when a device has a small screen size.

Useful Links

• Responsive Panel Tag Helper

Tackling Data Sets with the Telerik Data Grid Tag Helper

In this video we learn how to use the Telerik Data Grid Tag Helper. Data binding, sorting, filtering, and server side functionality are discussed.

Useful Links

• Data Grid Tag Helper
• Data Source Tag Helper

Handling Client Side Events and User Interactions

In this video we learn how to use Telerik UI for ASP.NET Core’s client side API. Using client side events we can easily add interactivity and bind to events using ASP.NET Core Tag Helpers.

Useful Links

• Kendo UI JavaScript API documentation

Using Chart Tag Helpers for Interactive Data Visualizations

In this view we learn how to use the Telerik Chart Tag Helper for ASP.NET Core. Client side events are used to complete the demo application.

Useful Links

• Chart Tag Helper
• Completed Dashboard Application

I hope this video series helps you get started with ASP.NET Core Tag Helpers and shows how Telerik UI for ASP.NET Core can help you build your real-world applications. You can start a free trial of Telerik UI for ASP.NET Core here and try it out for yourself. Happy coding!