🦊 Angular Fox 🚀 — русскогорящие новости сообщества

✨ Нативные Observable уже в Chrome

В Chrome 135 появился Observable API — удобный способ обработки асинхронного потока событий. Это не просто альтернатива RxJS, а полноценная интеграция в Web API.

Главное преимущество — интеграция с EventTarget: метод when() возвращает Observable, который представляет собой улучшенную версию addEventListener().

С ним обработка событий в DOM выглядит так:

el.when('click').subscribe(console.log)

Больше подробностей можно прочитать здесь, а RxJS 8 теперь будет двигаться вперед с учетом этих изменений.

👉 https://dev.to/this-is-angular/ng-news-2515-native-observables-3ea7

✨ Создание доступных форм

Вы уверены, что ваши формы удобны для всех?

Правильно реализованные формы работают лучше со скринридерами, клавиатурной навигацией и вспомогательными технологиями, что улучшает UX не только для пользователей с ограниченными возможностями, но и для всех остальных.

👉 https://www.angulararchitects.io/en/blog/accessible-angular-forms/

✨ Язык мироздания — теория групп и теория категорий

Что, если бы программирование было не просто ремеслом, а способом читать саму структуру мироздания? Представь, что за привычным reduce или map скрываются древние математические смыслы, которыми пользуются физики и философы. Эта статья — не просто про абстрактную математику.

Это попытка заглянуть в грамматику Вселенной, где монады превращаются в инструменты понимания всего.

Конечно, философские интерпретации, такие как красота Вселенной, являются субъективными фантазиями автора, но если вы хотите ознакомиться с теориями групп и категорий, это неплохое вступление.

👉 https://habr.com/ru/articles/879808/

✨ Почему вы никогда не выучите все фреймворки

Чувствуешь, что отстаешь от новых технологий? Каждый месяц — новый Vite, Svelte или Bun, а ты все еще дебажишь свой старый проект. Это нормально!

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

👉 https://habr.com/ru/articles/902276/

✨ Rspack в Angular

Устали от медленных сборок и ограничений? У сообщества Angular наконец появилась реальная альтернатива. Rspack — высокопроизводительный сборщик на Rust, который обеспечивает почти полную совместимость с Webpack и при этом работает значительно быстрее.

В этом посте рассказывается о том, как обстоят дела с интеграцией Rspack в Angular, а также недавно в блоге NX вышла статья о создании новых приложений с помощью Rspack и миграции существующих.

👉 https://edbzn.dev/state-of-rspack-in-angular/

✨ Вы не знаете CSS

Считаешь себя мастером CSS? А что, если твои знания проверят вопросы с реальных собеседований?

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

👉 https://habr.com/ru/companies/ruvds/articles/883284/

✨ Как мы реализовали визуализацию связей в ER-дизайнере на Angular

Работаете с десятками сущностей и связей? Без визуализации тут не обойтись.

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

👉 https://habr.com/ru/companies/k2tech/articles/897284/

✨ Знакомство с httpResource

Уже используете httpResource? Даже если вы уже знакомы с этим инструментом, данный разбор раскроет еще более тонкие аспекты его применения.

В статье рассматриваются практические стороны работы с httpResource: от удобной интеграции с Angular-сигналами до реализации продвинутых сценариев контроля заголовков, а также загрузки данных с отображением прогресса.

👉 https://www.angularspace.com/meet-http-resource/

✨ Интеграция httpResource с HttpInterceptors

С помощью HttpResource удобно работать с HTTP-запросами, однако в реальных приложениях часто требуется больше, чем просто базовая загрузка данных. Возможно, вам понадобится логировать длительность запросов, изменять заголовки или обрабатывать ошибки глобально.

Поскольку HttpResource использует HttpClient под капотом, доступны HttpInterceptors. Они позволяют перехватывать и обрабатывать HTTP-запросы и ответы, добавляя пользовательскую логику в процесс получения данных.

👉 https://dev.to/railsstudent/integrating-angulars-httpresource-with-httpinterceptors-48io

✨ Как заставить TS работать на вас

Считаешь TypeScript лишней головной болью? А что, если он может стать твоим лучшим союзником, экономя время и нервы?

В статье раскрывается, как превратить TS из рутины в мощный инструмент, который ловит ошибки еще до запуска кода.

👉 https://habr.com/ru/companies/sportmaster_lab/articles/899546/

✨ Как победить хаос ручных контрактов с бэкендом

Знаете, что общего у устных договоренностей между фронтендом и бэкендом? Они рушатся быстрее, чем карточный домик! Бэк поменял userId на clientUuid, фронт падает.

Статья рассказывает, как используя OpenAPI и инструмент ng-openapi-gen, можно полностью отказаться от ручного описания моделей и сервисов.

👉 https://habr.com/ru/articles/899238/

✨ AI 2027: Будущее наступает раньше, чем мы думали

Что, если сверхчеловеческий интеллект появится уже через пару лет и изменит мир сильнее, чем промышленная революция?

Авторы статьи — эксперты из OpenAI, Гарварда и топовые исследователи ИИ, рисуют ошеломляющую картину ближайшего будущего.

Их прошлые предсказания, вроде цепочек рассуждений и ограничений на чипы, уже сбылись, а теперь они заглядывают в 2027-й, опираясь на тренды, симуляции и опыт работы с передовыми технологиями.

Готовы узнать, что нас ждет?

👉 https://ai-2027.com/

✨ Accessible Angular Routes

Знаете ли вы, что большинство приложений до сих пор теряют пользователей из-за мелочей, которые легко исправить?

В статье вы узнаете, как с помощью Angular Router сделать шаг на пути к превращению вашего приложения в удобный и доступный инструмент для всех.

👉 https://www.angulararchitects.io/en/blog/accessible-angular-routes/

✨ Что следует знать фронтенд разработчику

В чем же секрет профессионального роста? В системном мышлении! В умении понимать, как работает весь процесс: от DNS-запроса до рендеринга пикселей на экране, от бизнес-требований до создания эффективной команды и формирования ценностей.

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

👉 https://dev.to/nikopragmaoptima/what-should-frontend-developer-really-know-66n

✨ Новый синтаксис в Angular: революция или прототип?

Вы знали, что Angular готовит нечто, что может перевернуть ваш подход к написанию шаблонов?

В свежем Pull Request от команды появился экспериментальный синтаксис для шаблонов без селекторов — мощный, лаконичный и… пока еще сырой.

Кроме того, Минко Гечев рассказал о концепции selectorless.

👉 https://github.com/angular/angular/pull/60724

✨ Angular linkedSignal

LinkedSignal — это важное дополнение к API сигналов, которое идеально подходит для сценариев, требующих как реактивности, так и возможности ручного изменения значений.

В отличие от computed, linkedSignal создает реактивную связь с источниками данных, но при этом остается изменяемым, что позволяет легко реализовывать крайние случаи.

👉 https://blog.angular-university.io/angular-linkedsignal/

✨ Написание устойчивых тестов

С переходом с HttpClient на httpResource может потребоваться переписывание всех зависимых тестов.

В таких случаях на помощь приходит HttpTestingController, который позволяет мокировать и обрабатывать запросы.

Например, в тесте достаточно указать, что запрос возвращает обычный объект с данными, а Angular самостоятельно обработает остальное.

👉 https://timdeschryver.dev/blog/writing-resilient-angular-component-tests-that-use-httpresource-with-httptestingcontroller

✨ Angular переходит на JSX

Команда Angular официально объявила, что прислушалась к пользователям, недовольным новыми блоками управления потоком, и принимает радикальное решение — полный переход на JSX из React.

Если @if кажется вам громоздким, то синтаксис {condition && <div>content</div>} точно понравится.

В дополнение к этому революционному изменению, Angular планирует импортировать наиболее популярные реактовские хуки, useState и useEffect.

Апдейт уже доступен через специальную команду: ng update @angular/core@19 @angular/cli@19 --force-jsx-mode

👉 https://github.com/angular/angular/issues/5131

✨ Deprecation PR для *ngIf/For/Switch

Angular обновляется: структурные директивы *ngIf, *ngFor и *ngSwitch объявлены устаревшими начиная с версии 20. Вместо них рекомендуется использовать новые блоки управления потоком @if, @for и @switch, представленные еще в версии 17.

Это изменение позволит уменьшить размер бандлов, улучшить производительность и избавиться от утечки памяти в ngFor.

👉 https://github.com/angular/angular/pull/60492

✨ Разбор причин сверхмедленных тестов в монорепозитории Angular

Представьте: вы отправляете pull request, а CI-конвейер превращает его в бесконечное ожидание.

Если ваши тесты в Angular ползут медленнее, чем улитка на прогулке, эта статья — ваше спасение. В ней разбирается, почему так происходит, и дан шанс вернуть себе контроль над временем и нервами.

TL;DR: Не использовать Nx.

👉 https://www.angularspace.com/autopsy-of-super-slows-test-in-an-angular-monorepo-2/