DEV Community

Cover image for Web Components: Making Life Easier
Tech-withtata
Tech-withtata

Posted on

Web Components: Making Life Easier

Let's be honest, as a non-IST major, this class has continued to be a daunting educational journey for me. Concepts that might come extremely easily for some students continue to humble me after reading over as many articles I can find on Google and yet STILL not understand basic concepts...

However - after a good amount of time trying my best to decipher web components, I feel as though I finally have a solid understanding of web components and how they work! Yay me!

So, a web component, in watered-down language, is essentially a piece or string of code that can be easily replicated and tweaked, but overall allows a coder to write up something once (and only once) so they can reuse it in different contexts over and over. Think of things like widgets on websites, or a header/footer of a website that acts as a menu. These are solid examples of a web component.

You may be asking - who would use web components? The short answer - just about every website. Two good examples of websites that use web components are Youtube and pretty much all college university-style websites. In this week's video, I can walk you through exactly what I mean by this visually. The link to watch that is here: https://www.youtube.com/watch?v=hZSMgerTCkE

I was able to grasp my understanding of web components through the following sources:
1) https://developer.mozilla.org/en-US/docs/Web/Web_Components
2) https://levelup.gitconnected.com/web-components-ca2b6727faad?gi=2d81eb623a35
3) https://medium.com/rangle-io/everything-you-need-to-know-about-web-components-part-1-ced95964fbe6
4) https://www.creativebloq.com/features/web-components

Thanks for reading and following along in my struggle to understand coding every week!

Top comments (0)