Clock with variable binding
This example uses variable data-binding to create a mobile-friendly interactive clock.
Data-binding is when you render (draw) a variable onto the page, and when the variable changes it automatically changes the rendered variable drawn on the page without any additional coding. This saves you having to update the variable manually.
Some use cases work with data binding, and some don't need it. It is a technique used by modern frameworks. Variable binding is useful when it makes something easier to do. But it can over-complicate things if used everywhere. Treat it as just another tool in your programming toolbox.
How do you data-bind a variable? You just put the variable in double-curlies when you render it, like {{variable name}}.