🦊 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
Устанавливаем заголовки страниц

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

Давайте посмотрим, какие возможности предоставляет Angular 14.

👉 https://medium.com/p/612ddbbf8495
👍14🔥2
🔥 Community Day на HolyJS 2022 Spring — 10 июня доступ свободный

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

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

Для участия в Community Day нужно только зарегистрироваться — для этого переходите по ссылке.
🔥5👍2
Кэшируем ответы API с помощью RxJS

RxJS 7.1 принес нам улучшенный оператор share и новый способ его настройки.

Из статьи мы узнаем о новом способе реализации кэширования ответов.

👉 https://medium.com/p/5cbc05d12f10
👍19🔥4
Мигрируем с Flow на TypeScript

Перевод на TypeScript существующего кода — задача объемная и на нее нужно выделять время разработчиков, тестировщиков. Сделать ее быстро не получится, это надо учитывать. Но оно того стоит, с TypeScript разработка становится быстрей, понятней и приятней.

В статье детально описан опыт миграции на TypeScript.

👉 https://habr.com/ru/company/exness/blog/670828/
👍3
Оптимизируем производительность

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

В этой статье перечислены 9 советов по улучшению производительности ваших Angular приложений.

👉 https://medium.com/p/dbedb0ec4e2d
👍13💩11
Разыгрываем офлайн-билет на HolyJS

Уже на следующей неделе в Санкт-Петербурге пройдет большая конференция по JS-разработке HolyJS. Вас ждут доклады, BoF-сессии, круглые столы, дискуссии со спикерами, живое общение и нетворкинг.

🎉 И мы объявляем розыгрыш офлайн-билета на конференцию

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

Для участия необходимо заполнить форму.

👉 https://forms.gle/nF1TMQDPVD87zMxe8
🔥6👍5👎4
Создаем типизированные формы

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

Эта статья показывает новые возможности форм в Angular 14.

👉 https://medium.com/p/86837965a0e5
👍9
Выбираем архитектуру

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

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

👉 https://medium.com/p/ddde5ca111df
👍8
🦊 Сегодня воскресение, а значит давайте разыграем билет на HolyJs

Я нахожусь в полевых условиях, сделаем это прям сейчас

У вас есть несколько минут, чтобы заполнить форму https://t.me/angular_fox/533
👍1
🎉 Объявляем результаты розыгрыша офлайн-билетика на HolyJS

@Ktpvj, билетик ваш, поздравляем🎉 Организаторы скоро с вами свяжутся😉

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

Программа конференции и билеты — на сайте.

Увидимся в теплом ламповом офлайне
👍7🔥3😁2
Паттерны проектирования в Angular

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

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

👉 https://dev.to/armandotrue/design-patterns-in-angular-part-i-3ld7
👍19🔥5🙏1
Создаем структурные директивы

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

В статье показано, как реализовать пользовательский NgFor.

👉 https://indepth.dev/tutorials/angular/guide-to-repeat-HTML-elements-multiple-times
👍13🔥3
Применяем паттерн адаптер

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

Павел Беликов предложил использовать адаптер для Angular приложений.

👉 https://medium.com/p/3d00582c7156
👍6🤔3🔥2❤‍🔥1
Используем веб-компоненты в Angular

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

Давайте приступим к созданию нашего первого веб-компонента, который мы интегрируем с Angular.

👉 https://medium.com/p/c5d1d7825ca0
👍11
Как Computed Properties в Angular помогают пропускать титры

Computed Properties в самом Angular нет, но что-то подобное есть в RxJS, который идет с ним в комплекте. Он позволяет разделять бизнес-логику на отдельные атомарные и логичные куски, объединять их в любом порядке, сохраняя при этом чистоту кода.

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

👉 https://habr.com/ru/company/ru_mts/blog/671922/
👍93👎1🔥1
Основы взаимодействия компонентов

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

Давайте рассмотрим несколько способов взаимодействия компонентов.

👉 https://medium.com/p/82fc196f30f9
👍10🤔1
Создаем директиву копирования текста в буфер обмена

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

Давайте создадим директиву, которая упростит нашу работу.

👉 https://medium.com/p/fc1139b9e755
👍10👎2🔥2😁1