اصول وب کامپوننت‌ها

آنچه یاد خواهید گرفت:

• API وب کامپوننت‌ها
• عناصر سفارشی خودتان را بسازید و آن‌ها را مانند عناصر داخلی HTML در کد خود استفاده کنید.
• از قالب‌ها برای ایجاد ساختار عناصر خود استفاده کنید.
• shadow DOM را برای کپسوله‌سازی (پنهان‌سازی جزئیات داخلی) عنصر خود استفاده کنید.
• از slot برای ترکیب عناصر سفارشی خود با عناصر مختلف استفاده کنید.
• رویدادهای سفارشی بسازید.

پیش نیازهای دوره

• آشنایی با دستکاری DOM اولیه با جاوااسکریپت

توضیحات دوره

وب اپلیکیشن‌ها در حال تکامل هستند و فریمورک‌هایی مانند React ،Vue Angular ،Svelte و غیره، قابلیت‌هایی مانند کامپوننت‌های قابل استفاده مجدد را برای سهولت در ساخت اپلیکیشن‌های بزرگ به ارمغان آورده‌اند. با وب کامپوننت‌ها می‌توانیم عناصر HTML سفارشی خودمان را بسازیم، درست مانند کاری که در سایر فریمورک‌های محبوب وب انجام می‌دهیم. اما تفاوت اینجا است که API وب کامپوننت‌ها استاندارد وب است، به این معنی که با مرورگرهای مدرن عرضه می‌شود. بنابراین، بدون نیاز به فرآیند ساخت اضافی یا هر ابزار دیگری، می‌توانیم کد خود را همان‌طور که هست در مرورگر اجرا کنیم. تمام چیزی که نیاز داریم، دانش جاوااسکریپت خالص است.

وب کامپوننت‌ها سه API اصلی دارند:

• عناصر سفارشی
• Shadow DOM 
•  قالب‌های HTML

 در این دوره، ما همه این‌ها را یاد می‌گیریم و تمرین می‌کنیم.

ما یاد می‌گیریم که چگونه می‌توانیم عناصر سفارشی بسازیم و چگونه می‌توانیم عناصر داخلی را گسترش دهیم. همچنین "قالب" را تمرین می‌کنیم تا رندرینگ عنصر سفارشی ما کارآمدتر شود.

Shadow Dom را تمرین خواهیم کرد تا نقش آن را در وب کامپوننت‌ها ببینیم. مشاهده می‌کنیم که چگونه می‌توانیم عنصر سفارشی خود را با مارک‌آپ ارائه شده از بیرون ترکیب کنیم. و همچنین گزینه‌های استایل‌دهی عناصر خود را بررسی خواهیم کرد.

در نهایت، تمرین می‌کنیم که چگونه رویدادها در Shadow Dom تغییر می‌کنند. مشکلات را خواهیم دید و راه‌حل‌های خود را معرفی خواهیم کرد.

اگر می‌خواهید وب کامپوننت‌های قابل استفاده مجدد را بدون وابستگی به کتابخانه شخص ثالث بسازید، اگر می‌خواهید اپلیکیشن‌هایی بر اساس استانداردهای وب بسازید، پس وب کامپوننت‌ها پاسخ هستند.

این دوره برای چه کسانی مناسب است؟

• توسعه‌دهندگانی که می‌خواهند کلاینت‌های وب را با استانداردهای وب بسازند.
• توسعه‌دهندگانی که می‌خواهند اپلیکیشن‌ها را بدون نیاز به کتابخانه‌ها و فریمورک‌های شخص ثالث بسازند.