From 822a67e4a4e30c8e971421d1b7469248ccb472f1 Mon Sep 17 00:00:00 2001 From: Yurii Hasiuk Date: Sun, 8 May 2022 11:34:54 +0300 Subject: [PATCH 01/16] Translate web components intro --- .../1-webcomponents-intro/article.md | 86 +++++++++---------- 8-web-components/index.md | 5 +- 2 files changed, 46 insertions(+), 45 deletions(-) diff --git a/8-web-components/1-webcomponents-intro/article.md b/8-web-components/1-webcomponents-intro/article.md index c3522dea9..a51434102 100644 --- a/8-web-components/1-webcomponents-intro/article.md +++ b/8-web-components/1-webcomponents-intro/article.md @@ -1,76 +1,76 @@ -# From the orbital height +# З висоти орбітального польоту -This section describes a set of modern standards for "web components". +Ця секція описує набір сучасних стандартів для "веб компонентів". -As of now, these standards are under development. Some features are well-supported and integrated into the modern HTML/DOM standard, while others are yet in draft stage. You can try examples in any browser, Google Chrome is probably the most up to date with these features. Guess, that's because Google fellows are behind many of the related specifications. +Наразі, ці стандарти знаходяться в розробці. Деякі особливості зараз добре підтримуються та інтегровані у сучасний HTML/DOM стандарт, але деякі все ще у стадії чернетки. Ви можете погратись з прикладами у будь-якому браузері, але Google Chrome, мабуть, йде найбільше у ногу з веб компонентами. Скоріш за все це пов'язано з тим, що співробітники Google стоять за багатьма пов'язаними специфікаціями. -## What's common between... +## Що спільного між... -The whole component idea is nothing new. It's used in many frameworks and elsewhere. +Загалом, компонентний підхід не є чимось новим. Це використовується у багатьох фреймворках. -Before we move to implementation details, take a look at this great achievement of humanity: +Перед тим, як ми перейдемо до деталей реалізації, погляньмо одне з найбільших досягнень людства: ![](satellite.jpg) -That's the International Space Station (ISS). +Це Міжнародна космічна станція (МКС). -And this is how it's made inside (approximately): +І це як вона зроблена всередині (приблизно): ![](satellite-expanded.jpg) -The International Space Station: -- Consists of many components. -- Each component, in its turn, has many smaller details inside. -- The components are very complex, much more complicated than most websites. -- Components are developed internationally, by teams from different countries, speaking different languages. +Міжнародна космічна станція: +- Складається з багатьох компонентів. +- Кожен компонент своєю чергою складається з менших деталей всередині. +- Компоненти є дуже складними, і набагато складніші ніж більшість вебсайтів. +- Складові розроблялись командами з різних країн -...And this thing flies, keeps humans alive in space! +...І ця штука літає, оберігаючи життя людей у космосі! -How are such complex devices created? +Як же такі комплексні пристрої були створені? -Which principles could we borrow to make our development same-level reliable and scalable? Or, at least, close to it? +Які принципи ми можемо запозичити, щоб зробити нашу розробку такою ж надійною та масштабованою? Або, принаймні, близькою до такої? -## Component architecture +## Архітектура компонентів -The well known rule for developing complex software is: don't make complex software. +Добре відоме правило розробки складного програмного забезпечення: не створюйте складне програмне забезпечення. -If something becomes complex -- split it into simpler parts and connect in the most obvious way. +Якщо щось стає складним - розділіть його на простіші частини й з'єднайте найбільш очевидним способом. -**A good architect is the one who can make the complex simple.** +**Хороший архітектор - це той, хто може зробити складне простим** -We can split user interface into visual components: each of them has own place on the page, can "do" a well-described task, and is separate from the others. +Ми можемо розділити користувальницький інтерфейс на візуальні компоненти: кожен з них має своє місце на сторінці, може «виконувати» своє призначення та бути окремо від інших. -Let's take a look at a website, for example Twitter. +Давайте поглянемо на веб-сайт, наприклад, Twitter. -It naturally splits into components: +Він природним чином розбивається на компоненти: ![](web-components-twitter.svg) -1. Top navigation. -2. User info. -3. Follow suggestions. -4. Submit form. -5. (and also 6, 7) -- messages. +1. Верхня навігація. +2. Інформація про користувача. +3. Список пропозицій. +4. Поле для нового твіту. +5. (а також 6, 7) -- твіти. -Components may have subcomponents, e.g. messages may be parts of a higher-level "message list" component. A clickable user picture itself may be a component, and so on. +Компоненти можуть містити в собі інші компоненти, наприклад, повідомлення можуть бути частинами компоненти "списку повідомлень" вищого рівня. Зображення користувача, яке можна натиснути, може бути також компонентом. -How do we decide, what is a component? That comes from intuition, experience and common sense. Usually it's a separate visual entity that we can describe in terms of what it does and how it interacts with the page. In the case above, the page has blocks, each of them plays its own role, it's logical to make these components. +Як ми визначаємо, що таке компонент? Все залежить від інтуїції, досвіду та здорового глузду. Зазвичай, це окрема візуальна сутність, яку ми можемо описати з точки зору того, що вона робить і як вона взаємодіє зі сторінкою. У наведеному вище випадку на сторінці є блоки, які відіграють свою роль. Отже, було б логічно розділити цю сторінку на компоненти. -A component has: -- Its own JavaScript class. -- DOM structure, managed solely by its class, outside code doesn't access it ("encapsulation" principle). -- CSS styles, applied to the component. -- API: events, class methods etc, to interact with other components. +Компонент має: +- Власний JavaScript клас. +- Структуру DOM, яка керована виключно її класом, зовнішній код не має доступу до неї (принцип «інкапсуляції»). +- Стилі CSS, застосовані до компоненти. +- API: події, методи класу тощо для взаємодії з іншими компонентами. -Once again, the whole "component" thing is nothing special. +Знову ж таки, весь «компонентний» підхід річ не нова і в ній немає нічого особливого. -There exist many frameworks and development methodologies to build them, each with its own bells and whistles. Usually, special CSS classes and conventions are used to provide "component feel" -- CSS scoping and DOM encapsulation. +Існує багато фреймворків і методологій розробки для їх побудови, кожна зі своїми "фічами". Зазвичай для забезпечення «відчуття компонентів» використовуються спеціальні класи та конвенції CSS – область визначення CSS та інкапсуляція DOM. -"Web components" provide built-in browser capabilities for that, so we don't have to emulate them any more. +«Веб компоненти» надають для цього вбудовані можливості браузера, тому нам більше не потрібно їх емулювати. -- [Custom elements](https://html.spec.whatwg.org/multipage/custom-elements.html#custom-elements) -- to define custom HTML elements. -- [Shadow DOM](https://dom.spec.whatwg.org/#shadow-trees) -- to create an internal DOM for the component, hidden from the others. -- [CSS Scoping](https://drafts.csswg.org/css-scoping/) -- to declare styles that only apply inside the Shadow DOM of the component. -- [Event retargeting](https://dom.spec.whatwg.org/#retarget) and other minor stuff to make custom components better fit the development. +- [Custom elements](https://html.spec.whatwg.org/multipage/custom-elements.html#custom-elements) -- для визначення власних HTML елементів. +- [Shadow DOM](https://dom.spec.whatwg.org/#shadow-trees) -- для створення внутрішнього DOM для компоненти, прихованого від інших. +- [CSS Scoping](https://drafts.csswg.org/css-scoping/) -- щоб оголошувати стилі, які застосовуються лише всередині Shadow DOM компонента. +- [Event retargeting](https://dom.spec.whatwg.org/#retarget) та інші незначні речі, щоб користувацькі компоненти краще відповідали розробці. -In the next chapter we'll go into details of "Custom Elements" -- the fundamental and well-supported feature of web components, good on its own. +У наступному розділі ми детально розглянемо «користувацькі елементи» — фундаментальну і добре підтримувану функцію веб компонентів, яка сама по собі хороша. diff --git a/8-web-components/index.md b/8-web-components/index.md index f572ed3d4..764bb7bd9 100644 --- a/8-web-components/index.md +++ b/8-web-components/index.md @@ -1,3 +1,4 @@ -# Web components +# Веб компоненти + +Веб компоненти — це набір стандартів для створення користувацьких HTML-елементів зі своїми властивостями й методами, інкапсульованим DOM і стилями. -Web components is a set of standards to make self-contained components: custom HTML-elements with their own properties and methods, encapsulated DOM and styles. From 73c28da69e34f0c6d35088ff4be948cc32492f6e Mon Sep 17 00:00:00 2001 From: Yurii Hasiuk Date: Mon, 20 Jun 2022 20:25:15 +0300 Subject: [PATCH 02/16] Update 8-web-components/1-webcomponents-intro/article.md Co-authored-by: Stanislav --- 8-web-components/1-webcomponents-intro/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/8-web-components/1-webcomponents-intro/article.md b/8-web-components/1-webcomponents-intro/article.md index a51434102..4091661d2 100644 --- a/8-web-components/1-webcomponents-intro/article.md +++ b/8-web-components/1-webcomponents-intro/article.md @@ -2,7 +2,7 @@ Ця секція описує набір сучасних стандартів для "веб компонентів". -Наразі, ці стандарти знаходяться в розробці. Деякі особливості зараз добре підтримуються та інтегровані у сучасний HTML/DOM стандарт, але деякі все ще у стадії чернетки. Ви можете погратись з прикладами у будь-якому браузері, але Google Chrome, мабуть, йде найбільше у ногу з веб компонентами. Скоріш за все це пов'язано з тим, що співробітники Google стоять за багатьма пов'язаними специфікаціями. +Наразі, ці стандарти знаходяться в розробці. Деякі особливості зараз добре підтримуються та інтегровані у сучасний HTML/DOM стандарт, але деякі все ще у стадії чернетки. Ви можете погратись з прикладами у будь-якому браузері, але Google Chrome, мабуть, має найкращу підтримку. Скоріш за все це пов’язано з тим, що саме компанія Google стоїть за багатьма специфікаціями до веб компонентів. ## Що спільного між... From 4e9d4c56547e9fc2a1887393b6fdbe3e14c99707 Mon Sep 17 00:00:00 2001 From: Yurii Hasiuk Date: Mon, 20 Jun 2022 20:25:23 +0300 Subject: [PATCH 03/16] Update 8-web-components/1-webcomponents-intro/article.md Co-authored-by: Stanislav --- 8-web-components/1-webcomponents-intro/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/8-web-components/1-webcomponents-intro/article.md b/8-web-components/1-webcomponents-intro/article.md index 4091661d2..e9034d9e3 100644 --- a/8-web-components/1-webcomponents-intro/article.md +++ b/8-web-components/1-webcomponents-intro/article.md @@ -8,7 +8,7 @@ Загалом, компонентний підхід не є чимось новим. Це використовується у багатьох фреймворках. -Перед тим, як ми перейдемо до деталей реалізації, погляньмо одне з найбільших досягнень людства: +Перед тим, як ми перейдемо до деталей реалізації, погляньмо на одне з найбільших досягнень людства: ![](satellite.jpg) From b97c512f626c8e5b78ce10da20327af7067978be Mon Sep 17 00:00:00 2001 From: Yurii Hasiuk Date: Mon, 20 Jun 2022 20:25:32 +0300 Subject: [PATCH 04/16] Update 8-web-components/1-webcomponents-intro/article.md Co-authored-by: Stanislav --- 8-web-components/1-webcomponents-intro/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/8-web-components/1-webcomponents-intro/article.md b/8-web-components/1-webcomponents-intro/article.md index e9034d9e3..d6c0c3052 100644 --- a/8-web-components/1-webcomponents-intro/article.md +++ b/8-web-components/1-webcomponents-intro/article.md @@ -26,7 +26,7 @@ ...І ця штука літає, оберігаючи життя людей у космосі! -Як же такі комплексні пристрої були створені? +Як саме було створено такі комплексні і складні пристрої? Які принципи ми можемо запозичити, щоб зробити нашу розробку такою ж надійною та масштабованою? Або, принаймні, близькою до такої? From dab24d132b4848bb4441f63a86662a5b8241aee1 Mon Sep 17 00:00:00 2001 From: Yurii Hasiuk Date: Mon, 20 Jun 2022 20:25:37 +0300 Subject: [PATCH 05/16] Update 8-web-components/1-webcomponents-intro/article.md Co-authored-by: Stanislav --- 8-web-components/1-webcomponents-intro/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/8-web-components/1-webcomponents-intro/article.md b/8-web-components/1-webcomponents-intro/article.md index d6c0c3052..cf1b67637 100644 --- a/8-web-components/1-webcomponents-intro/article.md +++ b/8-web-components/1-webcomponents-intro/article.md @@ -24,7 +24,7 @@ - Компоненти є дуже складними, і набагато складніші ніж більшість вебсайтів. - Складові розроблялись командами з різних країн -...І ця штука літає, оберігаючи життя людей у космосі! +...І ця штука літає, зберігаючи життя людей у космосі! Як саме було створено такі комплексні і складні пристрої? From a4580c31782d3128e4c8ffd03459a15d03f6b957 Mon Sep 17 00:00:00 2001 From: Yurii Hasiuk Date: Mon, 20 Jun 2022 20:25:44 +0300 Subject: [PATCH 06/16] Update 8-web-components/1-webcomponents-intro/article.md Co-authored-by: Stanislav --- 8-web-components/1-webcomponents-intro/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/8-web-components/1-webcomponents-intro/article.md b/8-web-components/1-webcomponents-intro/article.md index cf1b67637..25e869ad4 100644 --- a/8-web-components/1-webcomponents-intro/article.md +++ b/8-web-components/1-webcomponents-intro/article.md @@ -34,7 +34,7 @@ Добре відоме правило розробки складного програмного забезпечення: не створюйте складне програмне забезпечення. -Якщо щось стає складним - розділіть його на простіші частини й з'єднайте найбільш очевидним способом. +Якщо щось стає складним -- розділіть його на простіші частини й з'єднайте найбільш очевидним способом. **Хороший архітектор - це той, хто може зробити складне простим** From 1f053a978f433734725e105214ea711b027a1109 Mon Sep 17 00:00:00 2001 From: Yurii Hasiuk Date: Mon, 20 Jun 2022 20:25:49 +0300 Subject: [PATCH 07/16] Update 8-web-components/1-webcomponents-intro/article.md Co-authored-by: Stanislav --- 8-web-components/1-webcomponents-intro/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/8-web-components/1-webcomponents-intro/article.md b/8-web-components/1-webcomponents-intro/article.md index 25e869ad4..40f595bbb 100644 --- a/8-web-components/1-webcomponents-intro/article.md +++ b/8-web-components/1-webcomponents-intro/article.md @@ -66,7 +66,7 @@ Існує багато фреймворків і методологій розробки для їх побудови, кожна зі своїми "фічами". Зазвичай для забезпечення «відчуття компонентів» використовуються спеціальні класи та конвенції CSS – область визначення CSS та інкапсуляція DOM. -«Веб компоненти» надають для цього вбудовані можливості браузера, тому нам більше не потрібно їх емулювати. +"Веб компоненти" надають для цього вбудовані можливості браузера, тому нам більше не потрібно їх емулювати. - [Custom elements](https://html.spec.whatwg.org/multipage/custom-elements.html#custom-elements) -- для визначення власних HTML елементів. - [Shadow DOM](https://dom.spec.whatwg.org/#shadow-trees) -- для створення внутрішнього DOM для компоненти, прихованого від інших. From 75945e70dec60c7ee6b5b6c34c2d442b0ff43769 Mon Sep 17 00:00:00 2001 From: Yurii Hasiuk Date: Mon, 20 Jun 2022 20:25:54 +0300 Subject: [PATCH 08/16] Update 8-web-components/1-webcomponents-intro/article.md Co-authored-by: Stanislav --- 8-web-components/1-webcomponents-intro/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/8-web-components/1-webcomponents-intro/article.md b/8-web-components/1-webcomponents-intro/article.md index 40f595bbb..c4b5b43a6 100644 --- a/8-web-components/1-webcomponents-intro/article.md +++ b/8-web-components/1-webcomponents-intro/article.md @@ -69,7 +69,7 @@ "Веб компоненти" надають для цього вбудовані можливості браузера, тому нам більше не потрібно їх емулювати. - [Custom elements](https://html.spec.whatwg.org/multipage/custom-elements.html#custom-elements) -- для визначення власних HTML елементів. -- [Shadow DOM](https://dom.spec.whatwg.org/#shadow-trees) -- для створення внутрішнього DOM для компоненти, прихованого від інших. +- [Shadow DOM](https://dom.spec.whatwg.org/#shadow-trees) -- для створення внутрішнього DOM для компонента, прихованого від інших. - [CSS Scoping](https://drafts.csswg.org/css-scoping/) -- щоб оголошувати стилі, які застосовуються лише всередині Shadow DOM компонента. - [Event retargeting](https://dom.spec.whatwg.org/#retarget) та інші незначні речі, щоб користувацькі компоненти краще відповідали розробці. From ed5594e06a0fbecf6cb75a575db1f14ad424b598 Mon Sep 17 00:00:00 2001 From: Yurii Hasiuk Date: Mon, 20 Jun 2022 20:26:01 +0300 Subject: [PATCH 09/16] Update 8-web-components/1-webcomponents-intro/article.md Co-authored-by: Stanislav --- 8-web-components/1-webcomponents-intro/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/8-web-components/1-webcomponents-intro/article.md b/8-web-components/1-webcomponents-intro/article.md index c4b5b43a6..185057dba 100644 --- a/8-web-components/1-webcomponents-intro/article.md +++ b/8-web-components/1-webcomponents-intro/article.md @@ -71,6 +71,6 @@ - [Custom elements](https://html.spec.whatwg.org/multipage/custom-elements.html#custom-elements) -- для визначення власних HTML елементів. - [Shadow DOM](https://dom.spec.whatwg.org/#shadow-trees) -- для створення внутрішнього DOM для компонента, прихованого від інших. - [CSS Scoping](https://drafts.csswg.org/css-scoping/) -- щоб оголошувати стилі, які застосовуються лише всередині Shadow DOM компонента. -- [Event retargeting](https://dom.spec.whatwg.org/#retarget) та інші незначні речі, щоб користувацькі компоненти краще відповідали розробці. +- [Event retargeting](https://dom.spec.whatwg.org/#retarget) та інші незначні речі, щоб нестандартні компоненти краще відповідали розробці. У наступному розділі ми детально розглянемо «користувацькі елементи» — фундаментальну і добре підтримувану функцію веб компонентів, яка сама по собі хороша. From be502541c62467bf0943eff37bda247106ac1c39 Mon Sep 17 00:00:00 2001 From: Yurii Hasiuk Date: Mon, 20 Jun 2022 20:26:08 +0300 Subject: [PATCH 10/16] Update 8-web-components/index.md Co-authored-by: Stanislav --- 8-web-components/index.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/8-web-components/index.md b/8-web-components/index.md index 764bb7bd9..832d2df18 100644 --- a/8-web-components/index.md +++ b/8-web-components/index.md @@ -1,4 +1,4 @@ # Веб компоненти -Веб компоненти — це набір стандартів для створення користувацьких HTML-елементів зі своїми властивостями й методами, інкапсульованим DOM і стилями. +Веб компоненти -- це набір стандартів для створення нестандартних HTML-елементів зі своїми властивостями й методами, інкапсульованим DOM і стилями. From b60db6645428b3d59a2e765bde870854df157696 Mon Sep 17 00:00:00 2001 From: Yurii Hasiuk Date: Mon, 20 Jun 2022 20:26:14 +0300 Subject: [PATCH 11/16] Update 8-web-components/1-webcomponents-intro/article.md Co-authored-by: Stanislav --- 8-web-components/1-webcomponents-intro/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/8-web-components/1-webcomponents-intro/article.md b/8-web-components/1-webcomponents-intro/article.md index 185057dba..2aa345a79 100644 --- a/8-web-components/1-webcomponents-intro/article.md +++ b/8-web-components/1-webcomponents-intro/article.md @@ -73,4 +73,4 @@ - [CSS Scoping](https://drafts.csswg.org/css-scoping/) -- щоб оголошувати стилі, які застосовуються лише всередині Shadow DOM компонента. - [Event retargeting](https://dom.spec.whatwg.org/#retarget) та інші незначні речі, щоб нестандартні компоненти краще відповідали розробці. -У наступному розділі ми детально розглянемо «користувацькі елементи» — фундаментальну і добре підтримувану функцію веб компонентів, яка сама по собі хороша. +У наступному розділі ми детально розглянемо "нестандартні елементи" -- фундаментальну і добре підтримувану функцію веб компонентів, яка сама по собі хороша. From dfeb56d4266947638a6cbe58b20c9d22a150da63 Mon Sep 17 00:00:00 2001 From: Yurii Hasiuk Date: Mon, 20 Jun 2022 20:26:23 +0300 Subject: [PATCH 12/16] Update 8-web-components/1-webcomponents-intro/article.md Co-authored-by: Stanislav --- 8-web-components/1-webcomponents-intro/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/8-web-components/1-webcomponents-intro/article.md b/8-web-components/1-webcomponents-intro/article.md index 2aa345a79..19fc87084 100644 --- a/8-web-components/1-webcomponents-intro/article.md +++ b/8-web-components/1-webcomponents-intro/article.md @@ -38,7 +38,7 @@ **Хороший архітектор - це той, хто може зробити складне простим** -Ми можемо розділити користувальницький інтерфейс на візуальні компоненти: кожен з них має своє місце на сторінці, може «виконувати» своє призначення та бути окремо від інших. +Ми можемо розділити інтерфейс користувача на візуальні компоненти: кожен з них має своє місце на сторінці, може "виконувати" своє призначення та існувати окремо від інших. Давайте поглянемо на веб-сайт, наприклад, Twitter. From 586e08e2f1c97db1595482b508e7523b87e59660 Mon Sep 17 00:00:00 2001 From: Yurii Hasiuk Date: Mon, 20 Jun 2022 20:26:30 +0300 Subject: [PATCH 13/16] Update 8-web-components/1-webcomponents-intro/article.md Co-authored-by: Stanislav --- 8-web-components/1-webcomponents-intro/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/8-web-components/1-webcomponents-intro/article.md b/8-web-components/1-webcomponents-intro/article.md index 19fc87084..72d5caf44 100644 --- a/8-web-components/1-webcomponents-intro/article.md +++ b/8-web-components/1-webcomponents-intro/article.md @@ -58,7 +58,7 @@ Компонент має: - Власний JavaScript клас. -- Структуру DOM, яка керована виключно її класом, зовнішній код не має доступу до неї (принцип «інкапсуляції»). +- Структуру DOM, яка керована виключно її класом, зовнішній код не має доступу до неї (принцип "інкапсуляції"). - Стилі CSS, застосовані до компоненти. - API: події, методи класу тощо для взаємодії з іншими компонентами. From 46d1e83cd22989d7db6279d6cb8747840874c401 Mon Sep 17 00:00:00 2001 From: Yurii Hasiuk Date: Mon, 20 Jun 2022 20:26:39 +0300 Subject: [PATCH 14/16] Update 8-web-components/1-webcomponents-intro/article.md Co-authored-by: Stanislav --- 8-web-components/1-webcomponents-intro/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/8-web-components/1-webcomponents-intro/article.md b/8-web-components/1-webcomponents-intro/article.md index 72d5caf44..9c7f950b0 100644 --- a/8-web-components/1-webcomponents-intro/article.md +++ b/8-web-components/1-webcomponents-intro/article.md @@ -59,7 +59,7 @@ Компонент має: - Власний JavaScript клас. - Структуру DOM, яка керована виключно її класом, зовнішній код не має доступу до неї (принцип "інкапсуляції"). -- Стилі CSS, застосовані до компоненти. +- Стилі CSS, застосовані до компонента. - API: події, методи класу тощо для взаємодії з іншими компонентами. Знову ж таки, весь «компонентний» підхід річ не нова і в ній немає нічого особливого. From 6879fb8c8c78f55aa66d73bb42c2f21cded601a9 Mon Sep 17 00:00:00 2001 From: Yurii Hasiuk Date: Mon, 20 Jun 2022 20:26:45 +0300 Subject: [PATCH 15/16] Update 8-web-components/1-webcomponents-intro/article.md Co-authored-by: Stanislav --- 8-web-components/1-webcomponents-intro/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/8-web-components/1-webcomponents-intro/article.md b/8-web-components/1-webcomponents-intro/article.md index 9c7f950b0..733771964 100644 --- a/8-web-components/1-webcomponents-intro/article.md +++ b/8-web-components/1-webcomponents-intro/article.md @@ -62,7 +62,7 @@ - Стилі CSS, застосовані до компонента. - API: події, методи класу тощо для взаємодії з іншими компонентами. -Знову ж таки, весь «компонентний» підхід річ не нова і в ній немає нічого особливого. +Знову ж таки, весь "компонентний" підхід річ не нова і в ньому немає нічого особливого. Існує багато фреймворків і методологій розробки для їх побудови, кожна зі своїми "фічами". Зазвичай для забезпечення «відчуття компонентів» використовуються спеціальні класи та конвенції CSS – область визначення CSS та інкапсуляція DOM. From 95fdc8567b794702ad881f116e29c3b88adf8ae1 Mon Sep 17 00:00:00 2001 From: Yurii Hasiuk Date: Mon, 20 Jun 2022 20:27:06 +0300 Subject: [PATCH 16/16] Update 8-web-components/1-webcomponents-intro/article.md Co-authored-by: Stanislav --- 8-web-components/1-webcomponents-intro/article.md | 2 +- 1 file changed, 1 insertion(+), 1 deletion(-) diff --git a/8-web-components/1-webcomponents-intro/article.md b/8-web-components/1-webcomponents-intro/article.md index 733771964..0cad28722 100644 --- a/8-web-components/1-webcomponents-intro/article.md +++ b/8-web-components/1-webcomponents-intro/article.md @@ -64,7 +64,7 @@ Знову ж таки, весь "компонентний" підхід річ не нова і в ньому немає нічого особливого. -Існує багато фреймворків і методологій розробки для їх побудови, кожна зі своїми "фічами". Зазвичай для забезпечення «відчуття компонентів» використовуються спеціальні класи та конвенції CSS – область визначення CSS та інкапсуляція DOM. +Існує багато фреймворків і методологій розробки для їх побудови, кожна зі своїми "фічами". Зазвичай для забезпечення "відчуття компонентів" використовуються спеціальні класи та конвенції CSS -- область визначення CSS та інкапсуляція DOM. "Веб компоненти" надають для цього вбудовані можливості браузера, тому нам більше не потрібно їх емулювати.