refactor(templates): exact behavior for examples

- made my-hello-world & vanilla-hello-world have the exact same behavior

templates/basic/src/components/vanilla-hello-world.js

@@ -1,20 +1,21 @@
 class HelloWorld extends HTMLElement {
   static get observedAttributes() {
-    return ["data-name"];
+    return ["my-name"];
   }
 
   connectedCallback() {
     let count = 0;
+    const currentName = this.getAttribute('my-name');
 
-    if (!('name' in this.dataset)) {
-      this.dataset.name = 'World';
+    if (!currentName) {
+      this.setAttribute('my-name', 'World')
     }
 
-    this.onclick = () => this.dataset.name = `Clicked ${++count}x`;
+    this.onclick = () => this.setAttribute("my-name", `Clicked ${++count}x`);
   }
 
   attributeChangedCallback(property, previousValue, currentValue) {
-    if (property === "data-name" && previousValue !== currentValue) {
+    if (property === "my-name" && previousValue !== currentValue) {
       this.innerHTML = `<button style="cursor:pointer">Hello ${currentValue}!</button>`;
     }
   }