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

✨ Представляем Angular 19 За последние два года команда Angular удвоила усилия по улучшению опыта разработчиков и производительности. Сегодняшний релиз приносит множество улучшений, которые сделают разработку еще проще. Основные моменты: Инкрементальная гидратация — поддерживает самые требовательные к производительности сценарии. Стабилизация ключевых реактивных примитивов и добавление новых: linkedSignal и resource. Возможность управлять тем, какие маршруты рендерятся на клиенте, сервере или во время сборки. Схематики, которые помогут вам быть в курсе лучших практик: inputs, outputs, queries, внедрение зависимостей на основе inject и новая система сборки. 🎉 Также поздравляем Кира с присоединением к команде Angular Core! 👉 https://blog.angular.dev/meet-angular-v19-7b29dfd05b84

Привет! Мы знаем, что вы до сих пор спите и видите сны на TypeScript! 🌟 Мы прекрасно знаем, как вы любите Angular. Сейчас ещё есть возможность зарегистрироваться на Angular Meetup #23. Мы будем обсуждать текущее состояние Angular и что нас ждет. Узнаем, сколько версий фреймворка нужно пропустить, чтобы считать свой проект устаревшим. 👩‍💻 В конце нас ждет афтепати в лучших традициях: настолки, задачи на написание кода и неформальный нетворкинг с единомышленниками. ✅ Если ты с нами 1️⃣ Регистрируйся здесь 2️⃣ Добавляй напоминание в календарь 3️⃣ Поделись этим сообщением с друзьями - чем больше нас будет, тем веселее! Если не получится прийти на митап, можно посмотреть трансляцию онлайн.

✨ Релиз Angular 19: Присоединяйтесь к просмотру Релиз Angular 19 уже на подходе, и разработчики по всему миру готовятся к празднованию. Мероприятия стартуют 19 ноября. Если вы увлечены Angular, то это отличная возможность узнать о его новых возможностях, пообщаться с другими разработчиками и поделиться своим мнением. Не пропустите! 👉 https://blog.angular.dev/angular-v19-release-join-the-watch-parties-45f552d49554

✨ Создание кастомного rxResource Angular приближается к выпуску 19-й версии, однако многие проекты все еще работают на старых версиях. Поскольку в этих версиях широко используются Observables, автор решил создать аналог rxResource, основанный на RxJS, вместо сигналов. 👉 https://www.angularspace.com/creating-custom-rxresource-api-with-observables/

✨ Магия с interceptors Interceptors — это функции, о которых многие слышали, но редко используют за пределами аутентификации. Однако существует множество случаев, когда перехватчики могут быть полезны. В статье рассмотрены интересные и достаточно распространенные сценарии, в которых они могут пригодиться. 👉 https://www.angularspace.com/magic-with-interceptors/

✨ Новый экспериментальный API Несмотря на то, что Resource и rxResource все еще находятся на стадии предварительного просмотра, они обещают существенно изменить подход к работе с данными. В статье подробно рассматриваются их возможности и предлагаемые методы улучшения рабочего процесса. 👉 https://dev.to/this-is-angular/angular-19-streamlining-data-retrieval-with-resource-and-rxresource-apis-3lb2

✨ 5 функций, которых стоит ожидать Angular 19 пока официально не выпущен, однако уже доступны многие детали о предстоящем релизе. В статье выделены пять ключевых нововведений, которые облегчат процесс разработки и позволят создавать более быстрые приложения. 👉 https://dev.to/this-is-angular/angular-19-5-game-changing-features-you-need-to-know-32cd

✨ Вспомогательные маршруты Вспомогательные маршруты, также известные как вторичные маршруты, позволяют добавить несколько независимых маршрутов, улучшая навигационные и интерактивные возможности. Обычно они используются для таких компонентов, как боковые панели, модальные окна или любые дополнительные части интерфейса. 👉 https://dev.to/this-is-angular/auxiliary-routes-in-angular-3gkk

✨ Зачем нам Node.js или Angular на бэкенде Когда говорят об применении Angular на сервере, часто подразумевают серверный рендеринг (SSR). Но эта статья фокусируется на вопросах переиспользования кода. Александр Лобанов поделился, как их команда, используя Node.js и Angular, сократила дублирование кода, ускорила разработку и добилась согласованности между клиентом и сервером. 👉 https://habr.com/ru/companies/eftech/articles/856840/

✨ Получение данных с помощью resource и rxResource Ранее мы упоминали, что команда Angular выпустила экспериментальные функции resource и rxResource для упрощения работы с данными. Эти функции доступны в двух вариантах: loader для resource возвращает Promise, а для rxResource — Observable. В статье автор модернизировал свой старый проект для получения данных о покемонах, переписав его на Angular 19.0.0-next.11 и применив новые функции. 👉 https://dev.to/railsstudent/data-retrieval-with-the-experimental-resource-and-rxresource-functions-in-angular-19-fa9

✨ Знакомьтесь: input, output и model Наверняка многие уже успели познакомиться с новыми функциями input(), output() и model(), которые пришли на смену @Input и @Output. Но если вы откладывали это до последнего момента. Статья Егора Молчанова поможет вам разобраться в них, а также понять особенности computed и effect. 👉 https://habr.com/ru/companies/domclick/articles/854530/

✨ Сброс или установка значения в LinkedSignal LinkedSignal создаёт WritableSignal, что позволяет явно задавать значение или обновлять его при изменении источника. В этой статье представлено четыре примера, демонстрирующие возможности LinkedSignal. 👉 https://dev.to/railsstudent/reset-or-set-the-value-in-linkedsignal-in-angular-19-587h

✨ Оптимизация реактивных форм Если вы работаете с крупными или динамическими формами, по мере усложнения их производительность может ухудшаться. Здесь на помощь приходят стратегии оптимизации производительности, такие как ленивые и асинхронные валидаторы. 👉 https://dev.to/this-is-angular/optimizing-angular-reactive-forms-enhancing-performance-with-lazy-validation-and-async-validators-5c40

✨ linkedSignal: управлять связанным состоянием теперь ещё проще Недавно представили еще один реактивный примитив linkedSignal. Он позволяет связывать сигналы, чтобы автоматически синхронизировались их значения на основе зависимостей. 👉 https://habr.com/ru/articles/854842/

✨ Все, что вам нужно знать об Resource API Если присмотреться к новому API, можно заметить, что функция resource() по умолчанию использует промисы. Однако Angular всегда был ориентирован на использование Observables. Чтобы это исправить, можно воспользоваться функцией rxResource(). 👉 https://push-based.io/article/everything-you-need-to-know-about-the-resource-api

✨ Новый Resource API Недавно был опубликовал Pull Request для нового Resource API, которое позволяет асинхронно загружать ресурсы с использованием сигналов. Типичный сценарий её использования — загрузка данных через HTTP. В этой статье показывается, как реализовать типичный CRUD сценарий с использованием нового API. 👉 https://www.angulararchitects.io/en/blog/asynchronous-resources-with-angulars-new-resource-api/

✨ Лучшие практики для директив Директивы — это мощный и универсальный инструмент, который, как и любой другой инструмент, может быть неправильно использован. Однако, следуя рекомендациям, представленным в этой статье, вы сможете создавать более простые и понятные директивы, раскрыв их полный потенциал. 👉 https://www.angularspace.com/directive-best-practices/

✨ Введение в Vitest и Angular Теперь, когда в новых версиях Angular используется Vite, мы можем применять Vitest в наших Angular-проектах. Процесс установки прост, а синтаксис легко освоить. В этой статье рассказывается, как настроить Vitest в приложении на Angular 18 для замены Karma, а также добавить покрытие кода, чтобы отслеживать, какой процент приложения охватывается юнит-тестами. 👉 https://www.angularspace.com/introduction-to-vitest-and-angular/

✨ Мощь CSS-масок Наконец, CSS-свойство mask получило полную поддержку во всех современных браузерах без необходимости вендорных префиксов. Это значит, что осталось лишь привыкнуть к его использованию и не бояться применять. Барсуков Никита напомнил теорию и поделился практическими примерами на основе опыта работы с Taiga UI. 👉 https://habr.com/ru/companies/tbank/articles/853042/

✨ ИИ в современных Angular-проектах Пересечение ИИ и фронтенд-разработки меняет подход к созданию, тестированию и управлению приложениями. Интеграция нейросетей в наши проекты, например, с помощью Cursor IDE, позволяет значительно упростить многие процессы, такие как автоматизация утилитарных функций, создание юнит-тестов и рефакторинг. Он также может следить за соблюдением архитектурных правил и выполнять другие задачи. 👉 https://www.angularspace.com/ai-in-modern-angular-workspaces-the-future-is-now/