Usually we use template languages like Handlebars, JSX, and Jade to create. One simple way we can create our own template language is to write a function that returns these objects for us. This lessons shows how we can use these functions as a DSL to create our DOM description objects.
We are starting to be able to write full-blown applications inside the main function because it can declare what events we are interested in, and how to use them to create new elements on the DOM.
But we can improve this code related to the DOM driver even further. One thing that annoys my eyes is this object, here, to describe the elements. Essentially, it's creating a view in a very verbose way, and we usually use template languages like Handlebars or JSX or Jade.
One simple way we can solve this problem is by writing a function that returns those objects for us. I'm calling that function H, as in HTML, just as the H as hyper is a short name, and then we take the tag name as the first argument and children.
It simply returns an object with those tag names and that field of children. Then we can reuse that function here to replace this object. We can call H with a span as a tag name and the children are arrayed with that second elapsed string. It replaces the object because it returns the same object, and it still works.
The reason why we're introducing this function in the first place is that it looks really similar to what exists in cycle-dom, and it's a function called hyperscript. That's where the H comes from. That's our alternative to a template language.
This is a precursor to what we're going to see in cycle-dom. We're going to replace this outermost object, as well, with return H of H1 as a tag name, and the children are this array with the span. Then we can also simplify this error function like that.
Given an I number, we just map that to this piece of view, you could say. We could simplify this even further by taking advantage of the tag name as the function name, so then we don't need to specify the tag name anymore, just the children because we can return an object saying the tag name is now H1, and children are this children.