Інструменти розробника
9 питань
Як відкрити консоль розробника?
•F12 або Ctrl+Shift+I (Cmd+Option+I на Mac).
•Правий клік → Переглянути код.
•Вкладка Console для логів і команд.
•Ctrl+Shift+J — одразу в консоль (Chrome).
•Помилки сторінки відображаються тут.
Як емулярувати мобільний пристрій?
•Відкрийте DevTools (F12).
•Натисніть Ctrl+Shift+M або іконку пристроїв.
•Виберіть пристрій із списку.
•Або задайте розмір вручну.
•Емуляє тач-сюжети і User-Agent.
Як знайти CSS-стилі елемента?
•Відкрийте DevTools.
•Ctrl+Shift+C — режим вибору елемента.
•Клікніть на елемент на сторінці.
•Вкладка Styles показує застосовані стилі.
•Computed — обчислені значення.
Як очистити кеш для одного сайту?
•DevTools → вкладка Application (Chrome) або Storage (Firefox).
•Clear storage / Clear site data.
•Або правий клік на кнопку оновлення → 'Очистити кеш і перезавантажити'.
•Працює при відкритих DevTools.
Як симулювати повільне з'єднання?
•DevTools → вкладка Network.
•Випадаючий список 'No throttling'.
•Виберіть: Slow 3G, Fast 3G, Offline.
•Або створіть свій профіль.
•Тестуйте завантаження при поганому інтернеті.
Інструменти розробника: як читати запити/відповіді в Network і шукати помилки?
За темою «Інструменти розробника» почніть з простого: оновіть браузер, очистіть кеш/куки для проблемного сайту і вимкніть розширення по одному.
Інструменти розробника: як профілювати продуктивність (Performance/Lighthouse)?
Практика для «Інструменти розробника»: перевірте в приватному режимі і в іншому браузері. Так швидко зрозуміло — проблема на сайті або в профілі/розширеннях.
Інструменти розробника: як налагоджувати JavaScript і ставити breakpoints?
Відповідь по «Інструменти розробника»: увімкніть синхронізацію, але тримайте 2FA і резервні коди. Безпека важливіша за зручність.
Інструменти розробника: як працювати з Application/Storage (cookies, localStorage)?
Для «Інструменти розробника» корисно: налаштувати менеджер паролів і блокування трекерів, але не ставити десятки розширень одночасно.