HTML Academy
10.3K subscribers
5.23K photos
158 videos
4 files
3.26K links
Курсы по веб-разработке: вёрстка, программирование, работа и комьюнити.
Наш секретный бот @HTMLAcademyKeksobot.

Вопросы по обучению @htmlacademy_sales

Ролики на YT https://www.youtube.com/@HTMLAcademyTV
Ролики на VK https://vkvideo.ru/@htmlacademy
Download Telegram
Forwarded from CSS Боль
Запись доклада “Negative border radius — не больно” с FrontendConf 2025

В конце 2025 я рассказал про то, как создавалась и как устроена библиотека nebo.css, которая позволяет делать впуклые углы буквально в пару строчек нативного CSS.

Помимо кода в докладе есть несколько баек из старых времён и общие размышления про современный CSS.

И теперь Дедушка Мороз привёз вам запись доклада под ёлочку. Пока запись есть только на ютюбе:

https://www.youtube.com/watch?v=WmiIvorelhw
53🔥3
Forwarded from CSS Боль
Статья “Верстаем сложный прогрессбар в 2026 году”

Опубликовал на Хабре текстовую версию свежего выпуска CSS Боли про сложный круговой прогрессбар для тех, кому удобнее читать, а не смотреть:

https://habr.com/ru/articles/983810/


P.S.: Пошаговая демка со всем кодом и пояснениями находится здесь:

https://htmlacademy.ru/demos/251
9❤‍🔥3🔥1
«Новогодние канИИкулы — битва за Кексобота» завершилась!

С 1 по 11 января шла настоящая битва: тренажёры были открыты, а jQweny пытался удержать контроль над системой. Все праздники вы проходили задания и испытания, участвовали в викторинах, искали подарки на сайте и набирали баллы — каждый шаг помогал восстановить инфраструктуру и вернуть Кексобота. Человеческий код, внимание к деталям и упорство оказались сильнее автоматической «оптимизации».

Сегодня в 20:00 (MSK) мы подведём результаты Новогодних канИИкул и разыграем призы среди самых активных — тех, кто вложил больше усилий для спасения Кексобота.

🐭 Смотреть в YT
🐹 Смотреть в VK
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥9❤‍🔥65
CSS свойство transform позволяет манипулировать элементами на вашей веб-странице, изменяя их форму, размер и положение. В общем виде свойство transform записывается так: transform: функция(значение);, где функция — это тип преобразования, который вы хотите применить, а значение — параметры этого преобразования.


В статье на практических примерах разбираем базовые функции translaterotatescale и skew — как сдвигать, поворачивать, масштабировать и наклонять элементы через transform.

А ещё показываем, как эти преобразования анимировать с помощью transition и @keyframes, и напоминаем важное: transform — для эффектов и анимаций, а для раскладки страницы лучше использовать flexbox или grid. #css #html

📌 Читать статью
Please open Telegram to view this post
VIEW IN TELEGRAM
❤‍🔥54🔥2
Forwarded from CSS Боль
Рамки в форме вырезов — без SVG, картинок и костылей

Кажется, CSS-маски умеют всё… пока дизайнер не говорит: «А можно, чтобы рамка повторяла форму выреза?»

В новом выпуске «CSS Боль» рассказываем, почему привычные border и box-shadow внезапно перестают работать, и как современный CSS позволяет решить задачу аккуратно, надёжно и с отличной поддержкой.

🐭 Смотреть на YouTube
🐹 Смотреть в VK
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥85❤‍🔥4
Смежный селектор в CSS, обозначаемый знаком плюс (+), позволяет выбрать элемент, который идёт сразу после другого элемента и находится с ним на одном уровне DOM.


В статье разбираем, как работает селектор A + B, и показываем, где он особенно удобен: когда нужно оформить «следующего соседа» (например, абзац сразу после заголовка) без дополнительных классов. #css #html

Читать статью
Please open Telegram to view this post
VIEW IN TELEGRAM
6❤‍🔥5🔥3
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
16
📌Алгоритмы и структуры данных: код быстрее, интерфейсы надёжнее

Фронтендеру, который хочет прокачать основы computer science, стоит взглянуть на курс по алгоритмам и структурам данных. Структуры данных и алгоритмы дают предсказуемый код и чёткую архитектуру, а алгоритмические собеседования перестают быть лотереей.

Что разберёте на практике — и где это пригодится прямо в продакшене:

O-большое без теории ради теории — находите «дорогие» циклы ещё до ревью;
Обход деревьев и графов — ускоряете diff-алгоритм шаблонизатора и виртуального DOM;
Хеш-таблицы и Map/Set — убираете дубли среди 100 000 элементов за O(1) вместо O(n);
Поиск и quicksort — «живой» поиск и бесконечный скролл без фризов.

Какой алгоритм в последний раз выручил ваш проект? Делитесь в комментариях.
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 и член жюри, рассказывает, на что обращает внимание, когда видит чемпионат в резюме.
Это фрагмент из прямого эфира с подведением итогов второго сезона.
❤‍🔥6🔥2👏1
Первый прямой эфир с основателем Bquadro

Поговорим с основателем студии о том, как в агентстве с 20-летней историей и 600+ проектами растят фронтендеров, какие задачи доверяют новичкам и как мы вместе с Bquadro и другими компаниями запускаем совместную программу обучения.

На эфире 22 января в 12:00 (MSK) разберём:

1️⃣ какие проекты в портфолио агентства, с какими клиентами работает и почему им нужны фронтендеры;
2️⃣ как устроено наставничество, что такое план развития и как джуны дорастают до руководителей;
3️⃣ формат работы, оплачиваемую стажировку, удалёнку и что нужно, чтобы пройти путь от обучения до оффера.

Бонус: среди первых 100 зарегистрировавшихся разыграем одно бесплатное место на программу, результаты объявим в конце эфира.

Регистрируйтесь по ссылке — пришлём напоминание и расскажем, как попасть на обучение.
Please open Telegram to view this post
VIEW IN TELEGRAM
❤‍🔥3🔥322
Forwarded from CSS Боль
В начале 2025-го казалось, что всё кончено: ИИ нас заменит, разработчиков уволят, стартапы будут делать в одиночку люди без опыта, а один джун с агентами закроет работу целой команды.
К концу года паника прошла — наступило нейроотрезвление.

В новом выпуске «CSS Боли» спокойно разбираемся, что на самом деле происходит. Почему ИИ стал удобным прикрытием для увольнений, а не их причиной. Сколько денег сожгли на вайб-кодинге. И главное — ставим эксперимент: даём ChatGPT реальную задачу и смотрим, как он с ней справляется. Спойлер: после долгих препирательств нейросеть призналась — «Я соврал концептуально».

Ролик для всех, не только для программистов: код будет, но понимать его не нужно — всё и так видно. Если тревожно за будущее профессии, самое время посмотреть и выдохнуть.

🐭 Смотреть на YouTube
🐹 Смотреть в VK
Please open Telegram to view this post
VIEW IN TELEGRAM
❤‍🔥108🔥51