«Атакуют сотни вайб-кодеров, которые не отличают метод массива от цикла»

Максим Самарцев, директор Maxis, — о том, как нейросети сломали мостик между командой и тем джуном, которого хочется брать в команду.

Запись эфира: смотреть на YouTube | смотреть в VK
🦖 Программа обучения

«Увеличил шрифт на 2px». «Поменял оттенок фона». «Ещё раз поменял». «Откатил».

Во время ревью такие коммиты полезны — ревьюер видит, что именно вы поправили. Но перед слиянием они превращают историю в шум: 15 технических правок вместо одного осмысленного коммита.

Решение — git rebase -i HEAD~N. Открываете интерактивный ребейз, верхний коммит оставляете pick, остальные помечаете как squash или fixup — и на выходе один чистый коммит с понятным сообщением.

А можно не делать это руками. Если сразу коммитить правки через git commit --fixup <хеш>, то git rebase -i --autosquash HEAD~N расставит всё сам.

В статье — пошаговый разбор со скриншотами команд: почему после ребейза обычный git push не проходит и нужен форс-пуш, и как настроить редактор Git, чтобы не попасть в Vim. #git

👀 Читать статью

<article> или <aside>? В макете они выглядят одинаково, и их постоянно путают — а перепутанные теги ломают семантику страницы.

<article> — самостоятельная единица контента: её можно вынести на другую страницу или сайт, и она останется осмысленной (пост, карточка товара, комментарий).

<aside> — дополнение к основному контенту рядом: врезка, реклама, блок похожих материалов. Уберите его, и основной смысл не пострадает.

В статье — схема смысловых секций страницы и шпаргалка с вопросами, которые помогают развести теги на конкретных примерах. #html

☝️ Читать статью

Доступность часто представляют как режим с крупным шрифтом. На деле это о том, как сайт читают скринридеры, работает ли он полностью с клавиатуры, хватает ли контраста людям с нарушениями зрения и переживает ли страница смену ориентации экрана.

Стандарт WCAG 2.1 от W3C строится на четырёх принципах: воспринимаемость, управляемость, понятность и устойчивость. В каждом — конкретные критерии. Значимым изображениям нужны текстовые альтернативы, формам — понятные подписи. А состояния кнопок и ссылок должны считываться без опоры на цвет.

Контраст проверяется через WebAIM, а симулятор дальтонизма встроен прямо в Chrome DevTools. В статье разбираем важные критерии на реальных сайтах: Яндекс, Кинопоиск, Etsy, Dropbox. #a11y #html

💡 Читать статью

Сегодня последний день скидки 60% на курс «Анимация для фронтендеров 2026» — промокод MOVE60 работает до конца дня и только на этот курс.

Курс «Анимация для фронтендеров 2026»: CSS, SVG, Canvas, GLSL-шейдеры и Three.js — весь стек на русском. Два проекта в портфолио.

👍 Записаться на курс

Растянутая аватарка с овальным лицом на сайте — это object-fit: fill по умолчанию и две минуты невнимательности.

Свойство object-fit : cover заполняет бокс и обрезает лишнее, пропорции не ломаются. contain вписывает изображение целиком, оставляя поля. fill растягивает без разбора — именно это и случается с аватарками по умолчанию. none показывает в оригинальных размерах, scale-down выбирает между contain и none автоматически. В статье разбираем каждое значение на примерах. #css

👀 Читать статью

Git — инструмент, без которого не обходится ни один проект. Мы собрали бесплатный учебник по Git и GitHub — 11 глав от введения в системы контроля версий до решения типичных проблем.

Структура учебника выстроена так, чтобы двигаться последовательно: сначала базовые понятия и команды clone, pull, push, add, commit, потом регистрация на GitHub, работа в VS Code, GitHub Desktop и консоли, следом — бесплатный хостинг на GitHub Pages и разбор ситуаций, когда что-то пошло не так.

Последняя глава — перевод «First Aid Git»: что делать, если случайно удалили ветку, отправили не тот коммит или запутались в слиянии.

Учебник бесплатный, читать можно в любом порядке. #git #github

⭐ Читать статью

Каждый раз вручную сжимать изображения, минифицировать CSS и собирать спрайт — это звучит как рабочий процесс только до тех пор, пока файлов немного. Когда проект вырастает, рутина начинает занимать заметную часть времени.

Автоматизация передаёт эти задачи компьютеру. Минификация HTML, CSS и JavaScript, сжатие изображений, генерация WebP, сборка sprite.svg — всё это делается один раз в конфигурации, а дальше запускается одной командой.

Основа цепочки — Node.js и npm. Npm устанавливает нужные пакеты из внешних библиотек и запускает задачи через консоль. Список зависимостей хранится в package.json: достаточно положить файл в папку проекта и выполнить npm install — все инструменты скачаются автоматически. Сами задачи прописываются в gulpfile.js, который Gulp выполняет по команде.

В статье разбор каждого звена цепочки с примерами package.json и объяснением, что такое зависимости и зависимости для разработчиков. #npm

☝️ Читать статью