When you are writing an <svg> element, you usually have to put data in the attributes of elements inside it to actually draw shapes. For example, if you want to draw a triangle, you have to write the following:
<svg> <path d="M 100 30 L 200 30 L 150 120 z"/></svg>
The text inside the d attribute is a series of instructions that make a virtual cursor move to draw: M moves the cursor to the (100, 30) coordinate inside the <svg>, then L traces a line up until (200, 30) and then again to the (150, 120) coordinate. Finally, z closes the path we are drawing, and the result is always a triangle.
We would like to write a triangle with a component, but we don't like attributes and we want to write in our own language, so we would ...