Всё про единицы измерения
❗️ В статье разбираем, когда
em
: просто и понятноem
— мощный инструмент для адаптивной типографики и интерфейсов. Он требует внимательности к контексту, но позволяет легко управлять масштабом и пропорциями элементов на странице.
em
— лучшее решение, а также рассматриваем примеры его использования.Please open Telegram to view this post
VIEW IN TELEGRAM
👍8🔥3❤🔥2
Forwarded from Как стать мидлом
Vue.js 3 на практике: Vite, Composition API, Pinia и тесты
На курсе разбираем современные подходы к клиентским приложениями на Vue.js 3: script setup и реактивность, маршрутизацию с guard’ами, управление состоянием в Pinia, работу с HTTP и обработку ошибок, анимации, модульные тесты на Vitest и Vue Test Utils.
Практика — два проекта: учебный таск-менеджер и фронтенд онлайн-пиццерии поверх готового API. Формат — теория → разбор → задачи. В чате отвечаем на вопросы и показываем типичные решения.
📌 Программа и детали: https://htmlacademy.ru/levelup/vue
На курсе разбираем современные подходы к клиентским приложениями на Vue.js 3: script setup и реактивность, маршрутизацию с guard’ами, управление состоянием в Pinia, работу с HTTP и обработку ошибок, анимации, модульные тесты на Vitest и Vue Test Utils.
Практика — два проекта: учебный таск-менеджер и фронтенд онлайн-пиццерии поверх готового API. Формат — теория → разбор → задачи. В чате отвечаем на вопросы и показываем типичные решения.
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥6⚡4❤🔥4
Media is too big
VIEW IN TELEGRAM
Где компаниям находить джунов в команду или проблема одинаковых резюме
Вера Ясюкевич, руководитель KLBR Studio, рассказала, почему компании проще брать разработчиков из образовательных программ, чем искать их на платформах онлайн-рекрутинга:
Полный эфир с KLBR Studio — по ссылке:
🐭 Смотреть
🐹 Смотреть
✅ Подробнее о программе
Вера Ясюкевич, руководитель KLBR Studio, рассказала, почему компании проще брать разработчиков из образовательных программ, чем искать их на платформах онлайн-рекрутинга:
«Вот эти отклики, которые сейчас есть, с абсолютно шаблонными описаниями, с абсолютно шаблонными ответами, без конкретики, где ты сам сидишь, выискиваешь у кандидата, есть у него вообще релевантный опыт или нет, и где его смотреть. Это ад. Поэтому мы пробуем новый путь.
Полный эфир с KLBR Studio — по ссылке:
Please open Telegram to view this post
VIEW IN TELEGRAM
❤4🔥3👍1
Forwarded from Кексобот: неделя знаний
День 6️⃣, сообщение от Кекса
В программе:
89 заданий, 4 испытания и 5 вызовов, а также 134 балла.
Подробнее | Кексобот | Правила
Мур-мур! Сегодня наводим движение без суеты: шлифуем трансформации и тайминг, ставим акценты там, где они нужны, и подключаем переменные, чтобы управлять стилями из одного места — анимации помогают делу, интерфейс остаётся предсказуемым, а финишная прямая уже видна: до финала всего два дня.
В программе:
89 заданий, 4 испытания и 5 вызовов, а также 134 балла.
Подробнее | Кексобот | Правила
Forwarded from Кексобот: неделя знаний
День 7️⃣, сообщение от Кекса
В программе:
112 заданий и 6 испытаний, а также 142 балла.
Подробнее | Кексобот | Правила
Мр-мяу! Финальный рывок: сегодня собираем «системность» — наводим порядок в стилях с препроцессором и смотрим на проект глазами сервера. Чуть-чуть дисциплины в переменных и цветовых функциях, капля модульности в компонентах, щепотка шаблонов — и интерфейс становится предсказуемым и масштабируемым. Это последний день недели знаний, а завтра — прямой эфир с розыгрышем призов: самое время красиво добежать до ленточки.
В программе:
112 заданий и 6 испытаний, а также 142 балла.
Подробнее | Кексобот | Правила
cause
: ключ к понятной обработке ошибок в JavaScriptПри работе с ошибками в JavaScript часто возникает ситуация, когда нужно перехватить исключение, выполнить какие-то действия, а затем выбросить новую ошибку. В такой цепочке легко потерять исходную причину вызвавшую ошибку.
Свойство cause позволяет передать оригинальную ошибку дальше по цепочке, не теряя контекста.
cause
поддерживается в современных браузерах и средах, включая Node.js. Разбираем детали и примеры → статья.Please open Telegram to view this post
VIEW IN TELEGRAM
Media is too big
VIEW IN TELEGRAM
Круговая диаграмма на чистом CSS
Чистый CSS уже многое умеет для простой визуализации данных. Только взгляните: круг собирается через
❗️ Смотрите и другие визуализации на удобных площадках:
YouTube | VK Video
Чистый CSS уже многое умеет для простой визуализации данных. Только взгляните: круг собирается через
conic-gradient
, цвета задаются в кастомных свойствах, форма "бублика" получается с помощью масок.❗️ Смотрите и другие визуализации на удобных площадках:
YouTube | VK Video
🔥11❤4
counter-set
в CSS: как задать номер без хака и JavaScriptcounter-set
— это новое CSS-свойство, с помощью которого можно явно установить значение счётчика в нужный момент.
Свойство поддерживается в современных браузерах и решает задачу, для которой раньше приходилось лезть в HTML или писать JavaScript. В статье рассказываем, где использовать свойство.
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥5❤3
navigator.credentials
: как ускорить вход в браузереnavigator.credentials
позволяет браузеру безопасно хранить и по запросу возвращать учётные данные — пароли, токены или ключи. Через get()
можно получить сохранённые данные (например, с mediation: optional
), а через store()
— сохранить их после входа.Работает по HTTPS, требует фокуса страницы. Поддерживается в Chrome, Edge и Android WebView; в Safari и Firefox — частично или нет.
Please open Telegram to view this post
VIEW IN TELEGRAM
❤4👍1
HTML Academy
CSS-боль, выпуск про чистый CSS Сегодня две функции: sibling-index() и sibling-count(). Что внутри: - как раньше решали задачу и почему это боль; - как помогали циклы в препроцессорах и зачем от них уходить; - промежуточный вариант на переменных и calc();…
Вышла вторая часть разбора радиальных градиентов в CSS!
В первой мы научились управлять цветами, смещать центр и менять форму. А теперь — идём глубже:
1️⃣ Radial shape: как зафиксировать градиент в форме круга (circle).
2️⃣ Radial size: абсолютные размеры и ограничения для процентов.
3️⃣ Четыре ключевых слова (closest-side, farthest-side, closest-corner, farthest-corner) — как они работают и когда реально выручают.
4️⃣ Практика: делаем анимированный «бильярдный шарик» с бликом.
🐭 Смотреть на YT
🐹 Смотреть в VK Video
В первой мы научились управлять цветами, смещать центр и менять форму. А теперь — идём глубже:
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥6❤🔥4⚡2
Подводим итоги!
Чемпионат по вёрстке подошёл к концу. В 12:00 вместе с экспертами из компаний подведём итоги чемпионата, раздадим оценки и выберем победителя.
🐭 Подключиться в YT
🐹 Подключиться в VK Video
Чемпионат по вёрстке подошёл к концу. В 12:00 вместе с экспертами из компаний подведём итоги чемпионата, раздадим оценки и выберем победителя.
Please open Telegram to view this post
VIEW IN TELEGRAM
1⚡4❤🔥3 3🔥2
Forwarded from Как стать мидлом
Сети и протоколы без магии: базовые знания, которые нужны фронтендеру
➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿
Разберётесь, как данные реально идут по сети: от модели OSI и стека TCP/IP до различий между HTTP/1.1, HTTP/2 и HTTP/3; когда уместны WebSockets; как работает TLS и проверка сертификатов. С этими знаниями вы осознанно выбираете транспорт под сценарий и понимаете, что происходит при установке защищённого соединения.
Результат — меньше накладных расходов и быстрее метрики вроде TTFB/LCP, плюс снижение рисков уязвимостей за счёт корректной настройки шифрования и аутентификации.
🟠 Смотреть программу
Разберётесь, как данные реально идут по сети: от модели OSI и стека TCP/IP до различий между HTTP/1.1, HTTP/2 и HTTP/3; когда уместны WebSockets; как работает TLS и проверка сертификатов. С этими знаниями вы осознанно выбираете транспорт под сценарий и понимаете, что происходит при установке защищённого соединения.
Результат — меньше накладных расходов и быстрее метрики вроде TTFB/LCP, плюс снижение рисков уязвимостей за счёт корректной настройки шифрования и аутентификации.
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
❤2👍1
This media is not supported in your browser
VIEW IN TELEGRAM
Гайд, как не пройти испытательный срок
Наверное, всех джунов интересует, как пройти испытательный срок и крепко закрепиться в компании. Вера Ясюкевич, руководитель KLBR Studio, поделилась основной ошибкой новичков, которая приводит к отказу после испытательного срока.
Полный эфир с KLBR Studio — по ссылке:
🐭 Смотреть в YT
🐹 Смотреть в VK Video
🟢 Подробнее о программе
Наверное, всех джунов интересует, как пройти испытательный срок и крепко закрепиться в компании. Вера Ясюкевич, руководитель KLBR Studio, поделилась основной ошибкой новичков, которая приводит к отказу после испытательного срока.
Полный эфир с KLBR Studio — по ссылке:
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥5 3⚡1❤🔥1
Технические выходные × Колесо фортуны
🎉 День программиста: хороший повод закрыть пробелы и подобрать «пару» курсов на вырост. Одно вращение колеса и случайный подарок ваш. Ищите на сайте коробочку и вращайте колесо все выходные.
➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿
Что добавить в копилку знаний:
— Алгоритмы и паттерны — практика структур данных, разбор сложностей и идиом проектирования в FE.
— Сети и безопасность — протоколы, модели угроз для веб-приложений, практики защиты.
— TypeScript — системное мышление о типах, работа с дженериками, утилитами и сужением типов.
— Vue, Vite, Webpack — сборка под прод, профилирование бандла, HMR по делу.
— Анимации (CSS/JS/SVG) — тайминг-функции, последовательности, производительность.
— Доступность (a11y) и дизайн-системы — роли и атрибуты, токены, библиотека компонентов.
➡️ Коротко: 1 вращение • 12–14 сентября • 7 дней на применение.
https://htmlacademy.ru
🎉 День программиста: хороший повод закрыть пробелы и подобрать «пару» курсов на вырост. Одно вращение колеса и случайный подарок ваш. Ищите на сайте коробочку и вращайте колесо все выходные.
Что добавить в копилку знаний:
— Алгоритмы и паттерны — практика структур данных, разбор сложностей и идиом проектирования в FE.
— Сети и безопасность — протоколы, модели угроз для веб-приложений, практики защиты.
— TypeScript — системное мышление о типах, работа с дженериками, утилитами и сужением типов.
— Vue, Vite, Webpack — сборка под прод, профилирование бандла, HMR по делу.
— Анимации (CSS/JS/SVG) — тайминг-функции, последовательности, производительность.
— Доступность (a11y) и дизайн-системы — роли и атрибуты, токены, библиотека компонентов.
https://htmlacademy.ru
Please open Telegram to view this post
VIEW IN TELEGRAM
👍9❤🔥3🔥2
Прямой эфир с лидом бэкенд-разработки в Garage Eight
👍 Garage Eight и HTML Academy запускают совместную программу «Обучение под работодателя»: вы занимаетесь в небольшой группе, осваиваете PHP и ООП, REST-подход и тестирование, пробуете типовые задачи джуна на учебных проектах, работаете с Git и CI. На эфире разберём, как это соотносится с рабочими процессами команды и входом на стажировку.
Приходите на эфир 18 сентября в 12:00 (MSK), чтобы:
🔲 Понять, как устроены процессы в Garage Eight: ревью кода, менторство, адаптация новичка и план первых недель;
🔲 Разобрать программу по делу: какие навыки требуются на старте (PHP, работа с фреймворками, REST, тесты) и как они закрываются на учёбе;
🔲 Узнать про стажировку: критерии готовности, отбор, формат занятости и типовые задачи для джуна на входе.
➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿
Планируете вход в профессию, хотите понять ожидания к джуну и как выглядит старт в продуктовой команде? Зарегистрируйтесь по ссылке — пришлём напоминание и доступ к эфиру.
Приходите на эфир 18 сентября в 12:00 (MSK), чтобы:
Планируете вход в профессию, хотите понять ожидания к джуну и как выглядит старт в продуктовой команде? Зарегистрируйтесь по ссылке — пришлём напоминание и доступ к эфиру.
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥4❤🔥2⚡1👏1