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

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

Чаты @angular_ru @angular_jobs
Download Telegram
Композиция директив

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

Давайте посмотрим, что это такое.

👉 https://medium.com/p/e7d9f789323
👍9🔥3👌32
Создаем динамические формы

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

Сегодня мы узнаем, как реализовать это с помощью реактивных форм.

👉 https://www.danywalls.com/how-to-build-dynamic-forms-in-angular
🔥8👍4👎2
Используем Web Workers в Angular

Web Workers позволяют нам выполнять JavaScript вне основного потока. Больше потоков означает, что больше вещей выполняется одновременно, но лучше использовать их для выполнения трудоемких вычислений.

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

👉 https://medium.com/p/84b9949a4fab
👍71
Практическое руководство по провайдерам

При создании приложений в Angular вы можете добавлять и настраивать зависимости с помощью провайдеров.

В этой статье рассказывается о DI в Angular, и демонстрируется несколько стратегий для настройки зависимостей.

👉 https://dev.to/angular/a-practical-guide-to-providers-in-angular-3c96
👍10🏆1
Изучаем Elf

Elf — это стейт менеджер на основе RxJs. Внутри Elf просто класс, который расширяет BehaviorSubject. Он не зависит от фреймворка, является модульным и спроектирован таким образом, что его легко расширять.

Надеемся, что эта серия статей поможет вам сфокусироваться на том, что следует искать в решениях для управления состоянием.

👉 https://medium.com/p/fe5e87c31c89
👍11🔥2
Разбираем ngrx/createFeature

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

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

👉 https://habr.com/ru/company/nspk/blog/698980/
👍8👏1💩1
Учим декораторы в TypeScript

Если вы использовали Angular или Nest.js, вы должны быть знакомы с декораторами, но возможно вам не приходилось писать собственные.

Декораторы в TypeScript совсем несложные, статья позволит вам освоить 4 типа декораторов.

👉 https://medium.com/p/daa9660f8286
👍7🔥1🤔1👌1
Angular 15 уже доступен!

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

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

👉 https://medium.com/p/df7be7f2f4c8
🔥28👍85
Сужение типов

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

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

👉 https://medium.com/p/649450d708df
👍7💩2
RxJS для самых маленьких

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

Надеемся, что эта статья поможет вам понять идею некоторых основных концепций и операторов.

👉 https://medium.com/p/461636d8b689
👍9🔥5
Осваиваем автономные компоненты в Angular 15

Одно из преимуществ автономных компонентов заключается в том, что они облегчают изучение Angular для новичков, не требуя понимания ngModule.

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

👉 https://www.danywalls.com/head-start-with-standalone-components-in-angular-15
👍5🤔3
Примеры использования NgRx: Работа со списками

ngrx/entity — это мощный инструмент, который предоставляет набор вспомогательных функций для работы с коллекциями данных.

В этой статье рассмотрена работа со списками с его помощью.

👉 https://dev.to/this-is-angular/ngrx-use-cases-part-ii-working-with-lists-1j58
👍8🔥1
🦄 (Микро)фронтенды и микросервисы с помощью Webpack

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

Максим Смирнов рассказал, как разбить монолит на микрофронтенды, чтобы все остались довольными.

👉 https://habr.com/ru/company/tinkoff/blog/701152/
👍5🔥3
Привет! На связи Podlodka — организатор IT-конференций, родившихся из популярного подкаста. Приглашаем на юбилейный пятый сезон Podlodka Frontend Crew! Старт — 5 декабря.

🤓 В этот раз мы решили глубже разобраться в браузерных API. В спикерах — Павел Теренин, Полина Гуртовая, Никита Дубко и Саша Шинкевич.

👾 Разберём самые странные браузерные API. Вместе узнаем, что уже сейчас могут делать современные браузеры и как это может помочь вашим проектам.
👾 Узнаем про WASM в браузере и вне его. Попробуем понять, для чего можно использовать WASM, и обсудим распространённые проблемы.
👾 Послушаем подробный обзор полезных инструментов Chrome и узнаем о новых возможностях.
👾 Поговорим про проект Fugu, который прямо на веб-странице предоставляет доступ к любым API, используемым iOS- и Android-разработчиками. Обсудим, какие API можно использовать в продакшне.

🤑 Держи доп. промик на скидку 500 руб: frontend_crew_5_D1hyOx

👉 Залетай на сайт, чтобы узнать подробности и забрать билет со скидкой!
💩6👍3🔥1
Redux в Angular

В экосистеме Angular есть несколько реализаций сторов на основе концепций Redux.

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

👉 https://medium.com/p/591ba785e0fc
👍7🤮4🔥2😢2💩1
🔥 Разыгрываем два билета на Podlodka Frontend Crew

Специально для наших подписчиков мы запускаем конкурс совместно с Podlodka Frontend Crew.

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

Конференция начнется 5 декабря. Вас ждут эксперты из топовых компаний — сессии в Zoom, сообщество в Slack и ламповая атмосфера.

💖 Желаем удачи
💩9👍6
Изучаем модульные тесты

Одна из самых больших трудностей, когда люди только начинают изучать Angular, — это работа с модульными тестами.

Надеемся, после прочтения статьи вы будете чувствовать себя более уверенно при работе с ними.

👉 https://dev.to/stevewhitmore/angular-unit-tests-common-pain-points-4366
👍6
Паттерны проектирования: Команда

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

В статье с помощью него реализуется аналог приложения Shortcuts из iOS.

👉 https://medium.com/p/10b3162e3bee
👍7🔥3🐳1
Создаем Angular библиотеки

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

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

👉 https://medium.com/p/73ee45b32916
👍13🔥2
Изучаем строго типизированные реактивные формы

Типизированные формы помогают нам избежать многих распространенных проблем при работе с нашими формами.

Лучший способ научиться и понять, зачем использовать типизированные реактивные формы, — это разобрать сценарий использования.

👉 https://www.danywalls.com/how-to-use-strictly-typed-reactive-forms-in-angular
👍9🔥1