ЛУЧШИЕ РАСШИРЕНИЯ GOOGLE CHROME ДЛЯ РАЗРАБОТЧИКОВ ПРОГРАММНОГО ОБЕСПЕЧЕНИЯ (ДРУЖЕСТВЕННО ДЛЯ НАЧИНАЮЩИХ)
1. Wappalyzer
Как новые разработчики, нам интересно практически все, что есть на веб-странице. Мы хотим знать, что заставляет веб-страницу работать так, как она работает… мы хотим знать все об этой веб-странице! Мы просто хотим воспроизвести или настроить его и так далее…. Хорошие новости!! Возможно! Теперь ваше любопытство можно удовлетворить, просто установив Wappalyzer в расширения Chrome. Wappalyzer - это расширение, которое помогает определять веб-технологии, используемые при создании определенного веб-сайта. С помощью Wappalyzer вы можете узнать, какую CMS использует веб-сайт, а также какие фреймворки, платформы электронной коммерции, библиотеки JavaScript и многое другое.
2. CSS Peeper
Вы когда-нибудь задумывались, что такое высота строки, шрифт или размер кнопки на веб-сайте? CSS Peeper позволяет вам проверять свойства CSS и проверять скрытый стиль CSS объектов, цветов и ресурсов в Интернете. Это расширение проверяет стили простым, хорошо организованным и красивым способом.
3. WhatFont
Поскольку мы все еще новички и стараемся изо всех сил определять шрифты, когда видим их, любим их или хотим использовать в нашем собственном дизайне. Определить некоторые шрифты, особенно те, которые мы не видим каждый день, может быть довольно сложно. WhatFont поможет вам определить шрифт, семейство шрифтов, толщину шрифта и другую информацию, относящуюся к шрифту.
4 . Figma в код (React / HTML / Vue.js)
Мы все знаем, насколько напряженной может быть попытка проанализировать конкретный дизайн фигма, чтобы выполнить код, чтобы получить эту точную копию на нашей веб-странице. Больше не беспокойтесь! Поскольку это расширение Chrome помогает вам получить удобный для разработчиков HTML, CSS, код React и Vue.js для дизайна прямо из Figma. С помощью этого расширения Chrome вы можете:
· Выберите компоненты дизайна Figma и экспортируйте чистый, удобный для разработчиков код.
· Экспорт кода прямо из Figma в вашем браузере.
· Экономьте время, сводя к минимуму ворчливую работу, сохраняя при этом контроль над своим кодом.
5. Изменение размера окна просмотра - инструмент адаптивного тестирования
Мы живем в мире, где каждый хочет, чтобы все его вещи достигли цели. Следовательно, потребность в адаптивном веб-дизайне. Чтобы быть хорошим разработчиком, вы должны уметь создавать адаптивные веб-страницы, и для новичков может быть довольно сложно получить точные размеры функций на вашем сайте для разных размеров представления. Так что, чтобы упростить вам жизнь как разработчику, вы должны получить Viewport Resizer. Viewport Resizer - это инструмент для тестирования адаптивного дизайна, позволяющий проверить скорость отклика любого веб-сайта - это займет всего 2 секунды! Эмулируйте различные разрешения экрана. Даже для профессионалов это расширение Chrome - самый умный способ поделиться определенной средой устройств и точек останова непосредственно с вашей командой и клиентом.
ПРИМЕЧАНИЕ. Этот инструмент не должен заменять имитацию реального устройства. Это скорее помогает вам, вашей команде и клиенту, тестировать статусы, переходы, длину текста и т. Д. На разных типах устройств.
6. BrowserStack
Все мы используем определенный браузер для запуска наших кодов (в основном Google Chrome), поэтому мы видим наши результаты только глазами одного браузера. BrowseStack, мгновенно протестируйте свою веб-страницу в любом браузере на компьютере или мобильном устройстве.
ПРИМЕЧАНИЕ. Для нормальной работы этого расширения Chrome у вас должна быть учетная запись BrowserStack.
