Razor Blade 2.0 with Fluent Html Tag API

RazorBlade 2.0 is released with a cool fluent API to generate HTML.

Update: RazorBlade 3 was released and the entire API is now fully documented.

What the HTML API is for

Many small things done in Razor require us to generate safe HTML with various challenges. For example, adding an Icon tag to the header requires a safe HTML generator, or even adding a JSON-data attribute to a tag needs this too. 

To address this, RazorBlade 2.0 introduces a full-scale HTML generation API to solve exactly this challenge, in a clean, safe, consistent way. 

How to Generate HTML

The basic API looks as follows:

• @Tag.Attribute("src", "abc.png") generates a simple attribute
• @Tag.Attribute("data-stuff", someObject) generates a JSON attribute by serializing the object
• @Tag.Custom("div") generates a simple tag, which we'll then modify using the fluent API

Going Fluent

A fluent API looks like jQuery or LINQ, where you can chain commands together. For example:

@Tag.Custom("div").Id("myId").Class("dark").Data("stuff", myObject).Wrap("this is the content")

This may seem like a long chain, but it shows what can be done. So the fluent commands supported on all html tags are these in V2.0:

1. Add(string | Tag content-to-append)
2. Attr(string name, string | object value)
3. Class(string class-to-add)
4. Data(string data-name, string | object thing-to-set)
5. Id(string id-to-set)
6. On(string event-name, string js-code)
7. Style(string styles-to-add)
8. Title(string title-to-set)
9. Wrap(string content-to-set)

Note that some of these "set" a value, while others "append" it. So calling Class(...) twice will result in two classes being added, calling Title twice will result in the last title being set. 

Get Started

You can get the latest RazorBlade from the github releases, and look at the documentation on github. Tutorials will follow soon.

Love from Switzerland,
iJungleboy