Create your own Domain Specific Language in ASP.NET with TagHelpers

Sign in to queue

Description

Join your guide Cory Fowler as he talks to the product teams in Redmond as well as the web community.

This week we are joined by Taylor Mullen of the ASP.NET Razor Team on the topic of ASP.NET TagHelpers. TagHelpers are used to help simplify your views by enabling HTML tags in your markup to have additional functionality by enabling TagHelpers in your ASP.NET Project.

Show Links

Follow Taylor on Twitter

Embed

Download

Download this episode

Download captions

More episodes in this series

Related episodes

The Discussion

  • User profile image
    ncage

    One thing confuses me early on. He edits the project.json file and adds tag helpers and then after adds it again through "manage nuget package" dialog. Isn't adding it through project.json adding the package. Why the need to "Manage nuget packages"?

  • User profile image
    NTaylor​Mullen

    @ncage that was a video editing flaw. You can choose either or. (we recorded both ways so later on we could decide which one we wanted to use)

  • User profile image
    scyonx

    how do taghelpers relate to view components? I might not fully understand, but i feel like there's some overlap

  • User profile image
    NTaylor​Mullen

    @scyonx, TagHelpers are more of a utility to do anything where ViewComponents are specifically designed to return content from a call site.  Conceptually there may be some overlap as far as returning content goes but ViewComponents were built to be very familiar to Controllers (MVC) whereas TagHelpers are more Razor.

    Side note: You can actually do some work to make a ViewComponent a TagHelper if you want to change how you invoke it (@Component.Invoke("MyViewComponent")) => <myviewcomponent>) :D.

  • User profile image
    JohnMarsing

    Great presentation, I look forward to using TagHelpers when I get a chance.

    I was wondering if a good candidate for a built-in TagHelper would be for one emitting microdata.  I want to add this to my MVC website but want to go about doing it in a smart way.  One solution was to create a Microdata Metadata Provider (a solution by Rui Jarimba), but was wondering if a TagHelper might be a better solution.

    What do you think?

  • User profile image
    NTaylor​Mullen

    @JohnMarsing I think microdata is a fantastic candidate for TagHelpers. You could realllly simplify the usage of those microdata pieces.

  • User profile image
    DanielMackay

    Great presentation Taylor.  I really like the concept of tag helpers and being able to combine the power of razor, but still have the expressiveness of HTML.

    A comment about tag helper attributes.  You mentioned the attribute values are C#, unless the attribute matches a property which has an underlying type of string.  I think it would be more consistent to always have the values as string, and force the developer to a razor @ to signal the intent of the expression being C# (e.g. 1 + 1 == 2).  This would make it more readable to the user, would be more familiar to what devs are used to, and shows a better intent of what you expect to happen.

    As a side note AngularJS currently has this same problem and the team is working to address it in version 2.0.

  • User profile image
    NTaylor​Mullen

    @Crankage, we're planning to support the ability to provide @ symbols inline with TagHelper attributes and essentially enable either syntax making it easier for devs who want to continue using the @ syntax and those who don't. Glad you liked the presentation :D

  • User profile image
    Pradeep153

    Nice demos! Code was explained in detail. Nice Job!

    Some how I could not able to locket the TagHelper package, will try again to get it!

  • User profile image
    NTaylor​Mullen

    @Pradeep153, to use the Mvc TagHelpers you will need to install the package "Microsoft.AspNet.Mvc.TagHelpers". To build your own TagHelpers you just need to install "Microsoft.AspNet.Mvc"

  • User profile image
    Erik​Schierboom

    Wonderful feature and well presented! I see lots of ways this could improve code.

  • User profile image
    RobertJ1

    Nice presentation and great feature !
    My first impression is to compare this to a server-side angular directive.
    The first advantage is to deliver directly html content.
    However, the title mention "Domain Specific Language".
    I understand that the video cannot show the full potential of TagHelpers.
    But what do you mean when referring to DSL?
    Your goal is to provide mechanisms to build something similar to the language jade ?
    How far can I go with TagHelpers ?

  • User profile image
    NTaylor​Mullen

    The title may be slightly misleading. TagHelpers indeed offer a lot for customizing the HTML elements you can provide in your application but that's the extent of their capability.

    You could implement your own language ontop of TagHelpers via attributes but that's about it.

  • User profile image
    ryan

    i think the dashes should automatically be added - this how angular does it an it's an easy convention to figure out

  • User profile image
    NTaylor​Mullen

    @ryan, haha we felt so as well after lot of feedback from the community. In the latest update we've added guidelines for TagHelpers which we follow in the built-in TagHelpers. Sooo in the new TagHelpers all TagHelper specific attributes are prepended with "asp-"; therefore input would be:

    <input asp-for="FirstName" />

    Associated issue: https://github.com/aspnet/Mvc/issues/1618

  • User profile image
    ericis

    Will the form tag helper auto-output the anti-forgery token?

    @Html.AntiForgeryToken()

     

  • User profile image
    NTaylor​Mullen

    @ericis, sorry this is so late (didn't see that this had an unanswered comment). Yes it will. You can also opt-out of it by providing false to the "asp-anti-forgery" attribute.

Add Your 2 Cents