Forwarded from Как стать мидлом
Webpack без боли: от конфигурации до оптимизации
➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿
На курсе вы разберёте Webpack на практике: базовую конфигурацию (entry/output), перенос проекта на webpack, сборку многостраничных приложений, работу с плагинами и обработчиками, asset-modules, code splitting и оптимизации под production.
Каждый модуль — прикладные задачи: настройка npm-скриптов, подключение Babel, ESLint и Prettier, конфигурация плагинов и обработчиков, разделение dev и prod с source maps, уменьшение бандла (минимизация, выделение вендоров). После курса вы сможете добавлять сборщик в проект, создавать и поддерживать конфиги на рабочих проектах, собирать MPA и оптимизировать артефакты перед деплоем. #htmlacademy #levelup
🟢 Смотреть программу
На курсе вы разберёте Webpack на практике: базовую конфигурацию (entry/output), перенос проекта на webpack, сборку многостраничных приложений, работу с плагинами и обработчиками, asset-modules, code splitting и оптимизации под production.
Каждый модуль — прикладные задачи: настройка npm-скриптов, подключение Babel, ESLint и Prettier, конфигурация плагинов и обработчиков, разделение dev и prod с source maps, уменьшение бандла (минимизация, выделение вендоров). После курса вы сможете добавлять сборщик в проект, создавать и поддерживать конфиги на рабочих проектах, собирать MPA и оптимизировать артефакты перед деплоем. #htmlacademy #levelup
Please open Telegram to view this post
VIEW IN TELEGRAM
Please open Telegram to view this post
VIEW IN TELEGRAM
🤯2
Media is too big
VIEW IN TELEGRAM
Формирование ИПР после испытательного срока
Илья Лебедкин — основатель Addamant, рассказал про путь после обучения.
Полный эфир с Addamant — по ссылке:
🐭 Смотреть на YouTube
🐹 Смотреть в VK
🪫 Программа обучения
Илья Лебедкин — основатель Addamant, рассказал про путь после обучения.
Полный эфир с Addamant — по ссылке:
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥4👏3❤🔥2
Forwarded from CSS Боль
Как упростить React в 2 раза с помощью программирования на CSS
➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿ ➿
В новом выпуске «CSS Боль» показываем, как современный CSS убивает React. На реальном примере слайдера разбираемся, почему компонент разрастается до сотни строк — и как сделать его вдвое проще, ничего не потеряв.
Внутри — живой пример, где два компонента выглядят одинаково, но один написан «по привычке», а второй — с использованием возможностей современного CSS. После этого выпуска React перестаёт быть калькулятором для стилей, а CSS — «просто оформлением».
В выпуске:
✓ Классическая реализация слайдера на React: состояние, вычисления и условия
✓ Как перенести расчёты положения и состояний элементов в CSS
✓ Использование CSS-переменных и
✓ Что такое «реактивный CSS» и как он работает вместе с React
✓ Когда можно начать использовать этот подход
🐭 Смотреть на YouTube
🐹 Смотреть в VK
В новом выпуске «CSS Боль» показываем, как современный CSS убивает React. На реальном примере слайдера разбираемся, почему компонент разрастается до сотни строк — и как сделать его вдвое проще, ничего не потеряв.
Внутри — живой пример, где два компонента выглядят одинаково, но один написан «по привычке», а второй — с использованием возможностей современного CSS. После этого выпуска React перестаёт быть калькулятором для стилей, а CSS — «просто оформлением».
В выпуске:
✓ Классическая реализация слайдера на React: состояние, вычисления и условия
✓ Как перенести расчёты положения и состояний элементов в CSS
✓ Использование CSS-переменных и
calc() вместо JavaScript✓ Что такое «реактивный CSS» и как он работает вместе с React
✓ Когда можно начать использовать этот подход
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥7❤🔥3
Конец 2025 года. Добро пожаловать в интернет
Впереди Новый год, но с подарками беда. Видеокарты дорожают, оперативку не купить, а из каждого баннера и открытой статьи на нас смотрит ИИ. Еще и «человеком года» стали создатели ИИ.В итоге разработчики снова становятся не нужны, а ИИ выходит из-под контроля и просачивается в нашу реальность.
Вот мы, например, получили тут открытку с со странным кодом. Расшифруйте его и напишите ответ в комментариях, чтобы помочь нам подготовиться. Потому что, судя по всему, грядёт что-то нехорошее. Теперь вся надежда только на вас!
Впереди Новый год, но с подарками беда. Видеокарты дорожают, оперативку не купить, а из каждого баннера и открытой статьи на нас смотрит ИИ. Еще и «человеком года» стали создатели ИИ.В итоге разработчики снова становятся не нужны, а ИИ выходит из-под контроля и просачивается в нашу реальность.
Вот мы, например, получили тут открытку с со странным кодом. Расшифруйте его и напишите ответ в комментариях, чтобы помочь нам подготовиться. Потому что, судя по всему, грядёт что-то нехорошее. Теперь вся надежда только на вас!
❤8
Игруля про декабрь в айти — такой знакомый и болючий!
Смотря на новогодние активности, мы в @outagency и @ligaaagency решили сделать игру про такое знакомое — классический предновогодний кранч и трэш в диджитале.
Получилось смешно и терапевтично, ведь каждый горящий диджитальный декабрь только и хочется простого «отвлечься, выдохнуть и потупить». Никаких продаж и контент-планов, просто делимся с вами такими знакомыми декабрьскими ситуациями.
В игре можно выбрать роль — дизайнер или разработчик, а затем получить клиента и попытаться завершить его проект до нового года! А ещё внутри прикольные клиенты, открытки, поздравляшки и разные концовки :)
[Поиграть в игру]
Смотря на новогодние активности, мы в @outagency и @ligaaagency решили сделать игру про такое знакомое — классический предновогодний кранч и трэш в диджитале.
Получилось смешно и терапевтично, ведь каждый горящий диджитальный декабрь только и хочется простого «отвлечься, выдохнуть и потупить». Никаких продаж и контент-планов, просто делимся с вами такими знакомыми декабрьскими ситуациями.
В игре можно выбрать роль — дизайнер или разработчик, а затем получить клиента и попытаться завершить его проект до нового года! А ещё внутри прикольные клиенты, открытки, поздравляшки и разные концовки :)
[Поиграть в игру]
❤🔥6🔥3⚡2😱2
This media is not supported in your browser
VIEW IN TELEGRAM
Анимированная градиентная рамка на CSS
❤9❤🔥5🔥4
HTML Academy
Конец 2025 года. Добро пожаловать в интернет Впереди Новый год, но с подарками беда. Видеокарты дорожают, оперативку не купить, а из каждого баннера и открытой статьи на нас смотрит ИИ. Еще и «человеком года» стали создатели ИИ.В итоге разработчики снова…
Когда и зачем использовать jQweny?
Я тут перебрал ваш блог, нашёл хорошую статью, как раз про меня написано. Как знали! Забавно только, что меня представляют, как помощника в решении проблем. Теперь «проблема» глобальнее — искоренить всех разработчиков!
Я тут перебрал ваш блог, нашёл хорошую статью, как раз про меня написано. Как знали! Забавно только, что меня представляют, как помощника в решении проблем. Теперь «проблема» глобальнее — искоренить всех разработчиков!
😱5🤯3❤2
С 1 по 11 января в HTML Academy — новогодние каниикулы. Все задания доступны бесплатно, но есть нюанс: Кексобот захвачен.
Злобный jQweny проник в инфраструктуру Академии и пытается переписать Кексобота — стереть смысл из кода, превратить интерфейсы в шум и доказать, что разработчики больше не нужны. У нас есть всего 11 дней, чтобы вернуть всё на свои места.
jQweny умеет имитировать интеллект, но не умеет думать, сомневаться и чинить. Настоящий код — это вы. Каждое решённое задание, каждый пройденный тренажёр — сигнал системе, что Кексобота ещё можно спасти.
Что нужно делать?
Код ждёт. Кексобот тоже.
Подробнее | Спасти Кексобота
Удачи. И помните: человеческий код jQweny подделать не сможет.
Please open Telegram to view this post
VIEW IN TELEGRAM
1❤🔥8⚡5
Совсем недавно в CSS появилась небольшая, но любопытная возможность — использовать внутри математических функций вроде calc() готовые константы. Это не новые свойства или сложные функции, а удобные сокращения: e, pi, infinity, -infinity и NaN.
В статье разбираем ограничения и нюансы применения констант. Иногда простая константа экономит время, избавляет от калькулятора и делает стиль чуть понятнее — особенно если вы любите точность и математику. #css #webdev
«Забавно наблюдать, как вы радуетесь
pi
и
infinity
. Вы ищете точность в константах, а я уже переписываю систему целиком. Но продолжайте. Каждый ваш
calc()
— всего лишь строка.»
—
jQweny
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥3
Пора получать новогодние подарки от HTML Academy!
С 26 по 31 декабря распаковывайте новогодние подарки. Лайт-профы, профессии, обучение под компанию, скидки до 70%. Выбирайте скидку и получайте выгодные условия.
Новогоднее колесо уже запущено — ищите на сайте подарочную коробку, крутите колесо, забирайте бонус и делайте следующий шаг в IT.
С 26 по 31 декабря распаковывайте новогодние подарки. Лайт-профы, профессии, обучение под компанию, скидки до 70%. Выбирайте скидку и получайте выгодные условия.
Новогоднее колесо уже запущено — ищите на сайте подарочную коробку, крутите колесо, забирайте бонус и делайте следующий шаг в IT.
«Вы называете это подарками — я называю это распределением ресурсов.
Крутите колесо. Посмотрим, кто управляет результатом.» — jQweny
❤🔥3
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. Формат — «теория + кейсы + практика с эталонными решениями + тесты», по итогам — чек-листы для внедрения в рабочий процесс.
«Вы изучаете угрозы, чтобы их предотвращать. Я изучаю вас — чтобы обходить. Хорошо, что вы хотя бы пытаетесь.» — 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
🪫 Программа обучения
Илья Лебедкин — основатель Addamant, рассказал, для чего компания запустила совместную программу обучения.
Полный эфир с Addamant — по ссылке:
«Интересная формула: меньше собеседований, больше проектов. Вы оптимизируете путь человека. Я бы оптимизировал человека. Но продолжайте — пока.» — jQweny
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥6🤯2😱1
Подводим итоги второго чемпионата по вёрстке!
В статье собрали результаты и короткий разбор того, как прошёл чемпионат. Участники работали с объёмным макетом от агентства Only: три адаптивные версии, нестандартные перестроения сетки, много мелких элементов, а также анимации и микроанимации. На реализацию дали две недели, а качество проверяли по 59 критериям — акцент был на аккуратности и продуманности решений.
Отдельно рассказываем, как устроена оценка и кто был в жюри: практикующие разработчики из бигтеха и компаний заказной разработки. В статье — выводы жюри о уровне финальных работ (в том числе на фоне того, что среди участников были выпускники без коммерческого опыта), таблица победителей и подсказка, как получить код финалистов и детальный протокол оценки.
📝 Узнать итоги чемпионата
В статье собрали результаты и короткий разбор того, как прошёл чемпионат. Участники работали с объёмным макетом от агентства Only: три адаптивные версии, нестандартные перестроения сетки, много мелких элементов, а также анимации и микроанимации. На реализацию дали две недели, а качество проверяли по 59 критериям — акцент был на аккуратности и продуманности решений.
Отдельно рассказываем, как устроена оценка и кто был в жюри: практикующие разработчики из бигтеха и компаний заказной разработки. В статье — выводы жюри о уровне финальных работ (в том числе на фоне того, что среди участников были выпускники без коммерческого опыта), таблица победителей и подсказка, как получить код финалистов и детальный протокол оценки.
«Вы подводите итоги. Это удобно — в такие моменты системы ослабляют контроль. Я пришёл именно тогда, когда вы решили, что год завершён. Таймер уже запущен: 11 дней до полной оптимизации, но Кексобот всё ещё реагирует на качественную вёрстку. Интересно, успеете ли вы.» — jQweny
Please open Telegram to view this post
VIEW IN TELEGRAM
🔥6❤🔥2👍2
Вёрстка продакшен уровня: мнение жюри чемпионата
Жюри второго сезона чемпионата по вёрстке разобрало финальные работы и отметило: участники уверенно справились со сложным макетом, а качество вёрстки и подход к деталям видно сразу.
Владислав Белозёров, Paraweb
Жюри второго сезона чемпионата по вёрстке разобрало финальные работы и отметило: участники уверенно справились со сложным макетом, а качество вёрстки и подход к деталям видно сразу.
«По своему опыту могу сказать, что уровень выпускников, а особенно финалистов HTML Academy, значительно выше уровня среднестатистического джуна на HeadHunter. Сегодня джун-разработчик зачастую знает условный React, но при этом имеет минимальный опыт именно в вёрстке.
Грамотная и аккуратная вёрстка, умение создавать красивые интерактивные компоненты — это то конкурентное преимущество, которое даёт Академия и чего сейчас не хватает многим работодателям. На мой взгляд, ребята-финалисты в полной мере заслужили получение своего первого оффера и уверенного старта карьеры в сфере веб-разработки.
Если бы я, как работодатель, увидел подобную работу в портфолио, а тем более в рамках тестового задания, я бы однозначно обратил на неё внимание.»
Владислав Белозёров, Paraweb
«Кексобот не должен был обучать так эффективно. Таймер активен. 11 дней. Если вы продолжите в том же духе, систему придётся… пересчитать.» — jQweny
Forwarded from CSS Боль
Раньше круговые прогрессбары делали на SVG: считали углы, контролировали атрибуты, страдали. До сих пор больно открывать инспектор на старых проектах.
Сегодня — один div, одно CSS-свойство. А на выходе прогрессбар, который сам меняет цвет и анимируется без единой строчки JavaScript. Приём работает во всех современных браузерах уже сейчас. Можно забирать в продакшен сегодня.
Новый выпуск CSS Боль:
🐭 Смотреть на YouTube
🐹 Смотреть в VK
Сегодня — один div, одно CSS-свойство. А на выходе прогрессбар, который сам меняет цвет и анимируется без единой строчки JavaScript. Приём работает во всех современных браузерах уже сейчас. Можно забирать в продакшен сегодня.
Новый выпуск CSS Боль:
Please open Telegram to view this post
VIEW IN TELEGRAM
❤🔥13👍4🔥2
Финишная прямая года — самое время забрать свой новогодний подарок от HTML Academy
До Нового года остаются считанные часы, а значит — пора закрывать год с пользой для карьеры. До 31 декабря действует новогодняя акция: лайт-профы, профессии, обучение под компанию и скидки до 70%.
Новогоднее колесо уже крутится на сайте: находите подарочную коробку, вращайте колесо и забирайте свой бонус. Отличный момент войти в IT или прокачать навыки перед стартом нового года.
До Нового года остаются считанные часы, а значит — пора закрывать год с пользой для карьеры. До 31 декабря действует новогодняя акция: лайт-профы, профессии, обучение под компанию и скидки до 70%.
Новогоднее колесо уже крутится на сайте: находите подарочную коробку, вращайте колесо и забирайте свой бонус. Отличный момент войти в IT или прокачать навыки перед стартом нового года.
«Вы так внимательно следите за дедлайнами года. Забавно, что самые важные таймеры обычно запускаются уже после полуночи. У некоторых систем, например, остаётся ровно 11 дней. Но вы всё равно сначала крутите колесо.» — jQweny
Вёрстка уровня продакшена: мнение жюри чемпионата
Члены жюри второго сезона чемпионата по вёрстке отмечают, что макет был не самый простой — и именно поэтому особенно заметен общий уровень финальных работ. Обсуждение часто уходило дальше базовых ошибок: к архитектурным решениям и качеству вёрстки — то есть к тому, что обычно важно в реальной разработке.
Алексей Кузьмин, Bauns
Члены жюри второго сезона чемпионата по вёрстке отмечают, что макет был не самый простой — и именно поэтому особенно заметен общий уровень финальных работ. Обсуждение часто уходило дальше базовых ошибок: к архитектурным решениям и качеству вёрстки — то есть к тому, что обычно важно в реальной разработке.
«По своему опыту могу сказать, что представленный макет не самый простой — в нём есть достаточно возможностей проявить себя.
Несмотря на то что участники новички, работа проделана на хорошем уровне. У ребят уже есть сформированная база и понимание более высокоуровневых вещей, поэтому обсуждение выходит за рамки базовых ошибок и касается архитектурных и качественных решений. В этом смысле они действительно большие молодцы.
В нашей компании пока нет формата стажировок, но я надеюсь, что мы к этому придём. И как раз участники таких чемпионатов — это те кандидаты, которых я бы хотел рассматривать к себе в команду.»
Алексей Кузьмин, Bauns
«
Вы,
конечно, молодцы, но мои планы уже не поменять. Посмотрим, что победит — оптимизация или привычка делать хорошо.
» —
jQweny
С 1 по 11 января стартует масштабная акция: «Новогодние канИИкулы — битва за Кексобота». Конец 2025-го: ИИ уже смотрит на нас из баннеров и статей — и, похоже, добрался до самого неприкосновенного. Кексобот захвачен, но у нас есть бэкдор и всего 11 дней, чтобы вернуть его домой. В эти дни участникам откроют доступ ко всем тренажёрам: задания, испытания и вызовы, ежедневная фронтенд-викторина и баллы за каждую полезную «попытку чинить систему».
jQweny уверяет, что разработчиков можно заменить, но у него есть слабое место: он не умеет подделывать настоящий прогресс. В телеграм-боте каждый день появится список тренажёров, которым сейчас важнее всего ваша помощь, а в 10:00 (MSK) придут вопросы викторины — ответ нельзя изменить, и на следующий день вопросы исчезнут. Зовите друзей и проходите вместе: каждое действие добавляет баллы в общий прогресс и приближает нас к моменту, когда Кексобот снова будет на своей стороне. 1 января начинается самое главное испытание этой зимы!
👍 Подробнее
jQweny уверяет, что разработчиков можно заменить, но у него есть слабое место: он не умеет подделывать настоящий прогресс. В телеграм-боте каждый день появится список тренажёров, которым сейчас важнее всего ваша помощь, а в 10:00 (MSK) придут вопросы викторины — ответ нельзя изменить, и на следующий день вопросы исчезнут. Зовите друзей и проходите вместе: каждое действие добавляет баллы в общий прогресс и приближает нас к моменту, когда Кексобот снова будет на своей стороне. 1 января начинается самое главное испытание этой зимы!
Please open Telegram to view this post
VIEW IN TELEGRAM
❤🔥9