Adding some utils to the template

src/util/Event.js

@@ -0,0 +1,23 @@
+import Log from "./Log.js";
+import StringUtil from "./StringUtil.js";
+
+export default class Event {
+
+  static click(selector, callback) {
+    this._addEvent('click', selector, callback)
+  }
+
+  static change(selector, callback) {
+    this._addEvent('change', selector, callback)
+  }
+
+  static _addEvent(eventName, selector, callback) {
+    Log.debug(`Adding event: ${eventName} to: ${selector}`);
+    document.addEventListener(eventName, (event) => {
+      if (!event.target.matches(selector)) return;
+      Log.debug(`${StringUtil.capitalizeFirstLetter(eventName)} on: ${selector}`);
+      callback(event.target);
+    });
+  }
+
+}

src/util/Log.js

@@ -0,0 +1,7 @@
+export default class Log {
+
+  static debug(message) {
+    console.log(`%c [DEBUG] ${message} `, 'background: blue; color: white; font-size: 13px;');
+  }
+
+}

src/util/StringUtil.js

@@ -0,0 +1,7 @@
+export default class StringUtil {
+
+  static capitalizeFirstLetter(string) {
+    return string[0].toUpperCase() + string.slice(1);
+  }
+
+}