JavaScript debug: отлаживаем вэб приложения в браузере
Chrome dev tools: инструменты разработчика в браузере Современные вэб приложения ипользуют много JavaScript кода, который также требует отладки и мониторинга своей работы, как и любой другой код на стороне сервера. Для упрощения разработки сделано немало полезных и удобных инструментов. Огромное количество этих инструментов собрано в браузере, но наиболее широкий набор представлен в Chrome и Firefox, способных заменить сложную IDE, а порой и превосходящие любую IDE. Например Chrome (Chromium) умеет не только просматривать сформированное DOM дерево и редактировать его "на лету" в части тэго и стилей, но и отслеживать сетевые запросы браузера к серверу, устанавливать breakpoint на любую строку в исходном коде, breakpoints по условию и останавливаться по ошибке. Не менее удобными инструментами являются вэб консоль (js console), позволяющая выполнять любой JS код в контексте текущей страницы и эмулятор различных устройств с различными разрешениями экрана и плотностью пикселей (с подменой UserAgent и эмуляцией задержек сети) ➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖ ➡ Твиттер: https://twitter.com/letsCodeDru ➡ Чат в Discord: https://discord.gg/xs6XxSx ➡ Группа Вконтакте: https://vk.com/letscodedru ➡ Канал в Telegram: https://t.me/letsCode_dru ➡ Чат в Telegram: https://t.me/joinchat/FeiP9xEhqHajfqhLr4z-Nw ➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖ Поддержать проект: ➡ Patreon https://www.patreon.com/letscodedru ➡ Яндекс.Деньги https://money.yandex.ru/to/41001451675086 ➡ PayPal paypal.me/letscodedru ➡ Qiwi https://qiwi.me/letscode ➡ WebMoney/BitCoin https://funding.webmoney.ru/d/drucoder ➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖ ➡ Ссылка на канал: https://www.youtube.com/channel/UC1g3kT0ZcSXt4_ZyJOshKJQ ➡ Ссылка на Яндекс.Дзен: https://zen.yandex.ru/media/id/5ac20956168a91ffeae449c5
Chrome dev tools: инструменты разработчика в браузере Современные вэб приложения ипользуют много JavaScript кода, который также требует отладки и мониторинга своей работы, как и любой другой код на стороне сервера. Для упрощения разработки сделано немало полезных и удобных инструментов. Огромное количество этих инструментов собрано в браузере, но наиболее широкий набор представлен в Chrome и Firefox, способных заменить сложную IDE, а порой и превосходящие любую IDE. Например Chrome (Chromium) умеет не только просматривать сформированное DOM дерево и редактировать его "на лету" в части тэго и стилей, но и отслеживать сетевые запросы браузера к серверу, устанавливать breakpoint на любую строку в исходном коде, breakpoints по условию и останавливаться по ошибке. Не менее удобными инструментами являются вэб консоль (js console), позволяющая выполнять любой JS код в контексте текущей страницы и эмулятор различных устройств с различными разрешениями экрана и плотностью пикселей (с подменой UserAgent и эмуляцией задержек сети) ➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖ ➡ Твиттер: https://twitter.com/letsCodeDru ➡ Чат в Discord: https://discord.gg/xs6XxSx ➡ Группа Вконтакте: https://vk.com/letscodedru ➡ Канал в Telegram: https://t.me/letsCode_dru ➡ Чат в Telegram: https://t.me/joinchat/FeiP9xEhqHajfqhLr4z-Nw ➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖ Поддержать проект: ➡ Patreon https://www.patreon.com/letscodedru ➡ Яндекс.Деньги https://money.yandex.ru/to/41001451675086 ➡ PayPal paypal.me/letscodedru ➡ Qiwi https://qiwi.me/letscode ➡ WebMoney/BitCoin https://funding.webmoney.ru/d/drucoder ➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖➖ ➡ Ссылка на канал: https://www.youtube.com/channel/UC1g3kT0ZcSXt4_ZyJOshKJQ ➡ Ссылка на Яндекс.Дзен: https://zen.yandex.ru/media/id/5ac20956168a91ffeae449c5