Forwarded from Как стать мидлом
Протоколы и сети: веб-безопасность
➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿
Фронтенд-инженер должен понимать, как проявляются XSS, CSRF, SQL-инъекции и другие атаки в веб-приложениях, и уметь закрывать их на клиенте в связке с сервером. В этом курсе вы разбираете реальные модели угроз и отрабатываете практики, которые снижает уязвимость фронтенд-компонентов.
На курсе научитесь проектировать CSP под свой проект, безопасно работать с cookie и защищать сессии, валидировать формы и хешировать пароли с солью, распознавать и устранять XSS/SQLi/CSRF, разбираться с DoS/Slowloris, корректно настраивать CORS и понимать сценарии MitM. Формат — «теория + кейсы + практика с эталонными решениями + тесты», по итогам — чек-листы для внедрения в рабочий процесс.
🔷 Смотреть программу
Фронтенд-инженер должен понимать, как проявляются XSS, CSRF, SQL-инъекции и другие атаки в веб-приложениях, и уметь закрывать их на клиенте в связке с сервером. В этом курсе вы разбираете реальные модели угроз и отрабатываете практики, которые снижает уязвимость фронтенд-компонентов.
На курсе научитесь проектировать CSP под свой проект, безопасно работать с cookie и защищать сессии, валидировать формы и хешировать пароли с солью, распознавать и устранять XSS/SQLi/CSRF, разбираться с DoS/Slowloris, корректно настраивать CORS и понимать сценарии MitM. Формат — «теория + кейсы + практика с эталонными решениями + тесты», по итогам — чек-листы для внедрения в рабочий процесс.
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
⚡6❤🔥2🔥2
Media is too big
VIEW IN TELEGRAM
Почему KLBR Studio — хороший старт карьеры в разработке?
Вера Ясюкевич, руководитель KLBR Studio, рассказала про возможности развития для джуна в команде.
Полный эфир с KLBR Studio — по ссылке:
🐭 Смотреть на YouTube
🐹 Смотреть в VK
➕ Подробнее о программе
У нас классные задачи. Они сложные, но заставляю вас расти.
Вера Ясюкевич, руководитель KLBR Studio, рассказала про возможности развития для джуна в команде.
Полный эфир с KLBR Studio — по ссылке:
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥7⚡1❤🔥1
Международный день кролика × Колесо Фортуны
В эти выходные кролики — в центре внимания, а у вас — повод начать. Крутите колесо на сайте — выпадет промокод к профессиям. Важнее не цифры, а то, что за ними: аккуратная вёрстка и уверенный JavaScript в «лайте» или работа в ритме продуктовой команды в «аналоге».
Нужен «заячий пинок» к старту — вот он.
🐇🐇🐇
Ищите на сайте «коробочку» и крутите колесо все выходные.
26–28 сентября • одна попытка • промокоды — только на профессии.
В эти выходные кролики — в центре внимания, а у вас — повод начать. Крутите колесо на сайте — выпадет промокод к профессиям. Важнее не цифры, а то, что за ними: аккуратная вёрстка и уверенный JavaScript в «лайте» или работа в ритме продуктовой команды в «аналоге».
Нужен «заячий пинок» к старту — вот он.
🐇🐇🐇
Ищите на сайте «коробочку» и крутите колесо все выходные.
26–28 сентября • одна попытка • промокоды — только на профессии.
🔥6⚡4❤1❤🔥1🤯1🤣1
Пропустили эфир Контур × HTML Academy? Запись уже доступна — можно спокойно посмотреть на выходных.
Вчера поговорили с Евгением Суанка (менеджер стажировок) и Аленой Малко (ведущий инженер-программист) о том, как джуну пройти отбор и что ждёт на стажировке.
Что важно из выпуска:
1️⃣ В Контуре открыто говорят: стажировки помогают понять культуру и быстрее влиться; многие начинают карьеру внутри — так адаптация идёт лучше. Компания часто нанимает через обучающие программы.
2️⃣ На интервью ценят честность, способность быстро учиться и проактивность.
3️⃣ Для новичка во фронтенде важна уверенная база: вёрстка + JavaScript и TypeScript.
4️⃣ Разбираем, как устроены видеовизитка, собеседование и стажировка в Контуре.
Сохраните и посмотрите на выходных: на скорости ×2 это ~30 минут — и у вас сложится честная картина, что ждёт фронтенд-джуна в продуктовой команде.
🐭 Смотреть на YouTube
🐹 Смотреть в VK
🔵 Программа обучения
Вчера поговорили с Евгением Суанка (менеджер стажировок) и Аленой Малко (ведущий инженер-программист) о том, как джуну пройти отбор и что ждёт на стажировке.
Что важно из выпуска:
Сохраните и посмотрите на выходных: на скорости ×2 это ~30 минут — и у вас сложится честная картина, что ждёт фронтенд-джуна в продуктовой команде.
Please open Telegram to view this post
VIEW IN TELEGRAM
⚡5🔥5❤1🤣1
Ни недели без выпусков «CSS Боль»!
В Chrome появилась свежая фича — CSS if(). Многие уже поспешили назвать это революцией и превращением CSS в язык программирования. Но всё ли так радужно?
В ролике:
1️⃣ что реально умеет if() — стилевые запросы, медиа и supports;
2️⃣ ограничения, из-за которых это пока только синтаксический сахар;
3️⃣ сравнение с классическими директивами;
4️⃣ и главное — куда всё это может развиться дальше.
Если интересно понять, как работает CSS if() на практике и стоит ли с нетерпением дожидаться(нет) полной поддержки — включайте выпуск!
🐭 Смотреть на YouTube
🐹 Смотреть в VK
В Chrome появилась свежая фича — CSS if(). Многие уже поспешили назвать это революцией и превращением CSS в язык программирования. Но всё ли так радужно?
В ролике:
Если интересно понять, как работает CSS if() на практике и стоит ли с нетерпением дожидаться
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥8⚡3❤2👍1
В CSS цвет можно задавать не только черезRGB
,HEX
илиHSL
, но и именованными ключевыми словами. Такие названия, какred
,limegreen
,blue
илиrebeccapurple
, делают стили понятнее и помогают быстрее накидывать оформление.
Имена цветов есть в CSS с первой спецификации и во многом выросли из палитры X11. Сегодня стандартизировано 147 именованных цветов, и их поддерживают все современные браузеры. Это удобный инструмент для прототипов и учебных проектов: он дополняет числовые форматы и CSS-переменные, но не заменяет их — особенно если важны точные бренд-оттенки и прозрачность.
Please open Telegram to view this post
VIEW IN TELEGRAM
❤4
This media is not supported in your browser
VIEW IN TELEGRAM
Магия sibling-count() в действии!
Создаём динамический индикатор загрузки без единой строчки JavaScript.
#css #frontend
Создаём динамический индикатор загрузки без единой строчки JavaScript.
#css #frontend
🔥10👍3
Операторы &&= и ||= — короткая запись для проверки и присваивания в JavaScript. Они помогают убирать лишние if и делают код компактнее — уже поддерживаются во всех современных браузерах.
В статье на простых примерах разбираем, как
&&=
присваивает новое значение только когда выражение слева истинно, а ||=
— когда слева ложное. Это удобно для деактивации флагов и установки значений по умолчанию без дублирования кода. Например, вместо if (a) a = b;
— a &&= b;
, а для «дефолта» — username ||= 'Гость'
. #js #baselinePlease open Telegram to view this post
VIEW IN TELEGRAM
❤🔥6🔥3⚡1
Запустился State of JavaScript 2025 — ежегодный опрос про то, чем мы пользуемся в JavaScript: фреймворки, инструменты и языковые фичи. Он помогает увидеть, что закрепляется в экосистеме, а что остаётся нишей. В прошлых выпусках, например, был заметен рост Vite и Astro. #js #stateofjs
Это открытый опрос: ~15–20 минут, вопросы можно пропускать. Чем больше ответов от нашего комьюнити, тем шире и полезнее будет картина. Мнение новичков тоже важно — даже если только начинаете, пройдите опрос.
Ссылку оставляем тут.
Опрос открыт до 1 ноября.
Это открытый опрос: ~15–20 минут, вопросы можно пропускать. Чем больше ответов от нашего комьюнити, тем шире и полезнее будет картина. Мнение новичков тоже важно — даже если только начинаете, пройдите опрос.
Ссылку оставляем тут.
Опрос открыт до 1 ноября.
Это встроенная возможность CSS, которая помогает выбрать элементы на странице по их порядку внутри какого-нибудь контейнера, например, списка или блока.
Этот псевдокласс позволяет выбирать элементы не только по чётности (
even
, odd
) или конкретному порядковому номеру, но и по формулам: 3n
, n+5
, -n+10
. С их помощью можно стилизовать каждый третий элемент, выделить диапазон — например, с пятого до десятого, и даже комбинировать условия, чтобы точно выбрать нужные позиции в списке или блоке. #cssВизуализация в статье помогает увидеть, как именно формулы влияют на выборку.
Эта же визуализация доступна в формате коротких клипов:
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥4⚡1❤🔥1
Forwarded from Как стать мидлом
Мастер анимаций: CSS и JavaScript-анимации
➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿
Анимация в интерфейсе — инструмент управления вниманием и смыслом. На курсе вы научитесь настраивать CSS-переходы (
Практика — через задания и пошаговые демонстрации. Отдельный блок — производительность и отладка: линейные и покадровые анимации, инструменты DevTools, оптимизация и учёт пользовательских настроек через медиазапросы
⏺ Смотреть программу
Анимация в интерфейсе — инструмент управления вниманием и смыслом. На курсе вы научитесь настраивать CSS-переходы (
transition
, transition-timing-function
), писать @keyframes
и использовать группу свойств animation
, связывать эффекты с взаимодействием (клик, скролл), собирать типовые сценарии — открытие и закрытие меню, бесконечный слайдер, табы и аккордеон — а также применять 2D/3D-трансформации и параллакс.Практика — через задания и пошаговые демонстрации. Отдельный блок — производительность и отладка: линейные и покадровые анимации, инструменты DevTools, оптимизация и учёт пользовательских настроек через медиазапросы
prefers-reduced-motion
и update
. На выходе — умение делать анимации, которые помогают интерфейсу и стабильно работают на разных устройствах. #css #jsPlease open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
❤🔥2❤2👍2⚡1
Media is too big
VIEW IN TELEGRAM
Совсем недавно мы проводили Чемпионат по вёрстке — 45 участников, 13 дней.
Что сказали эксперты про уровень работ:
✅ «Работы достойны продакшена»
✅ «Это уже уровень джунов, а не интернов»
✅ «Макет непростой, но ребята справились круто»
✅ «Очень понравилось внимание к деталям и креативные решения»
Итог: все финалисты подтвердили, что уже готовы к реальным проектам. И, да, чемпионат точно стоит повторить!
Что сказали эксперты про уровень работ:
Итог: все финалисты подтвердили, что уже готовы к реальным проектам. И, да, чемпионат точно стоит повторить!
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥21👍2
HTML Academy и Only запускают второй поток обучения под работодателя. Небольшая группа, практические задачи и менторская поддержка — программа синхронизирована с процессами компании, а выпускники могут попасть на стажировку.
Приходите на эфир 9 октября в 12:00 (MSK), чтобы:
Бонус: разыграем одно бесплатное место на программу среди первых 100 зарегистрировавшихся. Победителя объявим в конце трансляции.
Эфир онлайн, участие бесплатное. Регистрируйтесь по ссылке — пришлём напоминание перед началом и расскажем, как попасть на обучение.
https://htmlacademy.ru/events/live-only-2025
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥9 3❤🔥2❤1
Новый выпуск «CSS Боль»!
Мы находимся на пороге нового дивного мира, в котором задавать условия отображения стилей можно прямо в СSS! Для этого не хватало удобного механизма сравнения CSS-переменных. Но он появился! Мы разберём удивительно простой приём, который открывает нам путь в новую эру CSS.
🐭 Смотреть на YouTube
🐹 Смотреть в VK
Мы находимся на пороге нового дивного мира, в котором задавать условия отображения стилей можно прямо в СSS! Для этого не хватало удобного механизма сравнения CSS-переменных. Но он появился! Мы разберём удивительно простой приём, который открывает нам путь в новую эру CSS.
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥5❤4 2⚡1❤🔥1
HTML Academy
Новый выпуск «CSS Боль»! Мы находимся на пороге нового дивного мира, в котором задавать условия отображения стилей можно прямо в СSS! Для этого не хватало удобного механизма сравнения CSS-переменных. Но он появился! Мы разберём удивительно простой приём,…
This media is not supported in your browser
VIEW IN TELEGRAM
❤🔥9❤2 1
Как защитить VPS от взлома: 10 простых правил
➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿
Безопасность VPS — не про «поставил пароль и забыл», а про системный подход. В статье собраны десять базовых, но важных мер, которые снижают риск распространённых атак. Полезно и фронтендерам: если вы держите на VPS личные проекты, демо или тестовые стенды — этот минимум стоит знать.
Внутри — минимум для базовой защиты: вход по ключам и запрет паролей, настройка ufw и список допущенных пользователей, fail2ban против брутфорса, автоматические обновления и регулярные бэкапы. Плюс — как следить за логами; бонусом — 2FA для SSH. #vps #security
🔵 Читать статью
Безопасность VPS — не про «поставил пароль и забыл», а про системный подход. В статье собраны десять базовых, но важных мер, которые снижают риск распространённых атак. Полезно и фронтендерам: если вы держите на VPS личные проекты, демо или тестовые стенды — этот минимум стоит знать.
Внутри — минимум для базовой защиты: вход по ключам и запрет паролей, настройка ufw и список допущенных пользователей, fail2ban против брутфорса, автоматические обновления и регулярные бэкапы. Плюс — как следить за логами; бонусом — 2FA для SSH. #vps #security
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥7⚡3❤3❤🔥1👍1