🦊 Angular Fox 🚀 — русскогорящие новости сообщества – Telegram
🦊 Angular Fox 🚀 — русскогорящие новости сообщества
4.06K subscribers
1.32K photos
7 videos
1.18K links
Как костыль на реактивно-лисьей тяге 🔥🦊

Нравится канал? Подпишись на меня!
👉 twitter.com/thekiba_ru
💖 twitter.com/thekiba_io
medium.com/@thekiba
github.com/thekiba

Чаты @angular_ru @angular_jobs
Download Telegram
Как решать LeetCode? Легко! Нужно просто…

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

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

👉 https://habr.com/ru/articles/964104/
👍4🤮4🔥21
Релиз Angular v21

Команда Angular представила мажорное обновление, которое фокусируется на улучшении Developer Experience, развитии реактивной модели на базе сигналов и подготовке экосистемы к работе с AI-агентами.

Ключевые нововведения:

Экспериментальные Signal Forms — новый способ для работы с формами. Состояние полей синхронизируется через сигналы, без лишних бойлерплейтов.

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

Zoneless по умолчанию в новых проектах zone.js больше не подключается автоматически.

Vitest официально стал тест-раннером по умолчанию для новых проектов.

MCP Server в CLI с инструментами для AI-агентов.

Плюс мелкие, но приятные фичи: регулярки в шаблонах, дополнительные параметры для @defer, обновление CLDR и многое другое.

Также напоминаем, что Developer Event начинается через несколько часов на YouTube.

👉 https://blog.angular.dev/announcing-angular-v21-57946c34f14b
🔥299🤝1
URL как контейнер состояния

URL — это не просто адрес ресурса, а один из самых древних и изящных инструментов для управления состоянием в веб-приложениях.

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

👉 https://habr.com/ru/articles/962828/
👍8🔥42
Angular 21 – что нового?

Обзорный пост с главными фичами мы уже публиковали, теперь переходим к практике. Как именно новый релиз меняет ваш повседневный опыт взаимодействия с фреймворком? В статье детальный разбор того, как новые фичи выглядят в коде.

P.S. Если вы еще не посмотрели Developer Event, очень рекомендуем глянуть запись. Там не только презентация новинок, но и знакомое лицо из русскоговорящего сообщества (возможно, вы его узнаете 😉).

👉 https://angular.love/angular-21-whats-new
🔥102
Цветовая модель OKLCH

OKLCH — современная цветовая модель, которая решает главную проблему RGB и HSL: визуальную неоднородность. Теперь цвета с одинаковой яркостью действительно выглядят одинаково, а оттенки не плывут при изменении параметров.

В основе три параметра: яркость (Lightness, 0–100%), насыщенность (Chroma, варьируется от серого до наиболее интенсивного оттенка) и оттенок (Hue, 0–360).

На практике это означает: можно создать, например, набор кнопок разных цветов, меняя только Hue и все они будут восприниматься визуально согласованно.

👉 https://habr.com/ru/articles/940800/
👍861
Как собрать экосистему компонентов на Angular и Nx

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

Ильи Чубко показал, как построить единую экосистему компонентов, от организации структуры до настройки CI/CD с использованием nx affected. Отдельное внимание уделено Dependency Injection: показано, как через DI адаптировать приложение под разные среды выполнения.

👉 https://habr.com/ru/companies/k2tech/articles/960600/
👍8🔥42👎1
Когда порядок решает, или почему я больше не доверяю сеттерам в Angular

Используете сеттеры с @Input()? Будьте осторожны, с приходом Ivy порядок атрибутов в шаблоне стал критичным. Теперь простая перестановка может сломать инициализацию компонента, даже если код написан идеально.

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

👉 https://habr.com/ru/companies/zyfra/articles/970150/
👍12🥴102👏1🤔1🌭1
🚨 Утечка XSRF-токена в Angular HttpClient

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

Утечка токена полностью обходит встроенную защиту Angular от CSRF, позволяя злоумышленнику перехватить действительный XSRF-токен пользователя. Получив этот токен, атакующий может выполнять произвольные CSRF-атаки от имени сессии жертвы.

P.S. Спасибо Angular Munich за информацию.

👉 https://github.com/angular/angular/security/advisories/GHSA-58c5-g7wp-6w37
🔥10🤝1
Шесть способов учиться новому максимально быстро и эффективно

Обучение — процесс, который можно дебажить и оптимизировать. В статье разбираем ключевые идеи из бестселлера Барбары Оакли Learning How to Learn.

Главный тезис книги: способность быстро осваивать новые стеки, языки и технологии — это не врожденный талант, а прокачиваемый скилл.

👉 https://habr.com/ru/companies/avito/articles/953972/
👍95😁1
TypeScript vs Elixir

Дэн Вандеркам (автор книги Effective TypeScript) прошел Advent of Code 2024 на Elixir и сравнил опыт разработки с привычным TS. Проделав не просто сравнение синтаксиса, а глубокий анализ того, как разные подходы к типизации и DX влияют на написание кода.

Ключевые тезисы из статьи:

Оператор |> в Elixir киллер-фича, но автор пришел к выводу, что в JavaScript без сопутствующего сахара он был бы не так удобен.

TypeScript приучил нас к тому, что поддержка IDE так же важна, как и сам компилятор. В Elixir с этим сложнее.

В Elixir внедряют систему опциональной постепенной типизации. Разработчикам на TypeScript это должно быть знакомо: TS в свое время провернул похожий трюк с JavaScript.

P.S. Advent of Code 2025 стартует уже сегодня. Планируете участвовать в этом году или, может быть, уже решали задачки прошлых лет? Делитесь в комментариях, какой язык выбрали и какие впечатления остались.

👉 https://effectivetypenoscript.com/2025/11/24/advent2024-elixir/
3🤔2👍1👎1
Документация Angular теперь на русском

Хорошая новость для тех, кто только начинает погружаться в Angular и предпочитает читать доки на русском языке. Участник сообщества Ефанов Михаил сделал перевод документации.

Что интересного:
Полностью переведены обучающие материалы.
Можно пройти туториал и экспериментировать с кодом в песочнице прямо в браузере.

Важный нюанс:
Раздел "Справочник - API" остался без перевода. Это осознанное решение автора: информация там генерируется автоматически из комментариев в коде, и это затрудняет поддержку новых версий в будущем.

🐞 Если найдете ошибки или опечатки, можете сообщить о них в репозитории проекта.

👉 https://angular-docs.ru/
🔥51👍14😁5🤷‍♂43
🚨 Уязвимость Stored XSS

В Angular Template Compiler обнаружена Stored XSS уязвимость. Проблема кроется в неполной внутренней схеме безопасности, которая позволяет злоумышленникам обходить встроенную санитизацию при работе с определенными атрибутами (например, те, которые могут содержать javanoscript: URLs).

Кроме того, существует связанная уязвимость, затрагивающая элементы SVG-анимации. Атрибут attributeName у этих элементов не проходил должной валидации.

Как защититься:
Обновить версию Angular.
Убедитесь, что в уязвимые атрибуты не попадают сырые данные из недоверенных источников.
Настройте Content Security Policy (CSP).

👉 https://github.com/angular/angular/security/advisories/GHSA-v4hv-rgfq-gp49
🔥6😱2
🍿 Проверьте свои Angular проекты, что нигде не используется Next.js и React Server Components: Critical 10/10

https://github.com/vercel/next.js/security/advisories/GHSA-9qr9-h5gf-34mp
Please open Telegram to view this post
VIEW IN TELEGRAM
🤣37🌚6👻3👍2🤓2🤪2👨‍💻1
90% Angular-разработчиков пишут легаси

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

В статье рассматриваются моменты, на которые стоит обратить внимание для улучшения кодовой базы. Среди ключевых тем: корректное управление подписками, отказ от чрезмерного использования any, преимущества OnPush и внедрение новых @for и @if.

P.S. Метрика в 90% в заголовке статьи выглядит сомнительно и не подкреплена данными. Вероятно, это просто художественное преувеличение автора, и в реальности ситуация не такая драматичная.

👉 https://habr.com/ru/companies/ruvds/articles/967016/
👍9😐6👎4
Прогресс в разработке TypeScript 7

Команда TypeScript поделилась апдейтом по Project Corsa — портированию языкового сервиса и компилятора на Go.

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

Компилятор также продемонстрировал значительный прогресс: он находит те же ошибки, что и TypeScript 5.9. Полная совместимость типизации подтверждена на 20 000 тестовых кейсов.

Также в него портировали такие флаги, как --incremental и --build. Это означает, что большинство проектов могут попробовать новую реализацию с минимальными изменениями.

👉 https://devblogs.microsoft.com/typenoscript/progress-on-typenoscript-7-december-2025/
🔥182
Не делайте рефакторинг как дядя Боб

Книга «Чистый код» Роберта Мартина считается классикой, но слепое следование ее догмам может навредить.

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

Вместо того чтобы упростить логику, «дядя Боб» превращает функцию в класс с лишними уровнями абстракции, получая код, в котором приходится прыгать по методам, чтобы понять суть простой операции.

P.S. Загляните в комментарии на Хабре: там предложили вариант реализации, который оказался даже лучше, чем у автора статьи.

👉 https://habr.com/ru/companies/ruvds/articles/970488/
🔥9💯4🤝32😡1
Пример процесса работы с техническим долгом

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

Tech Lead команды Skyeng Михаил Ефанов поделился опытом, как систематизировать этот процесс, выделив работу с техдолгом в отдельный предсказуемый поток, прозрачный и для команды, и для бизнеса.

👉 https://habr.com/ru/articles/962734/
👍96🔥2
Angular Pipes

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

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

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

👉 https://medium.com/p/f616ec84fb8d
👍7💩4👎2🤮2🌭1🎃1🆒1
Реактивная Архитектура

Optimistic UI делает интерфейс мгновенно отзывчивым, но может привести к несогласованности состояния, а обработка ошибок сервера превращается в сложный код для отката изменений.

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

👉 https://habr.com/ru/articles/974068/
🤡8👍72👎1💘1👾1
Кастомный билдер для Angular

В одном из обсуждений Алекс поделился опытом создания собственного билдера для Angular с поддержкой микрофронтенд-архитектуры.

Решение появилось как ответ на ограничения Native Federation и переросло в полноценный инструмент.

👉 https://dev.to/klerick/custom-builder-for-angular-my-way-12hd
🔥92👍2💊1
Angular Q&A: Будущее Signal Forms

Главной темой недавней встречи с командой Angular стали Signal Forms, представленные в версии 21 в статусе experimental.

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

Некоторые внутренние проекты Google уже начали использовать новые формы, что делает их, несмотря на статус, более стабильными, чем могло бы показаться.

Глобальных архитектурных сдвигов не ожидается, но команда оставляет за собой право вносить breaking changes для обработки граничных случаев.

👉 https://www.youtube.com/live/vnSaYHYLI0Q
👍41🔥1