Web components
Veb Komponentləri — API-lərin veb platformanın HTML, CSS və JavaScript kodları ilə təkrar istifadə edilə bilən xüsusi elementlər yaratmağa imkan verən alətdir. Veb Komponentləri üç əsas texnologiyadan ibarətdir: Xüsusi Elementlər, Shadow DOM və HTML Şablonları.
User elementlər JavaScript siniflərindən istifadə edərək yeni HTML elementlərini təyin etməyə imkan verir. Bu o deməkdir ki, siz funksionallığı və üslubu əhatə edən öz xüsusi HTML teqlərinizi yarada bilərsiniz. Təyinatı üzrə, hər hansı digər daxili element kimi HTML-də xüsusi elementlərinizi istifadə edə bilərsiniz.
Shadow DOM xaricdəki üslub və ya skriptlərin təsirinə məruz qalmamaq üçün fərdi elementinizin üslubunu və işarələnməsini əhatə etməyə imkan verən texnologiyadır. Bu o deməkdir ki, siz veb səhifənizin qalan hissəsi ilə bir birinə ziddiyat yaratmayan öz unikal üslubları və işarələmələri ilə daha mürəkkəb komponentlər yarada bilərsiniz.
HTML Şablonları kodunuzda təkrar istifadə oluna bilən HTML bloklarını müəyyən etmək üçün bir texnologiyadır. Siz şablonu bir dəfə müəyyən edib və sonra onu fərdi elementlərinizdə və ya tətbiqinizin digər hissələrində dəfələrlə istifadə edə bilərsiniz. Şablonlara icra zamanı doldurula bilən dinamik məlumatlar daxil ola bilər.
Veb Komponenti yaratmaq üçün siz Xüsusi Elementləri API-dən istifadə edərək fərdi element təyin edib, Shadow DOM API istifadə edərək onun işarələnməsini və üslubunu daxil edib və strukturunu müəyyən etmək üçün HTML Şablonlarından istifadə etməlisiniz. Sonra, hər hansı digər daxili element kimi HTML-də xüsusi elementinizi istifadə edə bilərsiniz.
Veb Komponentləri bir çox layihə və proqramlarda istifadə oluna bilən təkrar istifadə edilə bilən komponentlər yaratmaq üçün güclü bir yoldur. Onlar mürəkkəb veb proqramların qurulmasını və saxlanmasını asanlaşdıran bir inkapsulyasiya və modulluq səviyyəsini təmin edir.
Xüsusi HTML elementlərin adlanmasında (-) simvolunu ehtiva etməlidir.
Correct form:
<my-component> , <registration-form>
Incorrect form:
<mycomponent> , <registration_form>
