HTML Templates — define markup for reuse.?

Short answer: Example: <user-card></user-card> <template id="user-template"> <p>Hello, <span id="name"></span></p> </template> <script> class UserCard extends HTMLElement { connectedCallback() { const tmpl = document.getElementById("user-template");

Example code

const content = tmpl.content.cloneNode(true);
content.querySelector("#name").textContent = "Sandeep"; this.appendChild(content); }
} customElements.define("user-card", UserCard); </script> Key Takeaway: Web Components = reusable, encapsulated building blocks for modern web apps.

Real-world example (ShopNest)

ShopNest’s browser cart uses modern JavaScript: fetch APIs with async/await, modules, and clear error handling.

Say this in the interview

1. Define — one clear sentence (the short answer above).
2. Example — relate it to a project like ShopNest or your real work.
3. Trade-off — when you would not use it.