Forwarded from Как стать мидлом
Добавляете фичу — и половина приложения ломается. Часто причина — отсутствие архитектуры.
На курсе «Паттерны проектирования» разбираем 25 паттернов в контексте JavaScript и фронтенд-разработки. Каждый привязан к практической задаче: Adapter помогает работать с «кривым» API, Observer убирает ручную синхронизацию между компонентами, State упрощает управление состояниями интерфейса.
После курса вы начнёте видеть проект как систему: где нужна фабрика, где декоратор сэкономит часы поддержки, а где MV*-подход организует UI. #htmlacademy #levelup
✨ Записаться на курс
На курсе «Паттерны проектирования» разбираем 25 паттернов в контексте JavaScript и фронтенд-разработки. Каждый привязан к практической задаче: Adapter помогает работать с «кривым» API, Observer убирает ручную синхронизацию между компонентами, State упрощает управление состояниями интерфейса.
После курса вы начнёте видеть проект как систему: где нужна фабрика, где декоратор сэкономит часы поддержки, а где 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
Media is too big
VIEW IN TELEGRAM
Сколько платят стажёру и джуну на испытательном сроке — отвечает основатель студии Bquadro.
➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿
В совместной программе обучения с HTML Academy студенты учатся под задачи конкретной компании. В этом клипе — про деньги: какую зарплату предлагают на старте и чего ожидать в первые месяцы.
Полный эфир — на YouTube и в VK.
🐭 Смотреть на YouTube
🐹 Смотреть в VK
🎖 Программа обучения
В совместной программе обучения с HTML Academy студенты учатся под задачи конкретной компании. В этом клипе — про деньги: какую зарплату предлагают на старте и чего ожидать в первые месяцы.
Полный эфир — на YouTube и в VK.
Please open Telegram to view this post
VIEW IN TELEGRAM
❤4🔥4❤🔥2🤣1
План на выходные: эфир про вёрстку, AI и рост в студии
Директор по развитию и тимлид разработки SimpleUp рассказали, как устроена работа в компании, которая за год выросла втрое:
— почему каждого разработчика учат и фронтенду, и бэкенду;
— зачем студия растит новичков вместо найма с рынка;
— почему вёрстка будет нужна всегда — даже когда нейросети собирают сайты;
— как в команде используют AI и почему важнее всего мышление разработчика.
Если на неделе было не до контента — самое время включить.
🐭 Смотреть на YouTube
🐹 Смотреть в VK
🎁 Программа обучения
Директор по развитию и тимлид разработки SimpleUp рассказали, как устроена работа в компании, которая за год выросла втрое:
— почему каждого разработчика учат и фронтенду, и бэкенду;
— зачем студия растит новичков вместо найма с рынка;
— почему вёрстка будет нужна всегда — даже когда нейросети собирают сайты;
— как в команде используют AI и почему важнее всего мышление разработчика.
Если на неделе было не до контента — самое время включить.
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥8❤🔥2❤1
HTML Academy
День рождения HTML Academy × Колесо Фортуны ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ С 20 по 24 февраля — праздничные дни в Академии! В честь дня рождения на сайте появится настоящее колесо с подарками: одно вращение колеса — и в вашу корзину падает скидка 20, 30 или 50%, выгодное комбо…
14 лет кода, первых строчек, успешных выпускников и больших карьерных поворотов. И по такому поводу — подарки для всех. Для тех, кто с нами давно, и для тех, кто только начинает путь в разработке.
Заходите на сайт Академии, найдите иконку с подарком и крутите колесо. Внутри — промокоды, скидки, курсы и даже годовая подписка на тренажёры бесплатно.
Please open Telegram to view this post
VIEW IN TELEGRAM
❤31❤🔥6🔥3
Forwarded from CSS Боль
CSS Masking уже почти Widely Available, а многие до сих пор её игнорируют.
➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿
В новом выпуске «CSS Боли» разбираем CSS-маски для тех, кто с ними не знаком, с помощью интерактивных визуализаций.
— Что такое маскирование и как оно работает.
— Главная «киллер-фича» масок.
— Принцип работы масок.
— 4 свойства, которые закрывают 95% задач.
— Классный пример маски в реальном интерфейсе.
🎁 Попробуйте в демке самостоятельно и смотрите разбор целиком. Если работаете с UI — это надо знать.
🐭 Смотреть на YouTube
🐹 Смотреть в VK
В новом выпуске «CSS Боли» разбираем CSS-маски для тех, кто с ними не знаком, с помощью интерактивных визуализаций.
— Что такое маскирование и как оно работает.
— Главная «киллер-фича» масок.
— Принцип работы масок.
— 4 свойства, которые закрывают 95% задач.
— Классный пример маски в реальном интерфейсе.
Please open Telegram to view this post
VIEW IN TELEGRAM
❤5🔥5
CSS-псевдоклассы задают элементам состояния, которые реализуются при определённых действиях пользователя. Состояния меняют цвет или размер элемента, добавляют ему рамку, делают более интерактивным, выделяют и указывают на его назначение.
Интерактивные элементы веб-страницы живут не сами по себе, а в зависимости от действий пользователя. В статье разбираем три базовых состояния элементов: при наведении курсора, при фокусе управления с клавиатуры или тач-устройства и в активном состоянии при нажатии. Показываем, как с помощью соответствующих правил стиля управлять внешним видом кнопок и ссылок в каждом из этих случаев, чтобы интерфейс был понятным и удобным в использовании.
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥4👍3
Forwarded from CSS Боль
Статья «Восхитительный Range Syntax в CSS»
Помните сĸазĸу про мальчиĸа, ĸоторый ĸричал «волĸи»? Примерно таĸ же в 2025 году случилось с «программированием на CSS». Вышла фунĸция
В ĸонце 2025 года Chrome выĸатил революционный Range Syntax For Style Container Queries. Обновлённый
В статье мы возрождаем идею программирования на CSS. На примере паттерна — «выделение диапазона дат в ĸалендаре» — разберём, ĸаĸ обычная JS-логиĸа превращается в CSS-логиĸу (спойлер: очень просто).
Читать статью → https://habr.com/ru/articles/1002216/
Попробовать демку → https://htmlacademy.ru/demos/249
Помните сĸазĸу про мальчиĸа, ĸоторый ĸричал «волĸи»? Примерно таĸ же в 2025 году случилось с «программированием на CSS». Вышла фунĸция
if() . Блогеры преждевременно хайпанули: всё, теперь у нас условия в CSS. Разработчиĸи пошли читать специфиĸации, попробовали — и довольно быстро выяснилось, что внутри условного выражения style() возможностей почти нет. Многие разочаровались и похоронили идею.В ĸонце 2025 года Chrome выĸатил революционный Range Syntax For Style Container Queries. Обновлённый
style() научился сравнивать переменные между собой и поддерживать диапазонные выражения. Мы наĸонец-то получили мощную условную логиĸу в CSS, но мало ĸто это заметил.В статье мы возрождаем идею программирования на CSS. На примере паттерна — «выделение диапазона дат в ĸалендаре» — разберём, ĸаĸ обычная JS-логиĸа превращается в CSS-логиĸу (спойлер: очень просто).
Читать статью → https://habr.com/ru/articles/1002216/
Попробовать демку → https://htmlacademy.ru/demos/249
❤8❤🔥2👍2⚡1
Цвет в веб-странице — это не только «чёрный» или «белый», а целая система представления чисел, отражающая интенсивность, оттенок и прозрачность.
В статье разбираем основные форматы задания цвета в таблицах стилей: от традиционных шестнадцатеричных записей, через десятичные каноничные значения, до более современных пространств цвета, основанных на восприятии человека. Каждый формат имеет свои сильные стороны и области применения, и понимание этих различий помогает создавать более точные, согласованные и устойчивые визуальные решения. #цвет
🎁 Читать статью
В статье разбираем основные форматы задания цвета в таблицах стилей: от традиционных шестнадцатеричных записей, через десятичные каноничные значения, до более современных пространств цвета, основанных на восприятии человека. Каждый формат имеет свои сильные стороны и области применения, и понимание этих различий помогает создавать более точные, согласованные и устойчивые визуальные решения. #цвет
Please open Telegram to view this post
VIEW IN TELEGRAM
❤🔥4🔥3⚡2
Начинающие верстальщики в своих первых проектах часто задают высоту элементам, чтобы попасть в размеры чётко по макету. Давайте разберёмся, а действительно ли высота везде нужна?
Вёрстка макета часто начинается с попытки «задать высоту» элементам — но CSS-свойство
height умеет гораздо больше, чем просто фиксировать размер. В статье подробно разбираемся, как работает высота: при указании точного значения блок сохраняет заданный размер независимо от содержимого, а когда применяется относительная запись в процентах, высота рассчитывается от родительского элемента. Это позволяет управлять вертикальным пространством — от декоративных элементов до областей, наполненных контентом. Please open Telegram to view this post
VIEW IN TELEGRAM
❤🔥7🔥3⚡2❤1
Forwarded from Как стать мидлом
Git и GitHub
➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿
Курс — про прикладную работу с Git от основы до уверенных навыков: установка и первичная настройка, локальный и удалённый репозитории, ветки и модели ветвления, слияния и разрешение конфликтов, сравнение версий и файлов, откладывание и отмена изменений. Разбираем rebase и cherry-pick, восстановление через reflog, SSH и GPG-подпись коммитов.
Результат: уверенно настраиваете и связываете репозитории, выстраиваете историю коммитов, ведёте ветки под задачи, безопасно сливаете и откатываете изменения, быстро находите нужные диффы, спасаете ситуацию с помощью reflog и собираете аккуратный рабочий процесс.
🔶 Записаться на курс
Курс — про прикладную работу с Git от основы до уверенных навыков: установка и первичная настройка, локальный и удалённый репозитории, ветки и модели ветвления, слияния и разрешение конфликтов, сравнение версий и файлов, откладывание и отмена изменений. Разбираем rebase и cherry-pick, восстановление через reflog, SSH и GPG-подпись коммитов.
Результат: уверенно настраиваете и связываете репозитории, выстраиваете историю коммитов, ведёте ветки под задачи, безопасно сливаете и откатываете изменения, быстро находите нужные диффы, спасаете ситуацию с помощью reflog и собираете аккуратный рабочий процесс.
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
❤🔥2⚡2
Media is too big
VIEW IN TELEGRAM
Что будет, если вы не выйдете на работу?
Основатель SimpleUp рассказывает, как компания реагирует на пропуски и опоздания новичков.
Полный эфир — на YouTube и в VK.
🐭 Смотреть на YouTube
🐹 Смотреть в VK
🎁 Программа обучения
Основатель SimpleUp рассказывает, как компания реагирует на пропуски и опоздания новичков.
Полный эфир — на YouTube и в VK.
Please open Telegram to view this post
VIEW IN TELEGRAM
👍3❤🔥1🔥1
В VS Code встроена подсветка ошибок и автодополнение, но для JavaScript этого мало. Форматировать код вручную, искать npm-модули по памяти, переключаться между проектами через проводник — всё это отнимает время.
Собрали 17 плагинов, которые закрывают эту рутину. Например,
🎁 Читать статью
Собрали 17 плагинов, которые закрывают эту рутину. Например,
npm Intellisense подсказывает модули по первым символам, а сниппет req + Tab разворачивает require в готовую строку. Каждый плагин — с описанием и ссылкой на установку. #js #vscodePlease open Telegram to view this post
VIEW IN TELEGRAM
⚡6❤🔥3
Media is too big
VIEW IN TELEGRAM
CSS Masking: быстро, просто и понятно.
CSS-маски — мощная и уже зрелая технология, которая в ближайшее время становится Widely Available. В этом ролике разбираем их с самого нуля. Попробуйте в демке самостоятельно и смотрите разбор целиком.
Полный разбор:
🐭 Смотреть на YouTube
🐹 Смотреть в VK
CSS-маски — мощная и уже зрелая технология, которая в ближайшее время становится Widely Available. В этом ролике разбираем их с самого нуля. Попробуйте в демке самостоятельно и смотрите разбор целиком.
Полный разбор:
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥5❤4❤🔥2
Сначала инженерная база — HTML, CSS, JavaScript, React и архитектура приложений. И только потом AI-агенты.
➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿
Профессия «Нейрофронтендер» построена именно так: нейросеть даёт ощутимый эффект только тогда, когда разработчик понимает, что происходит под капотом. Финальный модуль — работа с Cursor и GPT-5: генерация юнит-тестов, автодокументирование кода, ускорение ревью.
720 часов, 8 учебных проектов и индивидуальный проект с глубоким ревью кода. Для новичков, учитесь в своём темпе.
🎁 Подробнее о программе
Профессия «Нейрофронтендер» построена именно так: нейросеть даёт ощутимый эффект только тогда, когда разработчик понимает, что происходит под капотом. Финальный модуль — работа с Cursor и GPT-5: генерация юнит-тестов, автодокументирование кода, ускорение ревью.
720 часов, 8 учебных проектов и индивидуальный проект с глубоким ревью кода. Для новичков, учитесь в своём темпе.
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
❤🔥3
Если вы работаете в Figma только мышкой — вы работаете медленно. Переключение инструментов, экспорт, переименование слоёв — каждое действие через меню отнимает секунды, которые за день складываются в минуты.
Горячие клавиши это исправляют.
🎁 Читать статью
Горячие клавиши это исправляют.
Ctrl + \ прячет весь интерфейс, Ctrl + / открывает поиск по меню, V, F и T переключают инструменты мгновенно. Разбираем самые полезные сочетания с примерами и скриншотами. #tools #figmaPlease open Telegram to view this post
VIEW IN TELEGRAM
❤6❤🔥2🔥1