Осенью вечера становятся длиннее. Кто-то зажигает фонари у дверей, а мы — зелёные галочки в тренажёрах. Десять-двадцать решённых заданий в день — и код становится светлее.
С 3 по 9 ноября запускаем осеннюю неделю от @htmlacademy. Вместе с нашими партнёрами-работодателями — Addamant, Grokhotov Studio и Bquadro — на неделю открываем бесплатный доступ к тренажёрам с заданиями и испытаниями. Вызовы и мастер-классы — по активной подписке; баллы за них учитываются в общем зачёте.
Что вас ждёт?
1️⃣ 895 заданий и 151 испытание по HTML, CSS, SVG и JavaScript.
2️⃣ Рейтинг: выполняйте задания и испытания, поднимайтесь в топ-30.
3️⃣ Викторина на неделю — 200 вопросов, баллы за правильные ответы.
Зовите друзей, проходите задания и повышайте шансы на призы. Подробнее — на лендинге.
Начинаем 3 ноября — присоединяйтесь и приглашайте друзей!
Подробнее | Telegram-бот
С 3 по 9 ноября запускаем осеннюю неделю от @htmlacademy. Вместе с нашими партнёрами-работодателями — Addamant, Grokhotov Studio и Bquadro — на неделю открываем бесплатный доступ к тренажёрам с заданиями и испытаниями. Вызовы и мастер-классы — по активной подписке; баллы за них учитываются в общем зачёте.
Что вас ждёт?
Зовите друзей, проходите задания и повышайте шансы на призы. Подробнее — на лендинге.
Начинаем 3 ноября — присоединяйтесь и приглашайте друзей!
Подробнее | Telegram-бот
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
❤🔥7
This media is not supported in your browser
VIEW IN TELEGRAM
Карточка с адаптивным поведением. HTML Academy подготовили для вас демонстрацию, чтобы посмотреть детально каждый шаг.
Please open Telegram to view this post
VIEW IN TELEGRAM
👍13❤🔥3
Операторы ?? и ??= — удобные инструменты для работы с null и undefined в JavaScript. Они делают код короче, понятнее и безопаснее, особенно при задании значений по умолчанию или аккуратном обновлении переменных.
В статье разбираем, как
?? отличается от ||: если || подставляет значение по умолчанию при любом «ложном» значении (0, '', false), то ?? реагирует только на реальные отсутствия данных — null и undefined. Показываем практику: дефолты для настроек, аккуратная инициализация свойств с ??= — значение задаётся только когда данных нет. #js #webdevPlease open Telegram to view this post
VIEW IN TELEGRAM
🔥6❤🔥3👍2
API Intl.RelativeTimeFormat — инструмент для отображения относительного времени в локализованном виде. Он прост в использовании, поддерживает множество языков и подходит для интерфейсов, где важна понятность и культурная адаптация.
В статье разбираем, как выводить относительное время естественным языком: «вчера», «через 2 дня», «3 недели назад». Всё это без сторонних библиотек: создаём
new Intl.RelativeTimeFormat('ru', { numeric: 'auto' }) и передаём число и единицу времени (day, hour, month). API автоматически подстраивается под выбранную локаль и грамматические формы; саму разницу во времени считаем отдельно. #js #webdevPlease open Telegram to view this post
VIEW IN TELEGRAM
👍11
HTML Academy
Осенью вечера становятся длиннее. Кто-то зажигает фонари у дверей, а мы — зелёные галочки в тренажёрах. Десять-двадцать решённых заданий в день — и код становится светлее. С 3 по 9 ноября запускаем осеннюю неделю от @htmlacademy. Вместе с нашими партнёрами…
Неделя короткая, призов много. Раскладываем правила на один экран — и в бой.
Что разыгрываем:
Профессии для начинающих и курсы для продолжающих — на выбор победителя. Всего 14 призов. Финал — в прямом эфире, уведомление и ссылка будут в боте.
Как устроен розыгрыш:
– 7 призов среди тех, кто попал в топ-30 по баллам;
– ещё 7 призов среди участников из топ-30 с 20+ часами практики.
Что влияет на шансы:
– Баллы: +1 за задание, +5 за испытание и вызов, +3 за правильный ответ в викторине, +50 за приглашённого друга.
– Викторина каждый день в 10:00 (MSK), ответы можно отправить в течение 24 часов.
– Активная подписка добавляет доступ к вызовам и мастер-классам — дополнительные баллы.
План-победителя (коротко):
– каждый день выполняем задания и проходим испытания на 100%;
– без пропусков отвечаем на вопросы викторины;
– зовём пару друзей — соревноваться веселее, баллы — полезнее;
– держим ровный темп до финала.
Итоги подведём 10 ноября в прямом эфире в 20:00.
Подробнее об акции | Telegram-бот
Что разыгрываем:
Профессии для начинающих и курсы для продолжающих — на выбор победителя. Всего 14 призов. Финал — в прямом эфире, уведомление и ссылка будут в боте.
Как устроен розыгрыш:
– 7 призов среди тех, кто попал в топ-30 по баллам;
– ещё 7 призов среди участников из топ-30 с 20+ часами практики.
Что влияет на шансы:
– Баллы: +1 за задание, +5 за испытание и вызов, +3 за правильный ответ в викторине, +50 за приглашённого друга.
– Викторина каждый день в 10:00 (MSK), ответы можно отправить в течение 24 часов.
– Активная подписка добавляет доступ к вызовам и мастер-классам — дополнительные баллы.
План-победителя (коротко):
– каждый день выполняем задания и проходим испытания на 100%;
– без пропусков отвечаем на вопросы викторины;
– зовём пару друзей — соревноваться веселее, баллы — полезнее;
– держим ровный темп до финала.
Итоги подведём 10 ноября в прямом эфире в 20:00.
Подробнее об акции | Telegram-бот
Forwarded from Как стать мидлом
Паттерны проектирования
➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿
Качественная архитектура начинается не с фреймворка, а с мышления. На курсе системно разбираем фундаментальные шаблоны: порождающие (Singleton, Factory Method, Abstract Factory, Builder, Object Pool, Prototype), структурные (Adapter, Bridge, Decorator, Facade, Composite, Proxy), поведенческие (Chain of Responsibility, Command, Iterator, Mediator, Observer, State, Strategy, Visitor, Memento, Template Method) и архитектурные MV* (MVC, MVP, MVVM).
Всё подано в контексте JavaScript и фронтенд-разработки: продуктовые кейсы и практические задания показывают, как применять паттерны на практике — от адаптации «кривых» внешних данных (Adapter) и кэширования без дублирования (Decorator) до ограничения доступа (Proxy), управления состояниями интерфейса и тёмной темой (State), реакций на изменения без «костылей» (Observer) и фильтров в реальном времени (MVVM).
Это курс для будущих инженеров, которые устали от «спагетти» и хотят понимать, почему архитектура работает — а не просто «как заставить код заработать». После него вы начинаете видеть проект как систему взаимосвязей: где фабрика уместна, где декоратор экономит усилия поддержки, а где MV*-подход помогает организовать UI на годы вперёд. #htmlacademy #levelup
🌷 Записаться на курс
Качественная архитектура начинается не с фреймворка, а с мышления. На курсе системно разбираем фундаментальные шаблоны: порождающие (Singleton, Factory Method, Abstract Factory, Builder, Object Pool, Prototype), структурные (Adapter, Bridge, Decorator, Facade, Composite, Proxy), поведенческие (Chain of Responsibility, Command, Iterator, Mediator, Observer, State, Strategy, Visitor, Memento, Template Method) и архитектурные MV* (MVC, MVP, MVVM).
Всё подано в контексте JavaScript и фронтенд-разработки: продуктовые кейсы и практические задания показывают, как применять паттерны на практике — от адаптации «кривых» внешних данных (Adapter) и кэширования без дублирования (Decorator) до ограничения доступа (Proxy), управления состояниями интерфейса и тёмной темой (State), реакций на изменения без «костылей» (Observer) и фильтров в реальном времени (MVVM).
Это курс для будущих инженеров, которые устали от «спагетти» и хотят понимать, почему архитектура работает — а не просто «как заставить код заработать». После него вы начинаете видеть проект как систему взаимосвязей: где фабрика уместна, где декоратор экономит усилия поддержки, а где MV*-подход помогает организовать UI на годы вперёд. #htmlacademy #levelup
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
❤🔥4🔥3
Media is too big
VIEW IN TELEGRAM
Проактивность vs навыки и хард-скиллы
На самом деле, это неразрывные понятия. Работодатели хотят, чтобы их будущий сотрудник бросал все силы на решение проблемы, а не придумывал объяснения — почему что-то не получается. Евгений Суанка, менеджер стажировок в Контуре, рассказал про ожидания от работников.
Полный эфир с Контуром — по ссылке:
🐭 Смотреть на YouTube
🐹 Смотреть в VK
🎉 Программа обучения
На самом деле, это неразрывные понятия. Работодатели хотят, чтобы их будущий сотрудник бросал все силы на решение проблемы, а не придумывал объяснения — почему что-то не получается. Евгений Суанка, менеджер стажировок в Контуре, рассказал про ожидания от работников.
Полный эфир с Контуром — по ссылке:
Please open Telegram to view this post
VIEW IN TELEGRAM
👍5
Свойство line-clamp — это простой способ ограничить текст по количеству строк и сохранить аккуратный вид интерфейса. Оно особенно полезно там, где нужно показать лишь часть контента: в превью, карточках, списках.
В статье показываем, как обойтись без JavaScript-костылей для тримминга и на что опираться в CSS: стандартное
line-clamp в современных браузерах и префиксная связка display: -webkit-box + -webkit-box-orient: vertical + -webkit-line-clamp для совместимости со старыми Safari. Важно понимать механику и ограничения, а не просто копировать сниппет — тогда компоненты будут вести себя предсказуемо в разных браузерах. #css #typographyPlease open Telegram to view this post
VIEW IN TELEGRAM
⚡4
HTML Academy
Неделя короткая, призов много. Раскладываем правила на один экран — и в бой. Что разыгрываем: Профессии для начинающих и курсы для продолжающих — на выбор победителя. Всего 14 призов. Финал — в прямом эфире, уведомление и ссылка будут в боте. Как устроен…
🍁 Осенняя неделя началась!
Вместе с Addamant, Grokhotov Studio и Bquadro мы открыли тренажёры HTML Academy: 895 заданий и 151 испытание — бесплатно на целую неделю. Самое время прокачать навыки, заработать баллы и, возможно, унести приз.
Что делать:
0️⃣ Присоединиться к осенней неделе через лендинг или прямо в боте.
1️⃣ Выбрать тренажёр и начать — с нуля или продолжить там, где остановились.
2️⃣ Каждый день участвовать в викторине и выполнять испытания — рейтинг это любит.
3️⃣ Позвать друзей и соревноваться вместе — так веселее и продуктивнее.
И помните: мы разыграем 14 призов среди тех, кто по итогам недели окажется в топ-30; отдельный розыгрыш — среди топ-30 с 20+ часами практики. Финал пройдёт в прямом эфире, ссылку пришлём в боте.
Пора! Тренажёры открыты — заходите и начинайте.
Подробнее | Кексобот | Правила
Удачи всем!
Вместе с Addamant, Grokhotov Studio и Bquadro мы открыли тренажёры HTML Academy: 895 заданий и 151 испытание — бесплатно на целую неделю. Самое время прокачать навыки, заработать баллы и, возможно, унести приз.
Есть простое правило одной задачи: сделайте одно задание сейчас, завтра — ещё одно. Через неделю у вас будет не список планов, а список сделанного. Начните с одного — остальное подтянется.
Что делать:
И помните: мы разыграем 14 призов среди тех, кто по итогам недели окажется в топ-30; отдельный розыгрыш — среди топ-30 с 20+ часами практики. Финал пройдёт в прямом эфире, ссылку пришлём в боте.
Пора! Тренажёры открыты — заходите и начинайте.
Подробнее | Кексобот | Правила
Удачи всем!
Please open Telegram to view this post
VIEW IN TELEGRAM
❤8🔥6⚡2
Forwarded from CSS Боль
CSS теперь умеет думать — без шуток.
➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿
Вышел Chrome 142, и вместе с ним — великий апгрейд CSS-условий. Теперь
Новый выпуск «CSS Боль»:
✓ Почему старый
✓ Как теперь сравнивать CSS-переменные между собой и со значениями.
✓ Диапазонные проверки в действии: длины, углы, проценты и даже
✓ Реальный пример: как CSS сам управляет пагинатором без единой строчки JavaScript.
✓ Что говорит спецификация CSS Conditional Rules Module Level 5.
✓ Как сделать фолбэк с
CSS перестаёт быть просто языком оформления — он начинает принимать решения.
🐭 Смотреть на YouTube
🐹 Смотреть в VK
Вышел Chrome 142, и вместе с ним — великий апгрейд CSS-условий. Теперь
if() и стилевые контейнерные запросы могут сравнивать значения:>, <, =, — прямо в стилях, без JS.Новый выпуск «CSS Боль»:
✓ Почему старый
if() был бесполезным и что изменилось в новой версии.✓ Как теперь сравнивать CSS-переменные между собой и со значениями.
✓ Диапазонные проверки в действии: длины, углы, проценты и даже
attr().✓ Реальный пример: как CSS сам управляет пагинатором без единой строчки JavaScript.
✓ Что говорит спецификация CSS Conditional Rules Module Level 5.
✓ Как сделать фолбэк с
sign() для старых браузеров.CSS перестаёт быть просто языком оформления — он начинает принимать решения.
Please open Telegram to view this post
VIEW IN TELEGRAM
👏9⚡5
Функция «live editing» в Chrome DevTools — та самая, где можно было править JavaScript-код прямо в браузере — официально уходит в прошлое. Команда Chrome объявила, что начиная с версии 142 возможность редактировать исходники «на лету» будет скрыта за флагом, а в 145-й (февраль 2026) — полностью удалена. Причины: низкое использование, высокая стоимость поддержки и конфликт с современным Hot Module Replacement (HMR).
В статье рассказали, в чём заключалось «живое редактирование», что использовать вместо и что Local Overrides и Workspaces остаются. #chrome #devtools
🌸 Читать статью
В статье рассказали, в чём заключалось «живое редактирование», что использовать вместо и что Local Overrides и Workspaces остаются. #chrome #devtools
Please open Telegram to view this post
VIEW IN TELEGRAM
❤🔥4🔥2👏1
Что нового во фронтенде в 2025?
Краткий обзор с примерами кода — читайте, чтобы не отстать от современных стандартов.
📍 Читать статью
Popover APIPromise.try(), RegExp.escape(), content-visibility и ещё 20 долгожданных фичей, которые уже поддерживаются в современных браузерах. #js #cssКраткий обзор с примерами кода — читайте, чтобы не отстать от современных стандартов.
Please open Telegram to view this post
VIEW IN TELEGRAM
❤6❤🔥3👍3🔥1
This media is not supported in your browser
VIEW IN TELEGRAM
Коллекция кнопок в стиле неоморфизма
👍18❤2
Фронтенд-разработка — это не только инженерные выдумки, но и очень много кодинга: повторяющиеся задачи, тесты, документация. AI-агенты помогают экономить время и поддерживать качество кода. В статье разбираем пять типовых задач фронтенд-разработчика, где AI может радикально ускорить процесс, и показываем, как эти кейсы решаются на курсе «Фронтенд на автопилоте: AI-агенты на практике».
Кодинг вместе с AI-агентами — это не будущее, а настоящее фронтенд-разработки. Генерация кода, тестирование, рефакторинг, документация и интеграция API — везде AI экономит время и силы. #ai #frontend
☁️ Читать статью
Кодинг вместе с AI-агентами — это не будущее, а настоящее фронтенд-разработки. Генерация кода, тестирование, рефакторинг, документация и интеграция API — везде AI экономит время и силы. #ai #frontend
Please open Telegram to view this post
VIEW IN TELEGRAM
👍7❤🔥2🔥2
Поговорим о семантике?
Листайте карточки, знакомьтесь с тегом <section>, а потом закрепляйте полученные знания в опросе ниже. Попрактиковаться и посмотреть на примеры использования <section> можно в интерактивной главе «Структура HTML-документа».
Листайте карточки, знакомьтесь с тегом <section>, а потом закрепляйте полученные знания в опросе ниже. Попрактиковаться и посмотреть на примеры использования <section> можно в интерактивной главе «Структура HTML-документа».
🔥4
Какой раздел сайта будет в <section>?
Anonymous Quiz
4%
Навигация сайта
94%
Раздел «О компании»
2%
Подвал сайта
⚡4👏4🔥2