Web Components Tutorial
In this video, we'll be discussing the basics of web components and how to get started using them in your web projects. We create a simple startpage that will utilize our custom web component using vanilla JavaScript.
=== Get the code on ===
Starter template on codepen: https://codepen.io/tuffgniuz/pen/poVMpYm
Final version on github: https://github.com/tuffgniuz/periodic...
=== SUPPORT THIS CHANNEL ===
Hardware I use
► Keychron K2: https://amzn.to/3CwOCE1
► Thinkpad x260: https://amzn.to/3CVcVwW
========== GITHUB ==========
https://github.com/tuffgniuz/
========== END SONG ATTRIBUTION ==========
Lofi Hip-hop Intro 08 by TaigaSoundProd
Link: https://filmmusic.io/song/6963-lofi-h...
License: https://filmmusic.io/standard-license
Disclosure:
Wherever possible I use referral links, which means if you click one of the links in this video or description and make a purchase I may receive a small commission or other compensation.
Timestamps
00:00 Introduction
02:49 Project Overview
03:08 Web Element Class
04:27 Render method
06:28 Register Custom Element
07:14 connectedCallback life cycle method
09:24 Styling Components
12:22 Attributes and Properties
17:40 End notes
#webcomponents #javascript #webdevelopment #ui #frontend #frontenddevelopment