Библиотеки UI компонент популярны и удобны в некоторых случаях, но у них тоже есть обратные стороны. Одно дело, когда делаешь админку и используешь десятки компонент, другое - когда тебе надо всего пару компонент. Было проведено исследование - взяты три HTML элемента: Button, Input и Select, и проверено, насколько увеличатся js и css бандлы если использовать для них одну из 10 распространенных UI библиотек для Vue 3. Читать далее
Подробнее
В этой статье вы узнаете как с помощью react можно сделать input с двигающимся суффиксом, который идет сразу после значения ввода Читать далее
Подробнее![[Перевод] Новинки CSS и UI: I/O 2023](https://habrastorage.org/webt/ma/po/lv/mapolvqq4uunxfqoaviv3g9km9y.jpeg)
Последние несколько месяцев открыли золотую эру веб UI (User Interface — пользовательский интерфейс). Вот 20 самых захватывающих и впечатляющих возможностей, которые появились недавно или появятся в ближайшем будущем: запросы контейнера (container queries); запросы стиля (style queries); селектор :has(); микросинтаксис nth-of; text-wrap: balance; initial-letter; динамические единицы измерения области просмотра (viewport); цветовые пространства с широкой…
Подробнее
Хекслет поговорил с Михаилом Синяковым, Head of Frontend в «РТК ИТ». Мы узнали, как обычно проходят собеседования у фронтендеров, какие задачи они решают, а также на что стоит обратить внимание кандидатам при подготовке к интервью. Читать далее
Подробнее
В январе 2019 года я поднял вопрос в W3C CSS GitHub под названием Please bring back scoped styles. Когда-то существовал атрибут HTML scoped, но он был устаревшим. В CSS он был заменен на @scope. Поддержка должна появиться в Chrome 117. Safari так же занимает положительную позицию по спецификации. У @scope есть два преимущества: стилизация на основе близости и установка нижней границы для селектора. Читать далее
Подробнее
Html/css и его вариации, предлагают могучий инструментарий для воплощения самых смелых фантазий дизайнеров. И, наверное, при регулярном и глубоком погружении в тему верстки, весь этот инструментарий "прокэширован в подкорке" и "вертится на кончиках пальцев"... А как быть тем, кто заходит в сияющий мир CSS лишь изредка - по необходимости? (А еще под раздачу попадут React-либы MUI и AntD!) Читать далее
Подробнее
Привет, Хабр! Меня зовут Александр Водолазских. Я живу в Новосибирске и я работаю Frontend Domain Lead в СберМаркете. Сегодня хочу немного поговорить об опыте работы с Tailwind CSS — utility-first CSS framework. Поделюсь болью и радостью, которые возникли при его эксплуатации. Читать далее
Подробнее
Всплывающие окна встречаются в вебе повсеместно. Вы можете увидеть их в меню, переключателях и диалоговых окнах, которые могут проявляться в виде настроек учетной записи, виджетов раскрытия информации и предварительных просмотров карточек товаров. Несмотря на распространенность этих компонентов, их создание в браузерах все еще остается на удивление громоздким. Вам нужно добавить скрипты для управления фокусом, состояниями открытия и закрытия, доступные хуки для компонентов, привязки к…
Подробнее
В статье собраны 30 советов для новичков во FrontEnd сфере, которые возможно сделают ваш код чище и приятнее. Все советы постарался написать понятным языком, чтобы даже самый зелёный новичок всё понял :) Читать далее
Подробнее
Что вы узнаете: WebGPU уже здесь, он позволяет использовать высокопроизводительную 3D-графику и параллельные вычисления в вебе. С помощью инструментов разработчика теперь можно переопределять заголовки ответов сети. Начинает распространяться First Party Sets, часть Privacy Sandbox, которая позволяет организациям объявлять связанные сайты. И многое другое. Читать далее
Подробнее
Как вы знаете, формат изображений WebP в большинстве случаев имеет меньший вес, по сравнению со своими братьями: png и jpeg. Поэтому использовать его в своих приложениях - это хорошая практика. Читать далее
Подробнее![[Перевод] Starting Electronics: руководство по веб-серверам на Arduino. Часть 10. Введение в CSS](https://habrastorage.org/webt/ab/iz/dy/abizdyzcoigmshcxh7bvt3lj_r4.jpeg)
От переводчика. Автор даёт ещё один ключ для понимания того, как работают веб-технологии и на простом примере объясняет принцип работы каскадных таблиц стилей (CSS). После прохождения этого урока вам станет доступным самостоятельное оформление страниц вашего Arduino веб-сервера и после некоторой тренировки вы сможете создавать свои собственные шедевры веб-дизайна. Читать дальше →
Подробнее