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

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

Чаты @angular_ru @angular_jobs
Download Telegram
Генерируем пифагоровы тройки на RxJS

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

Иван Клименко нашел интересное применение RxJS. Надеемся, оно развлечет вас и поднимет настроение.

👉 https://habr.com/ru/articles/729112/
👍6🤔1
Будущее рендеринга на стороне сервера в Angular

Команда Angular сообщает, что в предстоящем шестнадцатом выпуске Angular сможет повторно использовать существующие структуры DOM на клиенте, которые были отрендерены на сервере, без необходимости уничтожать и заново рендерить их все.

Они также внесли некоторые обновления в HttpClient. Теперь он будет кэшировать запросы, сделанные на сервере, чтобы избежать повторной выборки тех же данных на клиенте.

Скоро рендеринг на стороне сервера станет встроенной частью Angular CLI. Планируется перенести все пакеты Angular Universal во фреймворк и инструментарий, чтобы обеспечить наилучший опыт работы с SSR.

👉 https://medium.com/p/2a6f27662b67
👍3516🔥1
ng-morph - ваш первый помощник в разработке Angular библиотек

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

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

Поэтому в этой статье Роман Седов рассказал, как ng-morph может сэкономить много времени для вас и разработчиков, которые используют ваши инструменты.

👉 https://medium.com/p/ac06dbb00f99
👍12💩21👎1🕊1
🦄 Введение в холодные и горячие Observable

По мере изучения RxJS разработчик рано или поздно сталкивается с такими понятиями, как cold и hot observable, также на собеседованиях можно услышать вопросы по этой теме.

Надеемся, статья поможет разобраться с особенностями потоков в RxJS.

👉 https://habr.com/ru/companies/tinkoff/articles/729808/
👍17😁2
Сокращение типизации с помощью Utility Types

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

В статье рассмотрены способы сократить количество типов/интерфейсов в Typescript, сделать их более лаконичными и сэкономить время себе и своей команде.

👉 https://habr.com/ru/articles/730906/
👍11🤔3👎1
🦄 Делаем декларативный роутинг диалогов

Часто нужно открывать модальные окна по определенному пути. Из коробки Angular не предоставляет этой возможности, так же как и популярные UI Kit библиотеки, и каждый раз приходится искать способ, как это сделать.

Дмитрий Пурис разобрал два подхода к созданию модальных окон, связанных с URL.

👉 https://habr.com/ru/companies/tinkoff/articles/731376/
👍21❤‍🔥53
🦄 Как ng-morph может помочь вам сохранить монорепозиторий чистым

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

Роман Седов показал несколько примеров того, как вы можете преобразовать свой проект с помощью ng-morph.

👉 https://medium.com/p/bbca8e62c4b3
👍131💅1
Что нового в Angular 16

Уже продолжительное время мы слышим об интеграции сигналов, но Angular 16 принесет гораздо больше.

Новая версия еще не вышла, некоторые API, описанные в этой статье, могут еще измениться. Тем не менее, она дает представление о том, что ожидать от следующего релиза.

👉 https://dev.to/this-is-angular/whats-new-in-angular-16-375b
👍25🔥1
Переход Angular CLI на Jest и Web Test Runner

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

Проведя опрос, команда Angular решила добавить первоначальную экспериментальную поддержку Jest в Angular 16, а также Web Test Runner в одном из будущих релизов.

👉 https://medium.com/p/ef85ef69ceca
👍134🔥4
Преобразование Observables в Signals

Angular 16 поставляется с новым пакетом rxjs-interop, в котором появилась функция toSignal, преобразующая observables в signals.

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

👉 https://medium.com/p/4f5474c765a0
👍12💩5👎1
Стратегии предварительной загрузки

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

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

👉 https://dev.to/this-is-angular/optimize-your-angular-apps-user-experience-with-preloading-strategies-3ie7
👍5👾3🤷‍♂1🆒1
🔥 Релиз Angular 16

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

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

👉 https://medium.com/p/4d7a28ec680d
🙏15🔥1211👍4💅2👏1🤔1
Minko Gechev об Angular 16 и 17

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

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

👉 https://dev.to/this-is-angular/minko-gechev-on-angular-16-17-game-changer-or-loss-of-identity--5lk
👍9👏1
Осваиваем Angular 16

На прошлой неделе вышла последняя версия Angular с множеством крутых нововведений.

Эта статья поможет изучить их.

👉 https://dev.to/this-is-angular/master-angular-16-17no
🔥9👍6
NgDoc — Cоздание документации для Angular проектов

Хорошая документация к проекту должна состоять из гайдов, с примерами использования и API сгенерированного на основании кода.

Александ Скоропад рассказал о библиотеке для создания документации, которую он недавно выпустил.

👉 https://habr.com/ru/articles/733552/
👍20👎1
Лучшие практики интернационализации

Оригинальная статья была создана 2 года назад для Angular 11, с тех пор многое изменилось, поэтому в новой статье внесены коррективы с учетом Angular 16.

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

👉 https://medium.com/p/384a98ee672a
👍8
🦄 Изучаем компонентный стор

Компонентный стор — дает удобный инструмент для создания изолированных хранилищ и является альтернативой классическим сервисам на Subject’ах.

Григорий Зароченцев рассказал, что такое компонентный стор, как изолированные хранилища помогают сэкономить кучу кода при разработке и почему глобальный стор — это одновременно и хорошо и плохо.

👉 https://habr.com/ru/companies/tinkoff/articles/735198/
👍13🔥4
Удаление Angular Compatibility Compiler в Angular 16

Angular Compatibility Compiler (ngcc) — это компилятор, предназначенный для преобразования библиотек, скомпилированных с помощью Angular Compiler (ngc), в формат, совместимый с Angular Ivy.

Для разработчиков это означает необходимость убедиться, что все их библиотеки и зависимости совместимы с Ivy, но в целом изменение приносит больше пользы, чем неудобств. Отказ от ngcc сокращает время сборки, поскольку отпадает необходимость в дополнительном преобразовании кода.

👉 https://medium.com/p/83e685552ab3
👍18👎4
8 мифов об Angular, которые пора забыть

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

В статье разобраны 8 самых распространенных мифов и причины их возникновения.

👉 https://medium.com/p/3f7dfdc2a702
👍15🔥1😁1
Сигналы и ваша архитектура

Сигналы — одна из самых интересных функций, появившихся в последнее время в Angular. Но как они влияют на вашу архитектуру?

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

👉 https://www.angulararchitects.io/en/aktuelles/angular-signals-your-architecture-5-options/
👍91🤨1