Easily Build a Progress Bar with Web Components in JavaScript

Why did you not extend the native progress element class, like so: class CustomProgress extends HTMLProgressElement { ... }

Nice video, I was doing a 3 hour course on this, but your just explain it with a fun project in just 20 min, thanks.

I love the fact that you focus yourself on Javascript and not on any framework, cause like I always said, people need to learn how to walk very good in order to run. Everybody wants to start right away with frameworks but I learned more when I got back to the power of just Javascript to understand exactly what frameworks solve.

In HTML <progress> is valid tag, not <progress-bar>.

BAN

ERROR: undefined

ERROR NO AWESOME!!!!!!!!!!!!!

This is awesome. Very well explained. Thanks.

Hey mate, great video like always...

Maybe for your next WC video you could highlight that shadow DOM isn't necessary for custom-elements. Sometimes I just use custom-elements just to trigger template renders on proceeding templates on connectedCallback() (connected callback triggers before childNodes of the custom-element is parsed)

Also everybody seems to be using innerHTML to "hydrate" custom-elements yet there are quite a few alternatives like using a template inside the custom-element then cloning and filling with textContent. You can even use a recursive (or generator yield*) function to createElement + Object. assign properties incl textContent for JSON trees.

Another interesting topic is using CSS custom-element::part(x) for styling inside Shadow Dom.

One of the huge pros of custom-elements is readability to developers and combined with aria roles is substantially better than <div> soup...

I always wondered, did you get into web dev because your name is "DOM"? Big fan of your content.

Web components are the future in my opinion

Concise, interesting and simple explanation with a simple example, that can help beginners understand Web Components and build their own components. Thanks Dom!

THANK YOU SO MUCH !
I think that it will be great idea if you build a mini-project using native JavaScript web components in the coming days. And share it with us.

This is an awesome tutorial 👍

web components are very underrated , please make more tuts with wcs , we dont need frameworks at all.

This channel is the best resources for changing someone who hate vanilla javascript, to be a vanilla javascript simp