Чем я часто пользуюсь сам и могу порекомендовать другим.
- Emmet, генератор HTML-кода из «CSS-селекторов»;
- Can I Include, ответит на вопрос «Можно ли класть один тег в другой?»;
- HTML head, поможет найти нужный элемент для
<head>
страницы; - Logical Content Flow, проверит найти проблемы с заголовками, их порядком и отображением;
- Better Mobile Inputs, поможет подобрать
<input>
и атрибуты для него так, чтобы им было удобно пользоваться на мобильных; - Weblind, рекомендации по разработке сайтов для людей с нарушениями зрения;
- Inclusive Components, примеры реализации слайдеров, аккордеонов и других компонентов с упором на доступность;
- Axe, браузерный плагин для комплексной проверки доступности страниц;
- Good Email Code, справочник и набор рекомендаций для пуленепробиваемой вёрстки писем;
- How to Favicon in 2021, статья-чеклист о том, как добавлять фавиконку на сайт без лишнего кода;
- W3C Validator, валидатор HTML-кода.
- Squoosh, приложение, CLI и API для оптимизации графики;
- SVG URL Encoder, кодирует SVG в URL-строку, чтобы использовать его в
background
без base64; - SVG OMG, оптимизатор SVG;
- Social Image Preview, предпросмотрщик изображений для соцсетей;
- Facebook Debug, дебагер соц-изображений для Facebook.
- Can I Use, поможет проверить браузерную поддержку свойства;
- Can I Use CMD, CLI для Can I Use;
- Nth Tester, поможет проверить, так ли работает ваш
nth-child
селектор; - Flexbox Playground, визуализирует работу флекс-свойств;
- Grid Lover, конструктор вертикального ритма и отступов для заголовков и параграфов;
- Specificity Calc, калькулятор специфичности селекторов;
- HEX to RGB, конвертер цветов между разными цветовыми схемами;
- CSS Gradient, конструктор CSS градиентов;
- Easings, справочник по easing-функциям с примерами;
- Cubic Bezier, конструктор и редактор кривых Безье;
- CSS Patterns, коллекция фоновых узоров на чистом CSS;
- CSS Shapes, набор часто используемых фигур на чистом CSS;
- CSS Triggers, подскажет, какие свойства запускают layout, paint и composite.
- Oh shit! Git, подскажет, что делать, если вы допустили ошибку в гите;
- Git Explorer, справочник по командам и возможностям гита.
- You Might Not Need JS, набор фич, некоторые их которых действительно можно сделать без JS;
- HTML DOM, набор нативных функций для работы с DOM-деревом;
- Does it Mutate, подскажет, какие методы изменяют массив, а какие нет;
- Keycode Info, покажет код нажатой клавиши;
- Tmstmp, переводит даты в таймштампы и обратно;
- Generating Random Integers, пример генерации случайного целого с подробным объяснением работы;
- Jest Mocking Strategies, мои моки в Jest никогда не работают с первого раза;
- Debounce / Throttle, показывает разницу между
debounce
иthrottle
; - Anything to Anything Transformer, конвертирует что угодно во что угодно;
- Regex 101, редактор и тестер регулярных выражений с объяснениями каждого символа и примерами.
- HTTP Statuses, список HTTP статусов ответа с их значениями;
- Application Security, интерактивный чеклист по уязвимостям веб-приложений с объяснениями и рекомендациями к защите;
- Checklist for Changing Data Model, чеклист для миграции данных и схем данных.
- White Spaces, список всех существующих пробелов и рекомендации по использованию каждого;
- Типограф, правит пунктуацию, ставит неразрывные пробелы и проч.;
- Markdown Cheatsheet, справочник по MD;
- Markdown Editor, визуальный редактор MD;
- Polacode, скриншоттер для фрагментов кода;
- Resume.io, конструктор CV.