Forwarded from CSS Боль
Запись доклада “Negative border radius — не больно” с FrontendConf 2025
В конце 2025 я рассказал про то, как создавалась и как устроена библиотека nebo.css, которая позволяет делать впуклые углы буквально в пару строчек нативного CSS.
Помимо кода в докладе есть несколько баек из старых времён и общие размышления про современный CSS.
И теперь Дедушка Мороз привёз вам запись доклада под ёлочку. Пока запись есть только на ютюбе:
https://www.youtube.com/watch?v=WmiIvorelhw
В конце 2025 я рассказал про то, как создавалась и как устроена библиотека nebo.css, которая позволяет делать впуклые углы буквально в пару строчек нативного CSS.
Помимо кода в докладе есть несколько баек из старых времён и общие размышления про современный CSS.
И теперь Дедушка Мороз привёз вам запись доклада под ёлочку. Пока запись есть только на ютюбе:
https://www.youtube.com/watch?v=WmiIvorelhw
⚡5❤3🔥3
Forwarded from CSS Боль
Статья “Верстаем сложный прогрессбар в 2026 году”
Опубликовал на Хабре текстовую версию свежего выпуска CSS Боли про сложный круговой прогрессбар для тех, кому удобнее читать, а не смотреть:
https://habr.com/ru/articles/983810/
P.S.: Пошаговая демка со всем кодом и пояснениями находится здесь:
https://htmlacademy.ru/demos/251
Опубликовал на Хабре текстовую версию свежего выпуска CSS Боли про сложный круговой прогрессбар для тех, кому удобнее читать, а не смотреть:
https://habr.com/ru/articles/983810/
P.S.: Пошаговая демка со всем кодом и пояснениями находится здесь:
https://htmlacademy.ru/demos/251
Хабр
Верстаем сложный прогрессбар в 2026 году
Раньше, чтобы сделать круговой прогрессбар, мы страдали с SVG. Мне до сих пор больно заглядывать в инспектор на старых реализациях. Сегодня всё кардинально упростилось. Современный...
❤9❤🔥3🔥1
«Новогодние канИИкулы — битва за Кексобота» завершилась!
С 1 по 11 января шла настоящая битва: тренажёры были открыты, а jQweny пытался удержать контроль над системой. Все праздники вы проходили задания и испытания, участвовали в викторинах, искали подарки на сайте и набирали баллы — каждый шаг помогал восстановить инфраструктуру и вернуть Кексобота. Человеческий код, внимание к деталям и упорство оказались сильнее автоматической «оптимизации».
Сегодня в 20:00 (MSK) мы подведём результаты Новогодних канИИкул и разыграем призы среди самых активных — тех, кто вложил больше усилий для спасения Кексобота.
🐭 Смотреть в YT
🐹 Смотреть в VK
С 1 по 11 января шла настоящая битва: тренажёры были открыты, а jQweny пытался удержать контроль над системой. Все праздники вы проходили задания и испытания, участвовали в викторинах, искали подарки на сайте и набирали баллы — каждый шаг помогал восстановить инфраструктуру и вернуть Кексобота. Человеческий код, внимание к деталям и упорство оказались сильнее автоматической «оптимизации».
Сегодня в 20:00 (MSK) мы подведём результаты Новогодних канИИкул и разыграем призы среди самых активных — тех, кто вложил больше усилий для спасения Кексобота.
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥9❤🔥6 5
CSS свойство transform позволяет манипулировать элементами на вашей веб-странице, изменяя их форму, размер и положение. В общем виде свойство transform записывается так: transform: функция(значение);, где функция — это тип преобразования, который вы хотите применить, а значение — параметры этого преобразования.
В статье на практических примерах разбираем базовые функции
translate, rotate, scale и skew — как сдвигать, поворачивать, масштабировать и наклонять элементы через transform.А ещё показываем, как эти преобразования анимировать с помощью
transition и @keyframes, и напоминаем важное: transform — для эффектов и анимаций, а для раскладки страницы лучше использовать flexbox или grid. #css #htmlPlease open Telegram to view this post
VIEW IN TELEGRAM
❤🔥5 4🔥2
Forwarded from CSS Боль
Рамки в форме вырезов — без SVG, картинок и костылей
➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿
Кажется, CSS-маски умеют всё… пока дизайнер не говорит: «А можно, чтобы рамка повторяла форму выреза?»
В новом выпуске «CSS Боль» рассказываем, почему привычные
🐭 Смотреть на YouTube
🐹 Смотреть в VK
Кажется, CSS-маски умеют всё… пока дизайнер не говорит: «А можно, чтобы рамка повторяла форму выреза?»
В новом выпуске «CSS Боль» рассказываем, почему привычные
border и box-shadow внезапно перестают работать, и как современный CSS позволяет решить задачу аккуратно, надёжно и с отличной поддержкой.Please open Telegram to view this post
VIEW IN TELEGRAM
🔥8❤5❤🔥4
Смежный селектор в CSS, обозначаемый знаком плюс (+), позволяет выбрать элемент, который идёт сразу после другого элемента и находится с ним на одном уровне DOM.
В статье разбираем, как работает селектор A + B, и показываем, где он особенно удобен: когда нужно оформить «следующего соседа» (например, абзац сразу после заголовка) без дополнительных классов. #css #html
Please open Telegram to view this post
VIEW IN TELEGRAM
Grid Layout — одна из самых зрелых технологий в CSS. Но долгое время у него была одна неочевидная граница: анимация размеров сетки.
CSS Grid теперь можно анимировать напрямую — без JavaScript и обходных приёмов. В статье объясняем, что свойства
grid-template-columns и grid-template-rows стали анимируемыми во всех современных браузерах, поэтому изменения сетки можно плавно задавать через transition.Разбираем, где это особенно полезно: для раскрывающихся сайдбаров, акцентирования карточек и интерфейсов, где сетка должна мягко перестраиваться. #css #baseline
Please open Telegram to view this post
VIEW IN TELEGRAM
Forwarded from Как стать мидлом
Фронтендеру, который хочет прокачать основы computer science, стоит взглянуть на курс по алгоритмам и структурам данных. Структуры данных и алгоритмы дают предсказуемый код и чёткую архитектуру, а алгоритмические собеседования перестают быть лотереей.
Что разберёте на практике — и где это пригодится прямо в продакшене:
Какой алгоритм в последний раз выручил ваш проект? Делитесь в комментариях.
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
❤🔥2🔥2👏2
Media is too big
VIEW IN TELEGRAM
Учитывают ли работодатели участие в чемпионате при найме?
Алексей Кузьмин, технический директор Bauns и член жюри, рассказывает, на что обращает внимание, когда видит чемпионат в резюме.
Это фрагмент из прямого эфира с подведением итогов второго сезона.
Алексей Кузьмин, технический директор Bauns и член жюри, рассказывает, на что обращает внимание, когда видит чемпионат в резюме.
Это фрагмент из прямого эфира с подведением итогов второго сезона.
❤🔥6🔥2👏1
Первый прямой эфир с основателем Bquadro
Поговорим с основателем студии о том, как в агентстве с 20-летней историей и 600+ проектами растят фронтендеров, какие задачи доверяют новичкам и как мы вместе с Bquadro и другими компаниями запускаем совместную программу обучения.
На эфире 22 января в 12:00 (MSK) разберём:
1️⃣ какие проекты в портфолио агентства, с какими клиентами работает и почему им нужны фронтендеры;
2️⃣ как устроено наставничество, что такое план развития и как джуны дорастают до руководителей;
3️⃣ формат работы, оплачиваемую стажировку, удалёнку и что нужно, чтобы пройти путь от обучения до оффера.
Бонус: среди первых 100 зарегистрировавшихся разыграем одно бесплатное место на программу, результаты объявим в конце эфира.
Регистрируйтесь по ссылке — пришлём напоминание и расскажем, как попасть на обучение.
Поговорим с основателем студии о том, как в агентстве с 20-летней историей и 600+ проектами растят фронтендеров, какие задачи доверяют новичкам и как мы вместе с Bquadro и другими компаниями запускаем совместную программу обучения.
На эфире 22 января в 12:00 (MSK) разберём:
Бонус: среди первых 100 зарегистрировавшихся разыграем одно бесплатное место на программу, результаты объявим в конце эфира.
Регистрируйтесь по ссылке — пришлём напоминание и расскажем, как попасть на обучение.
Please open Telegram to view this post
VIEW IN TELEGRAM
❤🔥3🔥3❤2 2
Forwarded from CSS Боль
В начале 2025-го казалось, что всё кончено: ИИ нас заменит, разработчиков уволят, стартапы будут делать в одиночку люди без опыта, а один джун с агентами закроет работу целой команды.
К концу года паника прошла — наступило нейроотрезвление.
➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿
В новом выпуске «CSS Боли» спокойно разбираемся, что на самом деле происходит. Почему ИИ стал удобным прикрытием для увольнений, а не их причиной. Сколько денег сожгли на вайб-кодинге. И главное — ставим эксперимент: даём ChatGPT реальную задачу и смотрим, как он с ней справляется. Спойлер: после долгих препирательств нейросеть призналась — «Я соврал концептуально».
Ролик для всех, не только для программистов: код будет, но понимать его не нужно — всё и так видно. Если тревожно за будущее профессии, самое время посмотреть и выдохнуть.
🐭 Смотреть на YouTube
🐹 Смотреть в VK
К концу года паника прошла — наступило нейроотрезвление.
В новом выпуске «CSS Боли» спокойно разбираемся, что на самом деле происходит. Почему ИИ стал удобным прикрытием для увольнений, а не их причиной. Сколько денег сожгли на вайб-кодинге. И главное — ставим эксперимент: даём ChatGPT реальную задачу и смотрим, как он с ней справляется. Спойлер: после долгих препирательств нейросеть призналась — «Я соврал концептуально».
Ролик для всех, не только для программистов: код будет, но понимать его не нужно — всё и так видно. Если тревожно за будущее профессии, самое время посмотреть и выдохнуть.
Please open Telegram to view this post
VIEW IN TELEGRAM
❤🔥10 8🔥5❤1