Latest posts

Верстальщик от бога
11 Sept, 04:07
Пропадающая граница в sticky-таблице. Баг CSS-рендеринга, найденный в React-проекте#почитатьПроблема заключается в том, что в таблице на React с колонками, у которых есть свойство position: sticky, иногда пропадала граница между соседними ячейками по вертикали. Причём проявлялась она не всегда и носит случайный характер. Забавно, что изменение масштаба страницы (Ctrl + колесико мыши) мгновенно возвращает исчезнувший бордер. При этом в CSS все прописано и никуда не исчезает — это чисто визуальный баг рендера.⏱Читать статью


Верстальщик от бога
9 Sept, 04:06
Вайбкодерам и Веб-разработчикам на заметку! Список сайтов с готовыми React UI-Компонентами#почитатьВо многих случаях при разработке веб-сервисов и сайтов возникает необходимость в поиске готовых UI-компонентов — как для вдохновения, так и для ускорения работы над интерфейсом. Подобные решения будут полезны всем, кто занимается веб-дизайном и веб-разработкой. В статье представлена подборка ресурсов с качественными и интересными UI-компонентами. Список будет дополняться по мере появления действительно достойных сайтов и сервисов.⏱Читать статью


Верстальщик от бога
7 Sept, 04:02
Реактивность без React или как обойтись без id в html элементах#почитатьА зачем вообще обходиться без id? Даже не знаю, но это вполне возможно, и приложение будет живым и вполне себе «реактивным». А всю «магию» при этом творит функция, которую я назвал tokenize. Конечно же я, ни в коем случае, не настаиваю на отказе от id. "Элементарные" id никому не мешают и tokenizeу тоже. Но если обходиться без id, то как же получать ссылки на DOM элементы, для обращения к ним? Вот для этого и нужна функция tokenize, которая собирает референсы в удобную структуру с ветками, подветками и листьями (ссылками на DOM элементы). А вот как она это делает, мы с Вами сейчас и разберём.⏱Читать статью


Верстальщик от бога
4 Sept, 09:42
Прагматичное руководство по современным цветам в CSS#почитатьДля большинства разработчиков работа с цветами в CSS часто сводится к тому, чтобы просто скопировать значение из файла дизайна и вставить его в редактор. Мы ведь разработчики, а не дизайнеры. Тем не менее, за последние годы в CSS произошло множество изменений, касающихся работы с цветами — от новой синтаксической формы до совсем новых возможностей, которыми могут пользоваться даже те, кто редко занимается дизайном. Если вы разрабатываете собственные цветовые схемы или хотите глубже понять, как применять теорию цвета прямо в CSS, во второй части статьи я расскажу об этом подробнее. А в этой части я сосредоточусь на том, как новые функции работы с цветом могут помочь именно разработчикам, не углубляющимся в дизайн.⏱Читать статью


Верстальщик от бога
2 Sept, 04:02
Я нанял джуна в свой open source проект. Вот что получилось#почитатьЗдравствуйте, товарищи! Сегодня у нас будет не техническая статья. Я расскажу об одном нестандартном кейсе из своей практики, суть которого отражена в заголовке. В первой части будет описание моего опыта, а далее обсудим, как можно его перенять. И не просто перенять, а использовать для решения сразу двух проблем в IT-индустрии!⏱Читать статью


Верстальщик от бога
31 Aug, 04:05
Полупрозрачный бублик, 3D-сапёр и электрорамка: самые интересные CSS-демки#почитатьПосмотрели за вас в интернете и заботливо отобрали самые интересные демки на CSS и JavaScript.⏱Читать статью


Верстальщик от бога
28 Aug, 09:51
CSS-свойство image-orientation: исправляем ориентацию изображений из EXIF#почитатьПри загрузке фотографий со смартфонов или камер на сайтах порой возникает проблема с неправильной ориентацией изображений. Это связано с тем, что устройства сохраняют ориентацию изображения в метаданных EXIF, а браузеры могут не всегда учитывать эти данные при отображении. Свойство CSS image-orientation позволяет корректировать ориентацию изображений, обеспечивая их правильное отображение.⏱Читать статью


Верстальщик от бога
26 Aug, 09:32
Кастомные медиавыражения#почитатьЧто такое кастомные медиавыражения и почему обычные CSS-переменные не работают внутри @media. Простое объяснение, понятные примеры и разбор того, как браузер вычисляет стили под капотом.⏱Читать статью


Верстальщик от бога
24 Aug, 04:09
Как совместить утилиты и рукописный CSS в атомарном подходе?#почитатьВ этой статье мы поговорим о том, нормально ли применять в рамках Atomic CSS подхода рукописный CSS. Бытуют разные мнения по этому поводу. Кто-то считает, что в атомарном подходе нужно использовать только утилиты, а кто-то допускает и произвольные сочетания рукописных CSS классов с ними. Я постараюсь разобраться в этом, аргументируя свою позицию.⏱Читать статью


Верстальщик от бога
21 Aug, 09:52
Делаем интерфейс дружелюбнее. Коллекция простых HTML/CSS лайфхаков#почитатьКрасивый и интуитивно понятный интерфейс — это моя личная страсть. Я тратил дни, чтобы докрутить свои проекты до нужного мне уровня. В итоге я начал систематически собирать приёмы HTML и CSS, которые мгновенно улучшают восприятие пользователя. Сегодня я решил показать вам несколько проверенных трюков. Выбрал самые лёгкие в освоении, чтобы вы смогли внедрить их уже сегодня, не отвлекаясь на сложности.⏱Читать статью


Верстальщик от бога
19 Aug, 09:52
HTML мёртв, да здравствует HTML#почитатьБраузеры — это очень странный мир. Хотя WebAssembly добился успеха, в том числе и на серверах, клиент по-прежнему ощущается примерно таким же, как и десять лет назад.Энтузиасты будут говорить вам, что доступ к нативным веб-API через WASM — это решённая задача, достаточно лишь минимального клея JS. Но никто не задаёт вопрос, зачем нам вообще нужно получать доступ к DOM. Это лишь один из вариантов. В этой статье мне бы хотелось объяснить, почему уже настало время отправить DOM и всевозможные API на радугу, а также поделиться некоторыми идеями о том, как это сделать. Не буду притворяться, что знаю о браузерах всё. Сегодня уже никто не знает всего, в этом-то и проблема.⏱Читать статью


Верстальщик от бога
17 Aug, 09:52
Коллекция полезных CSS фишек, которые вы редко используете#почитатьВ мире фронтенда активно всё меняется. Появляются одни инструменты, но только их выучишь — они устаревают, и нужно уже учить новые. Новые методы и API в JavaScript. Даже в HTML появляется что-то новое. И, конечно, CSS не отстаёт. В общем не удивительно, что люди забывают или не успевают услышать о возможностях в CSS. В этой статье я постараюсь показать несколько из их, которые считаю полезными.⏱Читать статью


Верстальщик от бога
14 Aug, 04:18
Все, что вам нужно знать об организации контента в Drupal#почитатьПредставьте, что ваш сайт - это большая библиотека с множеством книг на стеллажах. Конечно, вы сами, как сотрудник, так и ваши посетители, вполне оцените тот порядок, когда все предметы размещены систематизированно.⏱Читать статью
1,190Open in Telegram
Верстальщик от бога
12 Aug, 04:16
Влияние селекторов CSS на скорость рендеринга web-приложения#почитатьХотя различия в скорости работы CSS-селекторов хорошо документированы, на практике разработчики часто недооценивают их влияние на производительность. В этой статье мы количественно оценим, как некорректный выбор селекторов замедляет работу приложения, и систематизируем ключевые принципы оптимизации CSS.⏱Читать статью
1,160Open in Telegram
Верстальщик от бога
10 Aug, 09:42
Shadcn для Vue: норм или стрём?#почитатьОпыт использования shadcn-vue в продакшн проекте: что работает хорошо, а с чем придется помучиться. Честный обзор популярной UI библиотеки от практикующего разработчика. Стек: Vue/Nuxt 3, Tailwindcss 3, Typescript, Telegram WebApp.⏱Читать статью
1,150Open in Telegram
Верстальщик от бога
7 Aug, 04:02
Умный рабочий стол, который живёт по солнцу#почитатьИдея «умного» рабочего стола у меня появилась давно. Под "умным" я понимал не виджеты, прогнозы погоды и не очередную анимацию, а максимально простую идею: фон рабочего стола должен соответствовать тому времени суток, которое сейчас у меня за окном. Без условностей. Только солнце.⏱Читать статью
1,280Open in Telegram
Верстальщик от бога
4 Aug, 17:02
I Learned The First Rule of ARIA the Hard Way#почитатьSemantic HTML does a lot more accessibility work than we usually give it credit for already — and ARIA is simple to abuse when we use it both as a shortcut and as a supplement.⏱Читать статью
1,140Open in Telegram
Верстальщик от бога
4 Aug, 13:30
🔴 Тестовое собеседование с ТимЛидом Frontend-разработки в этот четверг6 августа(в четверг!) в 19:00 по мск приходи онлайн на открытое собеседование, чтобы посмотреть на настоящее интервью на Middle Frontend-разработчика.Как это будет: 📂 Алексей Романов, Teamlead в Underhood.dev с опытом 6+ лет, будет задавать реальные вопросы и задачи разработчику-добровольцу 📂 Алексей будет комментировать каждый ответ респондента, чтобы дать понять, чего от вас ожидает собеседующий на интервью 📂 В конце можно будет задать любой вопрос АлексеюЭто бесплатно. Эфир проходит в рамках менторской программы от ШОРТКАТ для Frontend-разработчиков, которые хотят повысить свой грейд, ЗП и прокачать скиллы.Переходи в нашего бота, чтобы получить ссылку на эфир → @shortcut_front_botРеклама. О рекламодателе.


Верстальщик от бога
3 Aug, 04:05
Atomic CSS: верстка и легкость бытия#почитатьОбсудим имеющиеся проблемы в верстке и посмотрим, как атомарный подход их решает (или не решает). Разберем основные мифы, посмотрим на лучшие практики этого подхода и сделаем выводы. Эту статью можно отчасти считать продолжением моей предыдущей, по данной теме, хотя напрямую они не связанны. Но если там был хардкор и технические детали, то здесь уже разберем прикладные вопросы: как верстать в Atomic CSS, чтобы получить заявленный эффект.⏱Читать статью


Верстальщик от бога
29 Jul, 20:02
Верстаем сложный прогрессбар в 2026 году#почитатьРаньше, чтобы сделать круговой прогрессбар, мы страдали с SVG. Мне до сих пор больно заглядывать в инспектор на старых реализациях. Сегодня всё кардинально упростилось. Современный CSS позволяет собрать сложный, гибкий и красивый круговой прогрессбар буквально на одном div и на одном CSS-свойстве. И всё это — с отличной браузерной поддержкой. В этой статье я разберу именно этот приём. Сначала — ключевую идею подхода, затем — возможности кастомизации, после этого добавлю немного визуальной «дороговизны», удобные ручки управления и экспериментальную CSS-логику. Да-да, напоследок мы немного попрограммируем на CSS!⏱Читать статью

Related Channels
Other channels in the same section of the catalogue.
