Веб-компоненты | Web Components

preview_player
Показать описание
Веб-компоненты - это набор различных технологий (HTML+JS+CSS), позволяющих создавать пользовательские HTML-элементы с собственной функциональностью

👉 [00:16] что такое веб-компоненты
👉 [00:57] как создать свой компонент
👉 [01:51] JavaScript для компонента
👉 [03:13] как посмотреть теневое дерево
👉 [04:23] слоты
👉 [05:01] стили для компонента
👉 [05:46] повтор основных моментов
👉 [06:13] пример полученного веб-компонента

🚀Фрагмент HTML-спецификации о пользовательских элементах
🚀Фрагмент DOM-спецификации о теневом дереве DOM
  1. htmllab
  2. веб-компоненты
  3. web components
  4. shadow tree
  5. теневой DOM
Рекомендации по теме
Веб-компоненты | Web 0:06:29

Веб-компоненты | Web Components

Видео курс HTML5 0:42:51

Видео курс HTML5 Web Components. Урок 1. Введение в HTML5 Web Components.

Web Components - 0:12:50

Web Components - Основы. Знакомство с Веб-компонентами!

Learn Web Components 0:24:21

Learn Web Components In 25 Minutes

Как решить проблемы 1:34:48

Как решить проблемы верстки с помощью HTML5 Web Components

Видео курс HTML5 0:05:30

Видео курс HTML5 Web Components. Урок 2. Shadow DOM

Как решить проблемы 1:20:03

Как решить проблемы верстки с помощью HTML5 Web Components

Видео курс HTML5 0:15:06

Видео курс HTML5 Web Components. Урок 3. Псевдо классы и использование импортов....

Build Web Apps 0:18:25

Build Web Apps in Webflow using this FREE Wized Alternative! (100% NoCode!)

Web Components e 0:25:38

Web Components e Seus Três PRINCIPAIS CONCEITOS: DOM, Shadow DOM e Virtual DOM

PiterJS #23 - 0:27:06

PiterJS #23 - Артём Пендюрин - Web Components для практичных людей

How to use 0:09:39

How to use Web Components in a JavaScript project

The Story of 0:06:42

The Story of Web Components

024. Веб компоненты 0:39:04

024. Веб компоненты от Angular к React – Дмитрий Лямкин

Use Web Components 0:00:48

Use Web Components in Vanilla JavaScript: Introduction

Web components basics 0:21:51

Web components basics (how-to)

Intro to Web 0:07:40

Intro to Web Components

Web Components: The 0:13:19

Web Components: The Secret Ingredient Helping Power The Web

Декларативный Shadow DOM 0:20:19

Декларативный Shadow DOM для изоляции стилей

Web component #html 0:00:17

Web component #html #css #web #frontend #dev #programming #фронтенд #программирование #код #code...

DevBytes: Web Components 0:04:02

DevBytes: Web Components - Template

Web component tutorial 0:11:33

Web component tutorial

Olga Madejska: Breaking 0:20:53

Olga Madejska: Breaking Bad - Web Components in production, what worked for us | JSConf EU 2015

Lit 3.0 Explained 0:05:45

Lit 3.0 Explained

Комментарии
Автор

Спасибо большое за ваш труд, за то, что щедро и бескорыстно делитесь знаниями

bwbdwqs
Автор

Мужик мегахорош. Я молодой разработчик, постоянно смотрю статьи, курсы, видео на ютубе по интересующим темам. Всегда раздражает когда лекторы говорят информацию как-будто в вакуоме: без эмоций, без акцентов на какие-либо вещи. Спасибо вам, что быстро и четко дали информацию, пожалуйста продолжайте!

mirrim_job
Автор

Тааак. Видео, как обычно, понравилось, хотя пришлось отдельно почитать о том, что такое customElements() и всё прочее (так вышло, что фронтендом больше не занимаюсь, но симпатия к нему осталась), а всё же главный вопрос возник и он таков - "а зачем вообще они нужны?". Ну, то есть какое преимущество это даёт перед нативным компонентом или шаблоном?

шмяка
Автор

Можно пожалуйста код еще быстрее? Очень медленно

code_horizon_school
Автор

Здравствуйте Алексей, можно как-нибудь связаться по поводу юзерскрипта?

The_music_loud
Автор

В проде вообще кто то уже начал использовать такие компоненты? или это еще за горами ?

mushnikov