✨ Итоги года и планы на будущее
Чем вам запомнился 2025 год в Angular? Из всего многообразия хочется выделить появление Signal Forms и Resource API, а также переход на стабильный Zoneless и Vitest.
Что вы ожидаете от Angular в этом году? Какие фичи или улучшения вы хотели бы увидеть? Пишите свои предложения в комментариях. Самые интересные и технически обоснованные предложения мы передадим команде разработчиков.
👉 https://dev.to/this-is-angular/ng-news-angular-in-2025-307a
Чем вам запомнился 2025 год в Angular? Из всего многообразия хочется выделить появление Signal Forms и Resource API, а также переход на стабильный Zoneless и Vitest.
Что вы ожидаете от Angular в этом году? Какие фичи или улучшения вы хотели бы увидеть? Пишите свои предложения в комментариях. Самые интересные и технически обоснованные предложения мы передадим команде разработчиков.
👉 https://dev.to/this-is-angular/ng-news-angular-in-2025-307a
👍4❤2
✨ Типы TypeScript как язык программирования
Знали ли вы, что TypeScript является тьюринг-полным? Система типов TypeScript не просто инструмент проверки типов, а полноценный язык программирования.
Вы можете использовать дженерики как функции, условные типы для ветвления логики, рекурсию для итераций, а infer как переменные для деструктуризации значений.
Статья показывает практические примеры: генератор типов для CRUD-операций, вывод типов из middleware и многое другое.
👉 https://marmelab.com/blog/2025/12/04/typescript-type-as-a-programming-language.html
Знали ли вы, что TypeScript является тьюринг-полным? Система типов TypeScript не просто инструмент проверки типов, а полноценный язык программирования.
Вы можете использовать дженерики как функции, условные типы для ветвления логики, рекурсию для итераций, а infer как переменные для деструктуризации значений.
Статья показывает практические примеры: генератор типов для CRUD-операций, вывод типов из middleware и многое другое.
👉 https://marmelab.com/blog/2025/12/04/typescript-type-as-a-programming-language.html
👍8🤓4
✨ LeetCode для любителей TypeScript
Если затянувшиеся новогодние праздники слегка выбили вас из ритма и TypeScript вспоминается с усилием…
В комментариях к предыдущему посту поделились отличным сервисом, который поможет мозгу снова включиться.
👉 https://typehero.dev/
Если затянувшиеся новогодние праздники слегка выбили вас из ритма и TypeScript вспоминается с усилием…
В комментариях к предыдущему посту поделились отличным сервисом, который поможет мозгу снова включиться.
👉 https://typehero.dev/
👍8🔥6❤1😁1
✨ Практическое руководство по Blob, File API и оптимизации памяти
Если при обработке файлов вкладка подвисает или падает, это классический признак неправильной работы с памятью и большими данными на клиенте.
В статье разбираются шесть практических приемов работы с Blob и File API: правильное создание блобов, разбивка больших файлов на chunks, сжатие изображений через Canvas и многое другое.
👉 https://habr.com/ru/companies/timeweb/articles/976774/
Если при обработке файлов вкладка подвисает или падает, это классический признак неправильной работы с памятью и большими данными на клиенте.
В статье разбираются шесть практических приемов работы с Blob и File API: правильное создание блобов, разбивка больших файлов на chunks, сжатие изображений через Canvas и многое другое.
👉 https://habr.com/ru/companies/timeweb/articles/976774/
👍14⚡4🆒3✍2
✨ Спред оператор в шаблонах
Пока все празднуют, команда Angular добавила поддержку синтаксиса spread/rest в следующих местах синтаксиса шаблонов:
Объектов {a: 1, ...foo}
Массивов [1, ...foo]
Вызовы функций fn(1, ...foo)
👉 https://github.com/angular/angular/pull/66213
Пока все празднуют, команда Angular добавила поддержку синтаксиса spread/rest в следующих местах синтаксиса шаблонов:
Объектов {a: 1, ...foo}
Массивов [1, ...foo]
Вызовы функций fn(1, ...foo)
👉 https://github.com/angular/angular/pull/66213
🔥27👎4❤2👍1👌1🤝1
✨ Мне этот Chrome DevTools теперь абсолютно понятен
Если вы открываете DevTools только ради console.log() или инспектирования элементов, вы используете лишь малую часть возможностей.
Узнайте про полезные мелочи: от обращения к выбранным элементам через $0 и monitorEvents() для отслеживания событий до профилирования Web Vitals.
👉https://habr.com/ru/companies/timeweb/articles/976266/
Если вы открываете DevTools только ради console.log() или инспектирования элементов, вы используете лишь малую часть возможностей.
Узнайте про полезные мелочи: от обращения к выбранным элементам через $0 и monitorEvents() для отслеживания событий до профилирования Web Vitals.
👉https://habr.com/ru/companies/timeweb/articles/976266/
👍21🔥4
✨ Русскоязычный перевод документации
В официальной документации Angular появилась ссылка на русскоязычный перевод. Теперь тем, кому удобнее читать документацию на русском, не нужно искать перевод отдельно.
А если вы заметите неточности или ошибки в переводе, всегда можно внести свой вклад и помочь сделать документацию еще лучше (issues открыты).
👉 https://github.com/misha98857/angular-docs.ru
В официальной документации Angular появилась ссылка на русскоязычный перевод. Теперь тем, кому удобнее читать документацию на русском, не нужно искать перевод отдельно.
А если вы заметите неточности или ошибки в переводе, всегда можно внести свой вклад и помочь сделать документацию еще лучше (issues открыты).
👉 https://github.com/misha98857/angular-docs.ru
👍20🔥11❤4🤡2
✨ JavaScript-фреймворки: тренды на 2026
Райан Карниато, автор SolidJS, опубликовал свой ежегодный обзор JavaScript-фреймворков с взглядом в 2026 год.
Он разобрал, как фреймворки смещаются в сторону AI-first, async-first и изоморфной архитектуры.
👉 https://dev.to/this-is-learning/javascript-frameworks-heading-into-2026-2hel
Райан Карниато, автор SolidJS, опубликовал свой ежегодный обзор JavaScript-фреймворков с взглядом в 2026 год.
Он разобрал, как фреймворки смещаются в сторону AI-first, async-first и изоморфной архитектуры.
👉 https://dev.to/this-is-learning/javascript-frameworks-heading-into-2026-2hel
👍7💩5🤮1🥴1
✨ Signal Forms Guide
Если вы уже изучили официальную документацию по Signal Forms и даже прошли туториал, но все равно хочется больше материалов по теме.
Появилось интерактивное руководство, которое помогает закрепить базу.
👉 https://signal-forms.guide/guides/core-concepts
Если вы уже изучили официальную документацию по Signal Forms и даже прошли туториал, но все равно хочется больше материалов по теме.
Появилось интерактивное руководство, которое помогает закрепить базу.
👉 https://signal-forms.guide/guides/core-concepts
👍7🔥4
✨ Управление фокусом в Signal Forms
В новом Angular 21.1.0 Signal Forms получили метод
Метод работает интуитивно. Вызываешь его на состоянии поля, и автоматически находится связанный контрол и устанавливает на него фокус. Также поддерживается работа с кастомными контролами. И если контрол реализует свой метод
👉 https://medium.com/p/43ef2b1b34e6
В новом Angular 21.1.0 Signal Forms получили метод
focusBoundControl(), который позволяет программно устанавливать фокус на поля формы. Это решает типичные задачи: переход к первому полю с ошибкой после валидации, автофокус на следующий шаг в многошаговых формах или реализация клавиатурных шорткатов.Метод работает интуитивно. Вызываешь его на состоянии поля, и автоматически находится связанный контрол и устанавливает на него фокус. Также поддерживается работа с кастомными контролами. И если контрол реализует свой метод
focus(), то он будет вызван.👉 https://medium.com/p/43ef2b1b34e6
🔥26👍6❤3
✨ Что нового в Angular 21.1?
Недавно команда Angular выпустила минорные обновления с важными улучшениями.
Ключевые изменения коснулись Signal Forms, которые продолжают развиваться и приближаются к production-ready состоянию.
Signal Forms: директива [field] переименована в [formField] из-за возможных коллизий имен.
Появилась автоматическая установка CSS-классов на основе состояния полей через provideSignalFormsConfig(). Теперь можно настроить классы типа is-invalid для интеграции с Bootstrap или Tailwind.
Роутер: новая функция isActive() возвращает computed signal для отслеживания активного URL.
Экспериментальная интеграция с браузерным Navigation API.
Другие улучшения:
И это лишь малая часть из множества обновлений.
👉 https://blog.ninja-squad.com/2026/01/15/what-is-new-angular-21.1
Недавно команда Angular выпустила минорные обновления с важными улучшениями.
Ключевые изменения коснулись Signal Forms, которые продолжают развиваться и приближаются к production-ready состоянию.
Signal Forms: директива [field] переименована в [formField] из-за возможных коллизий имен.
Появилась автоматическая установка CSS-классов на основе состояния полей через provideSignalFormsConfig(). Теперь можно настроить классы типа is-invalid для интеграции с Bootstrap или Tailwind.
Роутер: новая функция isActive() возвращает computed signal для отслеживания активного URL.
Экспериментальная интеграция с браузерным Navigation API.
Другие улучшения:
@switch теперь поддерживает множественные @case для одного блока контента, в шаблонах работает spread-оператор, добавлена утилита provideStabilityDebugging() для отладки проблем с гидратацией в SSR.И это лишь малая часть из множества обновлений.
👉 https://blog.ninja-squad.com/2026/01/15/what-is-new-angular-21.1
🔥23👍4
✨ От хаоса к структуре
Недавно был представлен FEOD (Fractal Entity Oriental Design) — подход к структурированию фронтенд-приложений, который объединяет лучшее из Atomic Design, FSD и модульной архитектуры. Главная цель, убрать спорную терминологию и дать разработчикам конкретные ответы на вопрос, что и куда класть.
Суть FEOD: проект делится на App, Pages, Modules, Common, Global с четкими правилами импортов. Модули изолированы через публичные API, поддерживают вложенность любой глубины (фрактальность).
Структура изначально разрабатывалась под Vue, но сам принцип универсален. В контексте Angular можно обсудить адаптацию подхода и поделиться опытом.
Проект еще развивается, если интересно поучаствовать в доработке структуры, которая ставит архитектуру на рельсы без перегруза правилами, можете оставить заявку здесь.
Отдельное спасибо Денису Чернову за то, что запустил эту инициативу.
👉 https://habr.com/ru/companies/sportmaster_lab/articles/972410/
Недавно был представлен FEOD (Fractal Entity Oriental Design) — подход к структурированию фронтенд-приложений, который объединяет лучшее из Atomic Design, FSD и модульной архитектуры. Главная цель, убрать спорную терминологию и дать разработчикам конкретные ответы на вопрос, что и куда класть.
Суть FEOD: проект делится на App, Pages, Modules, Common, Global с четкими правилами импортов. Модули изолированы через публичные API, поддерживают вложенность любой глубины (фрактальность).
Структура изначально разрабатывалась под Vue, но сам принцип универсален. В контексте Angular можно обсудить адаптацию подхода и поделиться опытом.
Проект еще развивается, если интересно поучаствовать в доработке структуры, которая ставит архитектуру на рельсы без перегруза правилами, можете оставить заявку здесь.
Отдельное спасибо Денису Чернову за то, что запустил эту инициативу.
👉 https://habr.com/ru/companies/sportmaster_lab/articles/972410/
🔥10👍5❤2👎1
✨ Angular Three
Если вы увлекаетесь 3D, обратите внимание на Angular Three.
Это кастомный рендерер для Angular, который позволяет использовать THREE.js декларативно, прямо через шаблоны.
3D-сцены можно собирать так же привычно, как обычный интерфейс, но они рендерятся не в DOM, а напрямую в Canvas.
👉 https://angularthree.org/
Если вы увлекаетесь 3D, обратите внимание на Angular Three.
Это кастомный рендерер для Angular, который позволяет использовать THREE.js декларативно, прямо через шаблоны.
3D-сцены можно собирать так же привычно, как обычный интерфейс, но они рендерятся не в DOM, а напрямую в Canvas.
👉 https://angularthree.org/
🔥24👍8👎1
✨ Angular получает поддержку стрелочных функций в шаблонах
В Angular теперь можно использовать стрелочные функции прямо в шаблонах. Они работают как обычные, но с некоторыми ограничениями.
Поддерживаются только функции с неявным возвратом:
Внутри стрелочных функций нельзя использовать pipe-операторы, но их можно передавать в pipe снаружи:
Чтобы избежать пересоздания функций при каждой проверке изменений, компилятор применяет оптимизации.
👉 https://github.com/angular/angular/commit/d9923b72a20972ba6bf728d78f1afac6936ade18
В Angular теперь можно использовать стрелочные функции прямо в шаблонах. Они работают как обычные, но с некоторыми ограничениями.
Поддерживаются только функции с неявным возвратом:
(a) => a + 1 разрешено, а (a) => { return a + 1 } нет. Внутри стрелочных функций нельзя использовать pipe-операторы, но их можно передавать в pipe снаружи:
(a, b) => a + b | test разрешено, а (a, b) => (a + b | тест) нет.Чтобы избежать пересоздания функций при каждой проверке изменений, компилятор применяет оптимизации.
👉 https://github.com/angular/angular/commit/d9923b72a20972ba6bf728d78f1afac6936ade18
🔥18👍6🤨3🥰2👏2
✨Магия deepSignal
Статья раскрывает, как утилита deepSignal решает проблему реактивности при работе с вложенным состоянием.
Утилита создает WritableSignal для конкретного свойства передаваемого сигнала, который реагирует только на изменения этого свойства, игнорируя остальные поля.
Это особенно полезно при работе с большими формами, позволяя обновлять только необходимые части без лишних перерасчетов.
👉 https://medium.com/p/6b9e0d73eb9d
Статья раскрывает, как утилита deepSignal решает проблему реактивности при работе с вложенным состоянием.
Утилита создает WritableSignal для конкретного свойства передаваемого сигнала, который реагирует только на изменения этого свойства, игнорируя остальные поля.
Это особенно полезно при работе с большими формами, позволяя обновлять только необходимые части без лишних перерасчетов.
👉 https://medium.com/p/6b9e0d73eb9d
👍10🔥2🥰1
✨ Signal Forms
На angularspace давно не было новых статей, но вот свежий материал о Signal Forms. Той самой фиче, о которой все говорят с момента анонса.
Хотя концепция уже многим знакома, стоит взглянуть на конкретику работы с экспериментальным API.
👉 https://www.angularspace.com/signal-forms/
На angularspace давно не было новых статей, но вот свежий материал о Signal Forms. Той самой фиче, о которой все говорят с момента анонса.
Хотя концепция уже многим знакома, стоит взглянуть на конкретику работы с экспериментальным API.
👉 https://www.angularspace.com/signal-forms/
👍11❤1🔥1
✨ Новые CSS-фичи, появившиеся к началу 2026 года
CSS достиг уровня, когда сложные вычисления и логика реализуются без препроцессоров и лишних JS-скриптов.
Ключевые нововведения:
Функция
👉 https://habr.com/ru/companies/ruvds/articles/984548/
CSS достиг уровня, когда сложные вычисления и логика реализуются без препроцессоров и лишних JS-скриптов.
Ключевые нововведения:
@function. Теперь можно объявлять собственные функции с аргументами и возвращать вычисленный результат.Функция
if(). Позволяет использовать условную логику. Работает в связке с media(), style() и supports().sibling-index(). Возвращает порядковый номер элемента среди соседей. interest-delay. Свойство добавляет задержку перед срабатыванием или отменой :hover, например, предотвращая случайное закрытие меню при движении курсора.field-sizing: content. Позволяет инпутам и textarea автоматически подстраивать свой размер под введенный контент.👉 https://habr.com/ru/companies/ruvds/articles/984548/
👍19🔥5👾3❤2
✨ OnPush станет стратегией по умолчанию
Команда Angular планирует сделать ChangeDetectionStrategy.OnPush стандартной стратегией обнаружения изменений для компонентов. Это изменение связано с переходом на zoneless-архитектуру и давно запрашивалось сообществом.
ChangeDetectionStrategy.Default будет переименован в ChangeDetectionStrategy.Eager для большей ясности. Существующие кодовые базы будут автоматически мигрированы с явным указанием Eager, сохраняя текущее поведение. Изменения запланированы для Angular 22 в мае.
👉 https://habr.com/ru/news/989852/
Команда Angular планирует сделать ChangeDetectionStrategy.OnPush стандартной стратегией обнаружения изменений для компонентов. Это изменение связано с переходом на zoneless-архитектуру и давно запрашивалось сообществом.
ChangeDetectionStrategy.Default будет переименован в ChangeDetectionStrategy.Eager для большей ясности. Существующие кодовые базы будут автоматически мигрированы с явным указанием Eager, сохраняя текущее поведение. Изменения запланированы для Angular 22 в мае.
👉 https://habr.com/ru/news/989852/
👍38🔥27❤3👎2
✨ Что, если вы уже решаете не ту проблему?
НЖЯ (Нежелательное Явление) — инструмент из Теории ограничений Голдратта для эффективной формулировки проблем. Прежде чем тратить месяцы на решение, нужно убедиться, что вы решаете ту самую проблему, а не её симптом.
Семь правил НЖЯ:
1. Регулярность повторения.
Проблема должна быть системной и повторяться регулярно, а не быть разовым инцидентом.
2. Зона влияния.
Формулировка должна касаться области нашего контроля.
3. Объективность и измеримость.
Нужны конкретные цифры вместо оценочных суждений: плохо, долго, много.
4. Не путать с причиной.
Сначала фиксируем проблему, потом ищем причины.
5. Не содержит завуалированное решение.
Если формулировка замаскированное решение, у вас остается только один вариант действий.
6. Не содержит обвинение.
Проблема должна быть в системе, а не в конкретном человеке.
7. Очевидная негативность.
Должно быть сразу понятно, что это плохо.
👉 https://habr.com/ru/articles/988796/
НЖЯ (Нежелательное Явление) — инструмент из Теории ограничений Голдратта для эффективной формулировки проблем. Прежде чем тратить месяцы на решение, нужно убедиться, что вы решаете ту самую проблему, а не её симптом.
Семь правил НЖЯ:
1. Регулярность повторения.
Проблема должна быть системной и повторяться регулярно, а не быть разовым инцидентом.
2. Зона влияния.
Формулировка должна касаться области нашего контроля.
3. Объективность и измеримость.
Нужны конкретные цифры вместо оценочных суждений: плохо, долго, много.
4. Не путать с причиной.
Сначала фиксируем проблему, потом ищем причины.
5. Не содержит завуалированное решение.
Если формулировка замаскированное решение, у вас остается только один вариант действий.
6. Не содержит обвинение.
Проблема должна быть в системе, а не в конкретном человеке.
7. Очевидная негативность.
Должно быть сразу понятно, что это плохо.
👉 https://habr.com/ru/articles/988796/
👍7🥴6❤2🔥1
✨ RxJS: интерактивный тренажер
Нашел бесплатный курс из 30 интерактивных уроков по RxJS.
Материал охватывает базовые и продвинутые операторы, управление состоянием, а также карточки для проверки знаний.
Автор активно дорабатывает тренажер и ждет обратной связи от сообщества.
👉 https://rxjs-course-avy.web.app/
Нашел бесплатный курс из 30 интерактивных уроков по RxJS.
Материал охватывает базовые и продвинутые операторы, управление состоянием, а также карточки для проверки знаний.
Автор активно дорабатывает тренажер и ждет обратной связи от сообщества.
👉 https://rxjs-course-avy.web.app/
🔥24👍17
✨ Полезные IT-концепции: от ложной дихотомии до резиновой уточки
Инженерная зрелость определяется не только знанием паттернов проектирования, но и пониманием когнитивных ловушек, влияющих на разработку.
Подборка наиболее актуальных:
Закон Конвея. Структура программного обеспечения неизбежно повторяет структуру коммуникаций в организации. Если команды бэкенда и фронтенда работают изолированно, интеграция будет костыльной.
Закон Гудхарта. Когда метрика становится самоцелью, она перестает быть хорошей метрикой.
Оверинжиниринг. Использование модных технологий там, где достаточно скрипта.
Бритье яка. Ситуация, когда вы хотите исправить баг, но обнаруживаете, что нужно обновить библиотеку, для которой нужно обновить версию языка, для чего нужно пересобрать контейнер…
Догфудинг. Подход, при котором разработчики сами используют свой продукт.
А какие принципы или когнитивные искажения чаще всего встречаете в работе вы? Делитесь любимыми примерами в комментариях.
👉 https://habr.com/ru/articles/988380/
Инженерная зрелость определяется не только знанием паттернов проектирования, но и пониманием когнитивных ловушек, влияющих на разработку.
Подборка наиболее актуальных:
Закон Конвея. Структура программного обеспечения неизбежно повторяет структуру коммуникаций в организации. Если команды бэкенда и фронтенда работают изолированно, интеграция будет костыльной.
Закон Гудхарта. Когда метрика становится самоцелью, она перестает быть хорошей метрикой.
Оверинжиниринг. Использование модных технологий там, где достаточно скрипта.
Бритье яка. Ситуация, когда вы хотите исправить баг, но обнаруживаете, что нужно обновить библиотеку, для которой нужно обновить версию языка, для чего нужно пересобрать контейнер…
Догфудинг. Подход, при котором разработчики сами используют свой продукт.
А какие принципы или когнитивные искажения чаще всего встречаете в работе вы? Делитесь любимыми примерами в комментариях.
👉 https://habr.com/ru/articles/988380/
👍6❤2✍1🥴1🤣1😭1