Is this REALLY the best way to structure web components!?!
Source Code Demo Code: https://gist.github.com/cferdinandi/7... Kelp UI Source Code: https://github.com/cferdinandi/kelp Support videos like this with a Go Make Things membership: https://members.gomakethings.com Hate the complexity of modern front‑end web development? I teach people a simpler, faster way to build for the web. Get free Daily Developer Tips at https://gomakethings.com. ⏳ Timestamps 00:00 - Intro 01:28 - Kelp UI 05:08 - HTML 07:32 - No constructor() 09:32 - The .init() method 12:45 - The .render() method 13:58 - The .emit() method 15:27 - The [is-ready] attribute 16:32 - debug mode 20:10 - The .ready() method 23:48 - Native ES modules 27:25 - Wrapping Up

▶︎
Learn Web Components In 25 Minutes

▶︎
Build bulletproof color systems

▶︎
Web Component Properties and Attributes

▶︎
Can you build a web app with vanilla Web Components in 2024?!?

▶︎
Top 6 HTML Features You’re Not Using (But Should Be)

▶︎
The Good, The Bad, and The Web Components - Zach Leatherman | JSHeroes 2023

▶︎
HTML Web Components

▶︎
How to use Web Components, and why you'd want to

▶︎
NEW CSS Scroll Features are Game Changers

▶︎
Web Components Crash Course

▶︎
How to build your first Web Component

▶︎
Are Web Components A Good Choice?

▶︎
WebComponents Will Outlive Your JavaScript Framework | Prime Reacts

▶︎
How to create a Web Component using Vanilla JS

▶︎
Create a reusable Web Component from scratch

▶︎
CSS Attribute Selectors

▶︎
Can you share state between Web Components!?

▶︎
Intro to Web Components - Full Walkthrough

▶︎
5 CSS tips every developer should know

▶︎
