HTML Academy

описание

Курсы по веб-разработке: вёрстка, программирование, работа и комьюнити. Наш секретный бот @HTMLAcademyKeksobot. Вопросы по обучению @htmlacademy_sales Ролики на YT https://www.youtube.com/@HTMLAcademyTV Ролики на VK https://vkvideo.ru/@htmlacademy

← к каналу @htmlacademy

9 630

подписчиков

Охват к подписчикам

10,0%

ERR

Реакции к просмотрам

0,99%

435 на 50 постов

Пересылки к просмотрам

0,82%

362

Постов в день

0,1

всего 84

Где отзываются чаще

доля реакций к просмотрам

17 июн.без подписи2,44%
31 июл.Флексы или флоаты Для опытных разработчиков этот вопрос даже не встаёт. Выбор в пользу флоатов очевиден. Но для фронтендеров-неофитов последних двух поколений были придуманы флексы. Этакое простое введение в системы раскладок (в общем-то такая же эрзац-система-раскладки, как и гриды). Главная цель флексов — не отпугнуть новичка на пути к вершине мастерства (флоатам). Так что не удивляйтесь их достаточно слабым возможностям. Свои первые робкие шаги во флексах можно сделать в нашей красивой псевдо-три-дэ игре2,07%
19 маябез подписи1,68%
27 маяРегрессия проявилась после обновления, тесты её не ловят, в main за неделю — 40 коммитов от семи разработчиков. Перебирать вручную, делая git checkout на каждый, — потерянный день. git bisect сводит это к бинарному поиску по истории. Помечаете один коммит рабочим, второй сломанным. Git сам переключается на середину диапазона и спрашивает: «Здесь работает?» На 40 коммитов хватает 6 шагов, на 800 — 10. Если поведение покрыто тестом — можно вообще ничего не нажимать. git bisect run npm test проходит весь путь сам и возвращает хеш виноватого коммита. В статье — пошаговый разбор с командами и интерактивная симуляция поиска. #tools #git ✍️ Читать статью1,68%
2 июн.без подписи1,66%
3 июл.Мини-игра по CSS-фильтрам Нужно менять код, подбирая комбинации карточек, чтобы повторить образец. Чем меньше ходов — тем лучше. Можно играть даже на мобильном. Играть здесь1,62%
3 июн.Присваиваете объект через = — и получаете вторую ссылку на тот же объект. Меняете «копию» — меняется оригинал. spread и Object.assign() спасают только частично: копируют первый уровень, а вложенные объекты и массивы остаются общими. Долгое время глубокую копию собирали через JSON.parse(JSON.stringify(obj)). Способ рабочий, но теряет данные: Date превращается в строку, функции и undefined исчезают, Map становится пустым объектом. structuredClone() делает полную независимую копию и корректно обрабатывает Date, Map, Set, ArrayBuffer, RegExp и другие встроенные типы. Функции и узлы DOM клонировать не получится — будет DataCloneError. Доступен во всех актуальных браузерах и в Node.js с 17-й версии. В статье — интерактивный пример: нажимаете кнопку и видите, как ведут себя =, spread и structuredClone() на одном объекте. #js #clone 🔴 Читать статью1,51%
19 июн.TypeScript ловит ошибки типов до запуска, но только когда типы описаны точно. Достаточно одного any или приблизительной аннотации — и редактор перестаёт подсвечивать ошибку, которая всплывёт уже у пользователя. Курс «TypeScript: Теория типов» — про то, как система типов устроена изнутри: дженерики, условные и отображаемые типы, объединения и пересечения, брендирование. 6 разделов и куча типовых задач, пошаговые эталонные решения, рядом поддержка эксперта. Доступ к материалам всегда под рукой. После курса будете уверенно типизировать и во фронтенде, и в бэкенде. Гибкие сроки — начать можно прямо сейчас. #htmlacademy #levelup А в эти выходные, 20 и 21 июня, на курс будет большая разовая скидка 60% по промокоду TS60 — всего два дня и только на «TypeScript: Теория типов». 🔄 Смотреть программу1,47%
8 маяПосле курса вы соберёте микроанимации для состояний :hover и :focus, морфинг SVG-логотипа через анимацию атрибута d, прорисовку иллюстрации через stroke-dasharray и stroke-dashoffset, Canvas-сцены с физикой и собственными функциями плавности, шейдерные эффекты на GLSL (цветовые фильтры, маски, displacement, шум Перлина), трёхмерные сцены на Three.js с Camera Rig и шейдерной постобработкой — без сторонних анимационных библиотек. Разберётесь в пайплайне отрисовки браузера и поймёте, почему transform и opacity не вызывают пересчёт раскладки и перерисовку, а left запускает их заново. Узнаете, как читать prefers-reduced-motion, отлаживать FPS в DevTools и применять 12 принципов анимации Disney к интерфейсам. В WebGL увидите, что происходит между вершинным и фрагментным шейдером, как передавать данные через attributes, uniforms и varying. В Three.js научитесь изолировать движения через Group, делать сжатие и растяжение с сохранением объёма и проектировать Camera Rig под конкретную задачу. А ещё GSAP, Snap.svg и PixiJS — чтобы наверняка. #htmlacademy #levelup 🎁 Подробнее1,36%
5 июн.Vite 8 стартует сервер разработки за секунду, показывает правки на лету и собирает продакшен до 10–30 раз быстрее прошлой версии. На скорость повлияла смена движка: esbuild для разработки и Rollup для сборки заменил Rolldown, единый сборщик на Rust поверх парсера Oxc. Конфиг? Для типового проекта его можно не писать. У Vite разумные значения по умолчанию. Vite — фактический стандарт сборки фронтенда: на нём работают Vue, SvelteKit, Nuxt и Astro. После отказа от Create React App его рекомендует и команда React (первый в списке сборщиков). Курс «Vite 8» это шесть разделов от нулевой конфигурации до деплоя на GitHub Pages через GitHub Actions. Внутри настройка стилей и препроцессоров, оптимизация графики, тесты в Vitest и отдельный раздел про миграцию с Gulp и Webpack. Курс по Vite полностью на русском языке с практикой и эталонными решениями. #htmlacademy #levelup В эти выходные, 6 и 7 июня, курс «Vite 8» можно будет взять со скидкой 60% по промокоду VITE60 — только два дня и только на этот курс. 📎 Смотреть программу1,33%
1 июл.Git — инструмент, без которого не обходится ни один проект. Мы собрали бесплатный учебник по Git и GitHub — 11 глав от введения в системы контроля версий до решения типичных проблем. Структура учебника выстроена так, чтобы двигаться последовательно: сначала базовые понятия и команды clone, pull, push, add, commit, потом регистрация на GitHub, работа в VS Code, GitHub Desktop и консоли, следом — бесплатный хостинг на GitHub Pages и разбор ситуаций, когда что-то пошло не так. Последняя глава — перевод «First Aid Git»: что делать, если случайно удалили ветку, отправили не тот коммит или запутались в слиянии. Учебник бесплатный, читать можно в любом порядке. #git #github ⭐ Читать статью1,32%
9 июн.без подписи1,32%