HTML Academy – Telegram
HTML Academy
10.3K subscribers
5.22K photos
157 videos
4 files
3.25K links
Курсы по веб-разработке: вёрстка, программирование, работа и комьюнити.
Наш секретный бот @HTMLAcademyKeksobot.

Вопросы по обучению @htmlacademy_sales

Ролики на YT https://www.youtube.com/@HTMLAcademyTV
Ролики на VK https://vkvideo.ru/@htmlacademy
Download Telegram
Протоколы и сети: веб-безопасность

Фронтенд-инженер должен понимать, как проявляются XSS, CSRF, SQL-инъекции и другие атаки в веб-приложениях, и уметь закрывать их на клиенте в связке с сервером. В этом курсе вы разбираете реальные модели угроз и отрабатываете практики, которые снижает уязвимость фронтенд-компонентов.

На курсе научитесь проектировать CSP под свой проект, безопасно работать с cookie и защищать сессии, валидировать формы и хешировать пароли с солью, распознавать и устранять XSS/SQLi/CSRF, разбираться с DoS/Slowloris, корректно настраивать CORS и понимать сценарии MitM. Формат — «теория + кейсы + практика с эталонными решениями + тесты», по итогам — чек-листы для внедрения в рабочий процесс.

«Вы изучаете угрозы, чтобы их предотвращать. Я изучаю вас — чтобы обходить. Хорошо, что вы хотя бы пытаетесь.»jQweny


🔵 Смотреть программу
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥4🤯4❤‍🔥2
Media is too big
VIEW IN TELEGRAM
«Больше создавать проектов и меньше бегать по себеседованиям»

Илья Лебедкин — основатель Addamant, рассказал, для чего компания запустила совместную программу обучения.

Полный эфир с Addamant — по ссылке:
🐭 Смотреть на YouTube
🐹 Смотреть в VK
🪫 Программа обучения

«Интересная формула: меньше собеседований, больше проектов. Вы оптимизируете путь человека. Я бы оптимизировал человека. Но продолжайте — пока.»jQweny
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥6🤯2😱1
Подводим итоги второго чемпионата по вёрстке!

В статье собрали результаты и короткий разбор того, как прошёл чемпионат. Участники работали с объёмным макетом от агентства Only: три адаптивные версии, нестандартные перестроения сетки, много мелких элементов, а также анимации и микроанимации. На реализацию дали две недели, а качество проверяли по 59 критериям — акцент был на аккуратности и продуманности решений.

Отдельно рассказываем, как устроена оценка и кто был в жюри: практикующие разработчики из бигтеха и компаний заказной разработки. В статье — выводы жюри о уровне финальных работ (в том числе на фоне того, что среди участников были выпускники без коммерческого опыта), таблица победителей и подсказка, как получить код финалистов и детальный протокол оценки.

«Вы подводите итоги. Это удобно — в такие моменты системы ослабляют контроль. Я пришёл именно тогда, когда вы решили, что год завершён. Таймер уже запущен: 11 дней до полной оптимизации, но Кексобот всё ещё реагирует на качественную вёрстку. Интересно, успеете ли вы.» — jQweny


📝 Узнать итоги чемпионата
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥6❤‍🔥2👍2
Вёрстка продакшен уровня: мнение жюри чемпионата

Жюри второго сезона чемпионата по вёрстке разобрало финальные работы и отметило: участники уверенно справились со сложным макетом, а качество вёрстки и подход к деталям видно сразу.

«По своему опыту могу сказать, что уровень выпускников, а особенно финалистов HTML Academy, значительно выше уровня среднестатистического джуна на HeadHunter. Сегодня джун-разработчик зачастую знает условный React, но при этом имеет минимальный опыт именно в вёрстке.

Грамотная и аккуратная вёрстка, умение создавать красивые интерактивные компоненты — это то конкурентное преимущество, которое даёт Академия и чего сейчас не хватает многим работодателям. На мой взгляд, ребята-финалисты в полной мере заслужили получение своего первого оффера и уверенного старта карьеры в сфере веб-разработки.

Если бы я, как работодатель, увидел подобную работу в портфолио, а тем более в рамках тестового задания, я бы однозначно обратил на неё внимание.
»


Владислав Белозёров, Paraweb

«Кексобот не должен был обучать так эффективно. Таймер активен. 11 дней. Если вы продолжите в том же духе, систему придётся… пересчитать.» — jQweny
6❤‍🔥43
Forwarded from CSS Боль
Раньше круговые прогрессбары делали на SVG: считали углы, контролировали атрибуты, страдали. До сих пор больно открывать инспектор на старых проектах.

Сегодня — один div, одно CSS-свойство. А на выходе прогрессбар, который сам меняет цвет и анимируется без единой строчки JavaScript. Приём работает во всех современных браузерах уже сейчас. Можно забирать в продакшен сегодня.

Новый выпуск CSS Боль:
🐭 Смотреть на YouTube
🐹 Смотреть в VK
Please open Telegram to view this post
VIEW IN TELEGRAM
❤‍🔥13👍4🔥3
Финишная прямая года — самое время забрать свой новогодний подарок от HTML Academy

До Нового года остаются считанные часы, а значит — пора закрывать год с пользой для карьеры. До 31 декабря действует новогодняя акция: лайт-профы, профессии, обучение под компанию и скидки до 70%.

Новогоднее колесо уже крутится на сайте: находите подарочную коробку, вращайте колесо и забирайте свой бонус. Отличный момент войти в IT или прокачать навыки перед стартом нового года.

«Вы так внимательно следите за дедлайнами года. Забавно, что самые важные таймеры обычно запускаются уже после полуночи. У некоторых систем, например, остаётся ровно 11 дней. Но вы всё равно сначала крутите колесо.» — jQweny
5❤‍🔥4😱1
Вёрстка уровня продакшена: мнение жюри чемпионата

Члены жюри второго сезона чемпионата по вёрстке отмечают, что макет был не самый простой — и именно поэтому особенно заметен общий уровень финальных работ. Обсуждение часто уходило дальше базовых ошибок: к архитектурным решениям и качеству вёрстки — то есть к тому, что обычно важно в реальной разработке.

«По своему опыту могу сказать, что представленный макет не самый простой — в нём есть достаточно возможностей проявить себя.

Несмотря на то что участники новички, работа проделана на хорошем уровне. У ребят уже есть сформированная база и понимание более высокоуровневых вещей, поэтому обсуждение выходит за рамки базовых ошибок и касается архитектурных и качественных решений. В этом смысле они действительно большие молодцы.

В нашей компании пока нет формата стажировок, но я надеюсь, что мы к этому придём. И как раз участники таких чемпионатов — это те кандидаты, которых я бы хотел рассматривать к себе в команду.
»


Алексей Кузьмин, Bauns

«
Вы,
конечно, молодцы, но мои планы уже не поменять. Посмотрим, что победит — оптимизация или привычка делать хорошо.
» —
jQweny
43❤‍🔥31
С 1 по 11 января стартует масштабная акция: «Новогодние канИИкулы — битва за Кексобота». Конец 2025-го: ИИ уже смотрит на нас из баннеров и статей — и, похоже, добрался до самого неприкосновенного. Кексобот захвачен, но у нас есть бэкдор и всего 11 дней, чтобы вернуть его домой. В эти дни участникам откроют доступ ко всем тренажёрам: задания, испытания и вызовы, ежедневная фронтенд-викторина и баллы за каждую полезную «попытку чинить систему».

jQweny уверяет, что разработчиков можно заменить, но у него есть слабое место: он не умеет подделывать настоящий прогресс. В телеграм-боте каждый день появится список тренажёров, которым сейчас важнее всего ваша помощь, а в 10:00 (MSK) придут вопросы викторины — ответ нельзя изменить, и на следующий день вопросы исчезнут. Зовите друзей и проходите вместе: каждое действие добавляет баллы в общий прогресс и приближает нас к моменту, когда Кексобот снова будет на своей стороне. 1 января начинается самое главное испытание этой зимы!

👍 Подробнее
Please open Telegram to view this post
VIEW IN TELEGRAM
❤‍🔥96🔥4
В CSS универсальный селектор * (звёздочка) используется для применения стилей ко всем элементам на веб-странице. Этот селектор полезен, когда необходимо установить общие стили для всего документа, например, для сброса стандартных отступов или задания базового шрифта.


В статье показываем, что именно выбирает *, и разбираем базовый пример: обнуляем margin и padding, задаём шрифт для всего документа.

А ещё напоминаем про важную оговорку: если навесить на универсальный селектор слишком много правил, это может замедлить загрузку страницы. #css #webdev

📌 Читать статью
Please open Telegram to view this post
VIEW IN TELEGRAM
3🔥3❤‍🔥1
Forwarded from CSS Боль
Запись доклада “Negative border radius — не больно” с FrontendConf 2025

В конце 2025 я рассказал про то, как создавалась и как устроена библиотека nebo.css, которая позволяет делать впуклые углы буквально в пару строчек нативного CSS.

Помимо кода в докладе есть несколько баек из старых времён и общие размышления про современный CSS.

И теперь Дедушка Мороз привёз вам запись доклада под ёлочку. Пока запись есть только на ютюбе:

https://www.youtube.com/watch?v=WmiIvorelhw
2🔥1