🧠 Готовишься к собесам, а ноутбук еле тянет IDE?
Самое время прокачать скиллы и апгрейднуть железо!
Proglib Academy разыгрывает MacBook Pro 14 (M3 Pro, 36 GB, 1 TB SSD) 💻
Купи любой наш курс до 15 ноября → пройди 2 недели обучения → напиши куратору #розыгрыш. Всё, ты в игре!
📚 Среди курсов:
▫️ Алгоритмы и структуры данных — топ для подготовки к собесам в Яндекс и FAANG.
▫️ Архитектуры и шаблоны проектирования — чтобы думать как senior.
▫️ Python, математика для DS, основы IT и другие направления.
👉 Принять участие
Самое время прокачать скиллы и апгрейднуть железо!
Proglib Academy разыгрывает MacBook Pro 14 (M3 Pro, 36 GB, 1 TB SSD) 💻
Купи любой наш курс до 15 ноября → пройди 2 недели обучения → напиши куратору #розыгрыш. Всё, ты в игре!
📚 Среди курсов:
▫️ Алгоритмы и структуры данных — топ для подготовки к собесам в Яндекс и FAANG.
▫️ Архитектуры и шаблоны проектирования — чтобы думать как senior.
▫️ Python, математика для DS, основы IT и другие направления.
👉 Принять участие
🥰4🥱4❤1
  Please open Telegram to view this post
    VIEW IN TELEGRAM
  🥰7😁4👏1😢1
  Когда метод объекта передаётся как колбэк, он теряет контекст (см. фото). После клика в консоли будет undefined.
this зависит от способа вызова функции, а не от места, где она объявлена.
При передаче метода как ссылки (btn.handleClick) контекст теряется — this больше не указывает на объект.
1. Явно привязать контекст
button.addEventListener('click', btn.handleClick.bind(btn));
2. Использовать стрелочную функцию
button.addEventListener('click', () => btn.handleClick());
#hotfix #js
Please open Telegram to view this post
    VIEW IN TELEGRAM
  🥰4❤1👍1
  Иногда переменная с нужным именем вроде бы существует — но скрипт выбрасывает ReferenceError.
#under_hood #js
Please open Telegram to view this post
    VIEW IN TELEGRAM
  Please open Telegram to view this post
    VIEW IN TELEGRAM
  🥰5
  Эксперимент разработчика, который переписал фронт для Telegram-ботов на Rust и разобрался, где язык реально выигрывает у JS.
Medium-разбор, почему XSS, CSP и supply-chain атаки всё ещё ломают SPA, и как встроить безопасность в CI/CD.
Автор показывает реальные кейсы, обходные пути и поднимает важный вопрос: имеет ли фреймворк право на полный контроль над DOM?
#read_watch #react #js #ts
Please open Telegram to view this post
    VIEW IN TELEGRAM
  🥰5🔥1
  This media is not supported in your browser
    VIEW IN TELEGRAM
  🏓 Table tenniCSS
Мини-анимация, созданная только с помощью HTML и SCSS, без единой строки JS.
Отличный пример того, насколько мощными могут быть CSS-анимации.
 
🔗  Попробуйте запустить демо на CodePen
🐸  Библиотека фронтендера
#readme #css
Мини-анимация, созданная только с помощью HTML и SCSS, без единой строки JS.
Отличный пример того, насколько мощными могут быть CSS-анимации.
#readme #css
Please open Telegram to view this post
    VIEW IN TELEGRAM
  🔥7🥰3
  🎁 Конкурс от Proglib Academy!
Кстати, если кто-то ещё не в курсе — у нас тут раздают MacBook Pro 14.
Да-да, не шутка, настоящий, железный, с M3 Pro
Но! Чтобы успеть пройти 2 недели обучения к 15 ноября, курс нужно взять до конца октября — и сейчас на всё скидка 40%.
Чтобы поучаствовать, нужно:
1️⃣ Покупаешь любой курс до конца октября;
2️⃣ Проходишь 2 недели обучения к 15 ноября;
3️⃣ Написать куратору в чат #розыгрыш.
До 15 ноября, потом всё — поезд (и макбук) уйдёт.
👉 Участвовать в розыгрыше
Кстати, если кто-то ещё не в курсе — у нас тут раздают MacBook Pro 14.
Да-да, не шутка, настоящий, железный, с M3 Pro
Но! Чтобы успеть пройти 2 недели обучения к 15 ноября, курс нужно взять до конца октября — и сейчас на всё скидка 40%.
Чтобы поучаствовать, нужно:
1️⃣ Покупаешь любой курс до конца октября;
2️⃣ Проходишь 2 недели обучения к 15 ноября;
3️⃣ Написать куратору в чат #розыгрыш.
До 15 ноября, потом всё — поезд (и макбук) уйдёт.
👉 Участвовать в розыгрыше
🥰4
  В React кастомные хуки (useAuth, useCart, useFetch) — это не просто удобство, а полноценный слой бизнес-логики.
📖 По документации React:
“Custom Hooks let you extract component logic into reusable functions.”
“By convention, a custom Hook’s name starts with ‘use’.”
— изолированная логика вне UI;
— переиспользуемые мини-сервисы;
— лаконичные компоненты.
Пример:
function useAuth() {
const [user, setUser] = useState(null);
const login = async (creds) => { /* запрос к API */ };
const logout = () => setUser(null);
return { user, login, logout };
}
#blueprint
Please open Telegram to view this post
    VIEW IN TELEGRAM
  🥰4🔥2❤1
  У каждого фронтендера в проекте есть свой «скелет в шкафу». Это тот самый компонент . Он начинался как безобидный ProductCard.tsx, а теперь в нём 1500 строк, он сам ходит в API, знает структуру ответа бэкенда до пятого уровня вложенности, дёргает localStorage, форматирует цены и отправляет аналитику.
Знакомая боль? Этот компонент — «серый кардинал» приложения. Он знает слишком много и делает всё сразу.
Стоит бэкенду поменять название поля product.price на product.cost — всё падает. Решили сменить fetch на axios? Компонент снова ломается. Это хрупкая архитектура, которая рассыпается от любого чиха.
Вся эта проблема идеально описывается классическими принципами Cohesion и Coupling. Вот только в классическом переводе начинается ад: «высокая связность» (Cohesion) и «низкая связанность» (Coupling).
Серьёзно, попробуйте в пятницу вечером на код-ревью быстро объяснить коллеге, какая из «связанностей» у него не та. Это же задачка для логопеда, а не для инженеров .
Тема Сенюков из Кинопоиска в своём недавнем посте предложил гениально простой выход из этого лингвистического тупика. Он предлагает использовать термины:
Cohesion → Связность
Coupling → Сцепленность
Сразу всё встаёт на свои места.
1. Высокая Связность (Cohesion). Это когда модуль делает одну понятную вещь. Он сфокусирован. (Наш 1500-строчный монстр, который делает всё, имеет низкую связность).
2. Низкая Сцепленность (Coupling). Это когда модуль почти ничего не знает о внешнем мире. Он не прибит гвоздями к fetch, localStorage или конкретной структуре API. Он получает всё необходимое снаружи (через props или context). (Наш монстр, наоборот, намертво сцеплен со всем).
Идея в том, чтобы вместо «серых кардиналов» собирать код как конструктор LEGO . Когда каждый компонент получает зависимости снаружи, его легко тестировать, мокать и переиспользовать.
  
  Знакомая боль? Этот компонент — «серый кардинал» приложения. Он знает слишком много и делает всё сразу.
Стоит бэкенду поменять название поля product.price на product.cost — всё падает. Решили сменить fetch на axios? Компонент снова ломается. Это хрупкая архитектура, которая рассыпается от любого чиха.
Вся эта проблема идеально описывается классическими принципами Cohesion и Coupling. Вот только в классическом переводе начинается ад: «высокая связность» (Cohesion) и «низкая связанность» (Coupling).
Серьёзно, попробуйте в пятницу вечером на код-ревью быстро объяснить коллеге, какая из «связанностей» у него не та. Это же задачка для логопеда, а не для инженеров .
Тема Сенюков из Кинопоиска в своём недавнем посте предложил гениально простой выход из этого лингвистического тупика. Он предлагает использовать термины:
Cohesion → Связность
Coupling → Сцепленность
Сразу всё встаёт на свои места.
1. Высокая Связность (Cohesion). Это когда модуль делает одну понятную вещь. Он сфокусирован. (Наш 1500-строчный монстр, который делает всё, имеет низкую связность).
2. Низкая Сцепленность (Coupling). Это когда модуль почти ничего не знает о внешнем мире. Он не прибит гвоздями к fetch, localStorage или конкретной структуре API. Он получает всё необходимое снаружи (через props или context). (Наш монстр, наоборот, намертво сцеплен со всем).
Идея в том, чтобы вместо «серых кардиналов» собирать код как конструктор LEGO . Когда каждый компонент получает зависимости снаружи, его легко тестировать, мокать и переиспользовать.
Telegram
  
  ТОП - Тёма о программировани
  Cohesion и Coupling 🧩🔗
Здарова, работяги!
Если очень коротко: хорошая архитектура — это высокая связность внутри модулей (cohesion) и низкая связанность между ними (coupling). Эти два термина отлично объясняют, почему код либо живёт годами, либо рассыпается…
Здарова, работяги!
Если очень коротко: хорошая архитектура — это высокая связность внутри модулей (cohesion) и низкая связанность между ними (coupling). Эти два термина отлично объясняют, почему код либо живёт годами, либо рассыпается…
❤7🔥3🥰2
  Ваша история в IT начинается в Авито 🚀 
Хотите расти в разработке — приходите на оплачиваемую стажировку в Авито. Мы ищем будущих специалистов в направлениях Frontend, Backend, QA и Android. Вы будете работать над продуктами, которыми ежедневно пользуются миллионы людей, и прокачивать навыки с помощью:
➡️  наставника — подскажет, как мыслить в процессе решения задач;
➡️  комьюнити стажёров — всегда рядом, чтобы обсудить задачи и поддержать;
➡️  корпоративных курсов, библиотек и баз знаний — всё, чтобы развиваться быстрее.
Выберите два направления — основное и запасное. Если не получится попасть в первое, сможете пройти отбор на второе при наличии мест.
Условия:
➡️  зарплата и корпоративный ноутбук,
➡️  формат — офис, удалёнка или гибрид,
➡️  от 25 часов в неделю,
➡️  продолжительность — 9 месяцев,
➡️  компенсация питания, консультации с психологами и юристами,
➡️  после стажировки — возможность остаться в команде, если покажите крутой результат.
📌  Регистрация открыта до 12 ноября. Подать заявку можно по ссылке.
Хотите расти в разработке — приходите на оплачиваемую стажировку в Авито. Мы ищем будущих специалистов в направлениях Frontend, Backend, QA и Android. Вы будете работать над продуктами, которыми ежедневно пользуются миллионы людей, и прокачивать навыки с помощью:
Выберите два направления — основное и запасное. Если не получится попасть в первое, сможете пройти отбор на второе при наличии мест.
Условия:
Please open Telegram to view this post
    VIEW IN TELEGRAM
  ❤4
  7 ways to hide element using CSS.png
    2 MB
  🎨 7 способов скрыть элемент с помощью CSS
Не все display: none одинаково полезны — иногда элемент нужно спрятать визуально, но оставить доступным для screen reader’ов.
🔤  Шпаргалка показывает, чем отличаются display, visibility, opacity, transform, clip-path и другие способы — и когда какой применять.
🐸  Библиотека фронтендера
#readme #css
Не все display: none одинаково полезны — иногда элемент нужно спрятать визуально, но оставить доступным для screen reader’ов.
#readme #css
Please open Telegram to view this post
    VIEW IN TELEGRAM
  🥰5👍2
  Когда баг появился «внезапно», но непонятно когда —
git bisect превращает охоту за ошибкой в алгоритм.
git bisect start
git bisect bad HEAD
git bisect good v1.4.2
git bisect good
git bisect bad
git bisect run ./run-tests.sh
Так Git сам переберёт историю и найдёт момент, где всё сломалось.
#readme #git
Please open Telegram to view this post
    VIEW IN TELEGRAM
  👍5🥰4
  Новый open-source инструмент от команды Angular — Web Codegen Scorer — оценивает качество AI-сгенерированного фронтенд-кода.
Он анализирует:
AI-генерация кода растёт, но качество всё ещё «пляшет». Scorer помогает разработчикам и командам понять, насколько надёжны автогенерированные фрагменты перед ревью или деплоем.
#stack #angular
Please open Telegram to view this post
    VIEW IN TELEGRAM
  🤔6🔥2🥰2
  Please open Telegram to view this post
    VIEW IN TELEGRAM
  😁11👏1
  Кажется, простой счётчик — но React со своим batching (см. на картинке).
Ждём
React группирует (batch) обновления состояния внутри одного события. Обе строки читают старое значение count из замыкания, поэтому результат — 1.
Если новое состояние зависит от предыдущего — используйте функциональное обновление
setCount(prev => prev + 1);
setCount(prev => prev + 1);
Теперь результат будет 2.
React работает по снимкам состояния, а не по «живым» переменным — и именно это часто сбивает с толку.
#hotfix #react
Please open Telegram to view this post
    VIEW IN TELEGRAM
  🥰6👍1
  🎃 Хэллоуин в Proglib Academy: скидки, призы и... немного паники
Сегодня 31 октября, и это не просто время тыкв и призраков, это ПОСЛЕДНИЙ ДЕНЬ, когда ты можешь выиграть макбук!
→ Купи любой курс со скидкой 40% 💸
→ Начни обучение, чтобы пройти 2 недели к 15 ноября 🎓
→ Напиши куратору #розыгрыш ✍️
Всё! Теперь ты в игре.
👉 Сейчас или никогда!
Сегодня 31 октября, и это не просто время тыкв и призраков, это ПОСЛЕДНИЙ ДЕНЬ, когда ты можешь выиграть макбук!
→ Купи любой курс со скидкой 40% 💸
→ Начни обучение, чтобы пройти 2 недели к 15 ноября 🎓
→ Напиши куратору #розыгрыш ✍️
Всё! Теперь ты в игре.
👉 Сейчас или никогда!
👍3
  TikTok — это не просто платформа для видео, а настоящий мастер-класс по удержанию внимания.
#ux_review
Please open Telegram to view this post
    VIEW IN TELEGRAM
  Please open Telegram to view this post
    VIEW IN TELEGRAM
  🔥4👏1
  