Component encapsulation

Component encapsulation uses a separate template file that looks more or less like every other web templating language you've ever used. By convention, if your component class is in hello.ts, then its template is in hello.html and your component will be <hello/>:

<!-- product-list.html -->
<template>
    <require from="product-detail"/>
    <p>
        <product-detail repeat.for="product of products" product.bind="product"/>
    </p>
</template>

/* producty-list.js */
export class ProductList {
    public products[];
}

Each JavaScript framework has its own way of working, and we can explore more features about each one, but Aurelia has something special—you don't need to go far away from learning how the framework works, and in extreme cases, in their own way/syntax for developing. With Aurelia, you will feel like writing plain JavaScript and HTML code, highly maintainable, scalable, and focusing only on your business purposes.

Now it's time to start working with Aurelia. So, let's explore the Aurelia command line to start our trip. Keep reading!