πŸ’» Π­ΠΊΡΠΊΠ»ΡŽΠ·ΠΈΠ²Π½Ρ‹ΠΉ слив "Chrome DevTools: Π˜Π½ΡΡ‚Ρ€ΡƒΠΌΠ΅Π½Ρ‚Ρ‹ тСстировщика" ΠΎΡ‚ АрсСний Π‘Π°Ρ‚Ρ‹Ρ€ΠΎΠ²: https://www.youtube.com/watch?v=ub9VDHMeRbc ОписаниС! Π‘ΠΊΠ°Ρ‡Π°ΠΉ бСсплатно πŸš€ | KURSAR | KURSAR
PRO-доступ
home Главная chevron_right folder АдминистрированиС ΠΈ ΠΏΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅ chevron_right folder ΠŸΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅ ΠΈ автоматизация chevron_right
folder_open [АрсСний Π‘Π°Ρ‚Ρ‹Ρ€ΠΎΠ²] Chrome DevTools: Π˜Π½ΡΡ‚Ρ€ΡƒΠΌΠ΅Π½Ρ‚Ρ‹ тСстировщика
[АрсСний Π‘Π°Ρ‚Ρ‹Ρ€ΠΎΠ²] Chrome DevTools: Π˜Π½ΡΡ‚Ρ€ΡƒΠΌΠ΅Π½Ρ‚Ρ‹ тСстировщика

[АрсСний Π‘Π°Ρ‚Ρ‹Ρ€ΠΎΠ²] Chrome DevTools: Π˜Π½ΡΡ‚Ρ€ΡƒΠΌΠ΅Π½Ρ‚Ρ‹ тСстировщика

https://www.youtube.com/watch?v=ub9VDHMeRbc
ОписаниС курса:
Chrome DevTools: Π˜Π½ΡΡ‚Ρ€ΡƒΠΌΠ΅Π½Ρ‚Ρ‹ тСстировщика

ВСстировщик всСгда Ρ€Π°Π±ΠΎΡ‚Π°Π΅Ρ‚ Π² условиях нСдостатка Π²Ρ€Π΅ΠΌΠ΅Π½ΠΈ: Π±Π΅ΠΊΠ»ΠΎΠ³ Π½Π΅ ΡƒΠΌΠ΅Π½ΡŒΡˆΠ°Π΅Ρ‚ΡΡ, Ρ€Π΅Π»ΠΈΠ· Π½Π° носу, Π° ΠΏΡ€ΠΎΡ‚Π΅ΡΡ‚ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ Π½ΡƒΠΆΠ½ΠΎ Π΅Ρ‰Π΅ ΠΌΠ½ΠΎΠ³ΠΎΠ΅. Π§Ρ‚ΠΎΠ±Ρ‹ ΠΎΠ±Π΅ΡΠΏΠ΅Ρ‡ΠΈΡ‚ΡŒ качСство ΠΏΡ€ΠΎΠ΄ΡƒΠΊΡ‚Π°, Π½ΡƒΠΆΠ½ΠΎ постоянно ΠΏΠΎΠ²Ρ‹ΡˆΠ°Ρ‚ΡŒ ΡΡ„Ρ„Π΅ΠΊΡ‚ΠΈΠ²Π½ΠΎΡΡ‚ΡŒ собствСнной Ρ€Π°Π±ΠΎΡ‚Ρ‹. Один ΠΈΠ· способов - ΠΎΡΠ²ΠΎΠΈΡ‚ΡŒ Π½Π΅ΠΊΠΎΡ‚ΠΎΡ€Ρ‹Π΅ инструмСнты, ΠΎΠ±Π»Π΅Π³Ρ‡Π°ΡŽΡ‰ΠΈΠ΅ Ρ€ΡƒΡ‚ΠΈΠ½Π½Ρ‹Π΅ дСйствия Π² тСстировании.

Π’ Π²Π΅Π±-тСстировании часто трСбуСтся Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ с ΠΈΠ·Π½Π°Π½ΠΊΠΎΠΉ страницы: ΡΠΌΠΎΡ‚Ρ€Π΅Ρ‚ΡŒ Π»ΠΎΠΊΠ°Ρ‚ΠΎΡ€Ρ‹, ΠΎΠΏΡ€Π΅Π΄Π΅Π»ΡΡ‚ΡŒ врСмя Π·Π°Π³Ρ€ΡƒΠ·ΠΊΠΈ, Π²Ρ‹Π΄Π΅Π»ΡΡ‚ΡŒ ΠΎΡ‚Π΄Π΅Π»ΡŒΠ½Ρ‹Π΅ элСмСнты. Π”Π΅-Ρ„Π°ΠΊΡ‚ΠΎ стандартом Π² индустрии стал инструмСнт Chrome DevTools, встроСнный прямо Π² Π±Ρ€Π°ΡƒΠ·Π΅Ρ€ Chrome. Π Π°Π·Ρ€Π°Π±ΠΎΡ‚Ρ‡ΠΈΠΊΠΈ ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‚ Π΅Π³ΠΎ для ΠΎΡ‚Π»Π°Π΄ΠΊΠΈ ΠΊΠΎΠ΄Π°, Π½ΠΎ этот инструмСнт ΡˆΠΈΡ€ΠΎΠΊΠΎ распространСн ΠΈ Π² тСстировании. Π‘ΠΎΠ»Π΅Π΅ Ρ‚ΠΎΠ³ΠΎ, основныС ΠΏΠ°Ρ‚Ρ‚Π΅Ρ€Π½Ρ‹ Ρ€Π°Π±ΠΎΡ‚Ρ‹, supersliv.biz Π·Π°Π΄Π°Π½Π½Ρ‹Π΅ Chrome DevTools, ΠΈΡΠΏΠΎΠ»ΡŒΠ·ΡƒΡŽΡ‚ΡΡ ΠΊΠ°ΠΊ Π² Π΄Ρ€ΡƒΠ³ΠΈΡ… Π²Π΅Π±-инструмСнтах, Ρ‚Π°ΠΊ ΠΈ Π² Ρ€Π°Π±ΠΎΡ‚Π΅ с ΠΌΠΎΠ±ΠΈΠ»ΡŒΠ½Ρ‹ΠΌΠΈ устройствами. ЕстСствСнно, Ρ…ΠΎΡ€ΠΎΡˆΠ΅Π΅ Π·Π½Π°Π½ΠΈΠ΅ Ρ‚Π°ΠΊΠΎΠΉ ΡƒΡ‚ΠΈΠ»ΠΈΡ‚Ρ‹ Π±ΡƒΠ΄Π΅Ρ‚ плюсом для любого тСстировщика.

ΠšΡƒΡ€Ρ Β«Chrome DevTools: Π˜Π½ΡΡ‚Ρ€ΡƒΠΌΠ΅Π½Ρ‚Ρ‹ тСстировщика» создан для быстрого погруТСния Π² Π½Π°Π²Ρ‹ΠΊΠΈ, Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΡ‹Π΅ ΠΈΠΌΠ΅Π½Π½ΠΎ тСстировщику. ВСория даСтся Π² объСмС, минимально Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΠΎΠΌ для ΠΏΡ€Π°ΠΊΡ‚ΠΈΠΊΠΈ. Знания ΠΈ Π½Π°Π²Ρ‹ΠΊΠΈ, ΠΏΡ€ΠΈΠΎΠ±Ρ€Π΅Ρ‚Π΅Π½Π½Ρ‹Π΅ Π½Π° этом курсС, ΠΏΠΎΠΌΠΎΠ³ΡƒΡ‚ Π²Π°ΠΌ эффСктивно Ρ€Π°Π±ΠΎΡ‚Π°Ρ‚ΡŒ с Chrome DevTools сразу ΠΏΠΎ ΠΎΠΊΠΎΠ½Ρ‡Π°Π½ΠΈΠΈ занятий.

На этом курсС Π²Ρ‹ Π½Π°ΡƒΡ‡ΠΈΡ‚Π΅ΡΡŒ:
ΠŸΠΈΡΠ°Ρ‚ΡŒ CSS ΠΈ XPath Π»ΠΎΠΊΠ°Ρ‚ΠΎΡ€Ρ‹;
Π›ΠΎΠ²ΠΈΡ‚ΡŒ JS-ошибки;
ΠžΡ‚Π»ΠΈΡ‡Π°Ρ‚ΡŒ Ρ‚ΠΈΠΏΡ‹ запросов Π΄Ρ€ΡƒΠ³ ΠΎΡ‚ Π΄Ρ€ΡƒΠ³Π°;
ΠŸΡ€ΠΎΠ²Π΅Ρ€ΡΡ‚ΡŒ сайт ΠΏΠΎΠ΄ Π½Π°Π³Ρ€ΡƒΠ·ΠΊΠΎΠΉ;
Π­ΠΌΡƒΠ»ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒ экран ΠΌΠΎΠ±ΠΈΠ»ΡŒΠ½Ρ‹Ρ… устройств;
ΠœΠ΅Π½ΡΡ‚ΡŒ ΡΠΊΠΎΡ€ΠΎΡΡ‚ΡŒ соСдинСния;
ΠŸΡ€ΠΎΠ²Π΅Ρ€ΡΡ‚ΡŒ сСртификаты бСзопасности.
ΠŸΡ€ΠΎΠ³Ρ€Π°ΠΌΠΌΠ° Ρ‚Ρ€Π΅Π½ΠΈΠ½Π³Π°
Π’Π²Π΅Π΄Π΅Π½ΠΈΠ΅
Π§Ρ‚ΠΎ Ρ‚Π°ΠΊΠΎΠ΅ Chrome DevTools.
Начало Ρ€Π°Π±ΠΎΡ‚Ρ‹ с Chrome DevTools
Elements. Π Π°Π±ΠΎΡ‚Π° с DOM страницы
ΠšΡ€Π°Ρ‚ΠΊΠΈΠΉ ΠΎΠ±Π·ΠΎΡ€ HTML:
Ρ‚Π΅Π³
Π°Ρ‚Ρ€ΠΈΠ±ΡƒΡ‚ Ρ‚Π΅Π³Π°
Ρ‚Π΅Π³ΠΈ html
head
body
script
Π Π΅Π΄Π°ΠΊΡ‚ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅ HTML страницы Π½Π° Π»Π΅Ρ‚Ρƒ
ΠšΡ€Π°Ρ‚ΠΊΠΈΠΉ ΠΎΠ±Π·ΠΎΡ€ CSS - стили элСмСнтов ΠΈ ΠΈΡ… ΡΠΎΡΡ‚Π°Π²Π»ΡΡŽΡ‰ΠΈΠ΅
Π Π΅Π΄Π°ΠΊΡ‚ΠΈΡ€ΠΎΠ²Π°Π½ΠΈΠ΅ CSS страницы Π½Π° Π»Π΅Ρ‚Ρƒ
Π Π°Π±ΠΎΡ‚Π° с Π»ΠΎΠΊΠ°Ρ‚ΠΎΡ€Π°ΠΌΠΈ - CSS ΠΈ XPath
Console. Π Π°Π±ΠΎΡ‚Π° с JavaScript
JS-ошибки
JS-Π΄Π΅Π±Π°Π³ ΠΈ JS-Π»ΠΎΠ³ΠΈ
ΠŸΡ€ΠΎΡΡ‚ΠΎΠΉ JS своими Ρ€ΡƒΠΊΠ°ΠΌΠΈ
Sources. Π Π°Π±ΠΎΡ‚Π° с ΠΏΠΎΠ΄Π³Ρ€ΡƒΠΆΠ°Π΅ΠΌΡ‹ΠΌΠΈ Π΄Π°Π½Π½Ρ‹ΠΌΠΈ
Π—Π°Π³Ρ€ΡƒΠΆΠ΅Π½Π½Ρ‹Π΅ CSS-стили
Π—Π°Π³Ρ€ΡƒΠΆΠ΅Π½Π½Ρ‹ΠΉ JS-ΠΊΠΎΠ΄
Π—Π°Π³Ρ€ΡƒΠΆΠ΅Π½Π½Ρ‹Π΅ ΠΊΠ°Ρ€Ρ‚ΠΈΠ½ΠΊΠΈ
Π€Π°ΠΉΠ»Ρ‹ со сторонних рСсурсов
CDN
NetWork. Π Π°Π±ΠΎΡ‚Π° с запросами
Π’ΠΈΠΏΡ‹ запросов: HAR, JS, CSS, Img
HAR-запросы. Как устроСн HTTP-ΠΏΡ€ΠΎΡ‚ΠΎΠΊΠΎΠ»
AJAX-запросы
Π Π°Π±ΠΎΡ‚Π° с Ρ„ΠΈΠ»ΡŒΡ‚Ρ€Π°ΠΌΠΈ
Π Π°Π±ΠΎΡ‚Π° с кСшСм ΠΈ Π»ΠΎΠ³Π°ΠΌΠΈ ΠΈ ΠΏΡ€ΠΎΡ‡ΠΈΠΌ.
Performance. ВСстированиС Π½Π°Π³Ρ€ΡƒΠ·ΠΊΠΈ Π½Π° сайт
JS Heap
ЦПУ
Ноды, Π΄ΠΎΠΊΡƒΠΌΠ΅Π½Ρ‚Ρ‹ ΠΈ Π΄Ρ€ΡƒΠ³ΠΈΠ΅ Π²ΠΈΠ΄Ρ‹ Π½Π°Π³Ρ€ΡƒΠ·ΠΊΠΈ
Application. Π Π°Π±ΠΎΡ‚Π° с Ρ‚Π΅ΠΊΡƒΡ‰ΠΈΠΌ ΠΏΡ€ΠΈΠ»ΠΎΠΆΠ΅Π½ΠΈΠ΅ΠΌ
Storage ΠΈ Π΅Π³ΠΎ Π²ΠΈΠ΄Ρ‹
Π Π°Π±ΠΎΡ‚Π° с Cookie
Π Π°Π±ΠΎΡ‚Π° с Cache
Security. Π Π°Π±ΠΎΡ‚Π° с бСзопасным соСдинСниСм
HTTPS ΠΈ TLS
Π—Π°Ρ‡Π΅ΠΌ трСбуСтся бСзопасноС соСдинСниС
ΠŸΡ€ΠΎΠ²Π΅Ρ€ΠΊΠ° сСртификатов
Device bar. Π˜ΠΌΠΈΡ‚ΠΈΡ€ΡƒΠ΅ΠΌ Ρ€Π°Π±ΠΎΡ‚Ρƒ с дСвайсами

ΠžΡ‚Π»ΠΈΡ‡ΠΈΡ Desktop Web ΠΈ Mobile Web
Π Π°Π±ΠΎΡ‚Π° с ΠΎΠ±Ρ€Π°Π·Π°ΠΌΠΈ
Network conditions. Π Π°Π±ΠΎΡ‚Π° с соСдинСниСм

ΠšΠ°ΡΡ‚ΠΎΠΌΠΈΠ·Π°Ρ†ΠΈΡ скорости соСдинСния
User agent
ΠŸΠΎΠ΄Ρ€ΠΎΠ±Π½Π΅Π΅:
favorite 0
star 0

ВрСбуСтся авторизация

account_circle

Для использования этой Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΠΎ Π²ΠΎΠΉΡ‚ΠΈ Π² систСму ΠΈΠ»ΠΈ Π·Π°Ρ€Π΅Π³ΠΈΡΡ‚Ρ€ΠΈΡ€ΠΎΠ²Π°Ρ‚ΡŒΡΡ.

login Π’ΠΎΠΉΡ‚ΠΈ person_add РСгистрация

ВрСбуСтся PRO доступ

workspace_premium

Для доступа ΠΊ этой Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΠΎ ΠΎΡ„ΠΎΡ€ΠΌΠΈΡ‚ΡŒ подписку PRO ΠΈ ΠΏΠΎΡΡ‚Π°Π²ΠΈΡ‚ΡŒ Π»Π°ΠΉΠΊ курсу.

credit_card ΠŸΠΎΠ»ΡƒΡ‡ΠΈΡ‚ΡŒ PRO доступ

ВрСбуСтся ΠΏΠΎΡΡ‚Π°Π²ΠΈΡ‚ΡŒ Π»Π°ΠΉΠΊ

favorite_border

Для доступа ΠΊ этой Ρ„ΡƒΠ½ΠΊΡ†ΠΈΠΈ Π½Π΅ΠΎΠ±Ρ…ΠΎΠ΄ΠΈΠΌΠΎ ΠΏΠΎΡΡ‚Π°Π²ΠΈΡ‚ΡŒ ΠΡ€Π°Π²ΠΈΡ‚ΡŒΡΡ этому курсу.

arrow_back Π’Π΅Ρ€Π½ΡƒΡ‚ΡŒΡΡ