📌 Дайджест обновлений за ноябрь

🔴 Angular 21

— Новый формовый API на signals.
— Headless-компоненты с фокусом на доступности.
— MCP-сервер для AI-воркфлоу.
— AI Tutor для быстрого онбординга.

🔴 Node.js

25.2.1 (Current)
— Стабильный type stripping: TS теперь работает «из коробки».
— Откатили спорное изменение localStorage — оставили до Node 26.

24.11.1 (LTS)
— Исправлен баг в Buffer.allocUnsafe. Рекомендуется обновление.

🔤 Фреймворки и инструменты:

Git 2.52 — новая команда git last-modified для просмотра последних изменений по файлам.

Astro 5.16 — улучшения DX и интеграций.

VS Code 1.106 — стабильный Terminal IntelliSense, улучшенный diff и навигация.

PlanetScale Postgres — managed PostgreSQL за $5/мес.

🔤 Обновления библиотек:

pnpm 10.23

— pnpm self-update теперь скачивает обновления из вашего npm-регистра.
— Добавлена опция --lockfile-only для pnpm list.
— Установка падает, если optional dependency не проходит trust-политику.
— pnpm list и pnpm why показывают npm-алиасы (npm:).

MikroORM 6.6 — больше контроля над фильтрами и приватными полями.

ESLint v10 Alpha — первые изменения под будущий мажор.

pg-boss 12.4.1

— Перешли на более стабильную сборку через обычный tsc.
— Добавили поддержку AbortSignal для задач.
— Исправили неожиданные изменения аргументов и поправили несколько default-значений.

🤌 Бонусы для подписчиков:
— Скидка 40% на все курсы Академии
— Розыгрыш Apple MacBook
— Бесплатный тест на знание математики

🐸 Библиотека фронтендера

#release_digest

📎 Шпаргалка по React Hooks

Хуки сделали React-компоненты проще и мощнее. Эта шпаргалка — ваш быстрый справочник по всем основным хукам с примерами кода.

Что внутри:

Разбор каждого хука по принципу «что делает → как работает → когда использовать».

➕ Подходит и новичкам для изучения, и опытным разработчикам как quick reference в работе.

🎥 Источник

🤌 Бонусы для подписчиков:
— Скидка 40% на все курсы Академии
— Розыгрыш Apple MacBook
— Бесплатный тест на знание математики

🐸 Библиотека фронтендера

#readme #react

📱 Apple случайно раскрыла код веб-версии App Store

В начале ноября Apple запустила обновлённый веб-интерфейс App Store на фреймворке Svelte, но случайно оставила в продакшене активные source maps. Это позволило разработчику извлечь полную структуру фронтенда прямо из браузера.

Код включал UI-компоненты на Svelte/TypeScript, логику управления состояниями, интеграции с API и конфигурацию роутинга. Разработчик выложил всё на GitHub «в образовательных целях».

8 ноября репозиторий и его форки были удалены по запросу Apple через DMCA. Однако код по-прежнему доступен через зеркало в архиве Software Heritage 🔗

🙃 Отключение source maps в продакшене считается базовым шагом в современной веб-разработке, поэтому такая ошибка от Apple выглядит особенно необычно.

🤌 Бонусы для подписчиков:
— Скидка 40% на все курсы Академии
— Розыгрыш Apple MacBook
— Бесплатный тест на знание математики

🐸 Библиотека фронтендера

#read_watch

Быть незаметным — особый скилл 👀

🐸 Библиотека фронтендера

#pixel_pause

🔥 Telegram-анимация для скрытого текста

SpoilerJS — веб-компонент для создания эффекта спойлера с анимацией частиц, вдохновлённый Telegram.

— Работает с любым фреймворком
— Открытый исходный код (MIT License)
— Простая интеграция

Правда, анимация не такая плавная, как в оригинале Telegram, но для веба — вполне достойная реализация.

🔗 Ссылка на репозиторий

🔹 Курс «Алгоритмы и структуры данных»
🔹 Получить консультацию менеджера
🔹 Сайт Академии 🔹 Сайт Proglib

🐸 Библиотека фронтендера

#readme #js

Каким будет результат ❓

Опрос ниже 🔜

🐸 Библиотека фронтендера

#code_challenge

📌 Шпаргалка React Router v7

React Router v7 объединил v6 и Remix в одну библиотеку. Два режима на выбор: легковесный Library Mode для SPA или полноценный Framework Mode с SSR.

Требования: Node.js 20+ и React 18+

➕ Шпаргалка включает установку, роутинг, навигацию, работу с данными, формы и обработку ошибок с примерами кода.

🐸 Библиотека фронтендера

#readme #react

⚛️ React: избавляемся от вложенных условий в JSX

Глубокие тернарные операторы быстро превращают JSX в нечитаемый код. Более понятный подход — ранние возвраты и предсказуемая структура рендера.

⚠️ Важное правило Hooks

Все хуки должны вызываться на верхнем уровне компонента — до любых return и условных конструкций.

React требует, чтобы хуки выполнялись в одном и том же порядке при каждом рендере. Если порядок или количество хуков изменится, возникнет ошибка.

// Ошибка: хук после return
function Component({ data }) {
  if (!data) return null;
  const [value] = useState(data); // Хук вызван условно!
}

// Правильно: хуки перед return
function Component({ data }) {
  const [value] = useState(data);
  if (!data) return null;
}

Ранние возвраты полностью безопасны, если хуки вызываются до любых условий.

✅ Альтернатива: объектный маппинг

Подходит для компонентов с большим количеством состояний:

const STATE_COMPONENTS = {
  loading: Spinner,
  error: Error,
  success: Content,
  empty: Empty
};

function DataView({ status, ...props }) {
  const Component = STATE_COMPONENTS[status];
  return Component ? <Component {...props} /> : null;
}

Важно: храните компоненты, а не JSX-элементы, чтобы свободно передавать пропсы.

➡️ Когда что использовать:

⚪️ Early Returns — оптимальны в большинстве случаев (loading / error / success).

⚪️ Объектный маппинг — подходит, когда состояний много и они определяются строковым статусом: этапы процессов, статусы заказов, типы уведомлений, шаги визардов.

💡 Начинайте с early returns — это самый простой и понятный вариант. Переходите на маппинг только тогда, когда это действительно упрощает код.

🐸 Библиотека фронтендера

#hotfix #react