Howdy fellow developers 👋. In the last post we created our first AEM component. We discussed HTL in brief and our component did not have any styles.
In this post, first we will dive into HTL basics via code examples and in the later part, we will understand the concepts of clientlibs in AEM.
In ancient times, JSPs were used to render AEM components on pages. Since then we have evolved a lot and developing components using HTL is the most preferred way to render components on the front end (some AEM implementations use React or Angular but they are out of the scope of this post).
What is HTL?
HTL stands for HTML Template Language (but you know that already, don’t you 😏?). It is a template language that lets us perform minor logical or computational operations in the HTML code itself. HTL uses an expression language to insert content in the rendered output. It also uses HTML5 data attributes to define conditions and iterations in the markup.