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

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

Чаты @angular_ru @angular_jobs
Download Telegram
🦊 Angular Fox 🚀 — русскогорящие новости сообщества
🙌 Играемся с состояниями в Angular

Достаточно необычное использование специфики работы Components и projectable nodes, которые делают код более декларативным. Обязательно поэкспериментируйте с этим 🙋🏼‍♀️

👉 https://blog.angularindepth.com/a48932d2fa27
🦊 Angular Fox 🚀 — русскогорящие новости сообщества
📣 Один из самых популярных вопросов: циклические зависимости при импортах

Что делать, когда в консоли вы видите WARNING in Circular dependency detected? 🙀

👉 https://blog.angularindepth.com/fd8ede198596
🦊 Angular Fox 🚀 — русскогорящие новости сообщества
This media is not supported in your browser
VIEW IN TELEGRAM
🦄 Структурные директивы за 5 минут

🏔 Как Angular преобразует синтаксис структурных директив в <ng-template>.

🌋 Генерация структурной директивы по указанному синтаксису.

👉 https://alexzuza.github.io/ng-structural-directive-expander/
🦊 Angular Fox 🚀 — русскогорящие новости сообщества
🦊 У вас остались несохраненные изменения. Вы точно хотите уйти? Или нет? 🙀

Попробуйте простое решение для своих Reactive Forms, которое защитит данные пользователя от случайного перехода!

👉 https://netbasal.com/75fd8f5f1fa6
🦊 Angular Fox 🚀 — русскогорящие новости сообщества
🦊 Нужны ли подчеркивания в переменных

🌋 Как писать код проще
Зачем используют ограничение 80 символов
🏔 Что такое кошелёк миллера

Или как значительно улучшить свой скилл буквально за 50 минут 🙌

👉 https://youtu.be/z5WkDQVeYU4
🦊 Angular Fox 🚀 — русскогорящие новости сообщества
👩‍💻 Хотите немного размяться с RxJS?

Предлагаю попробовать свои силы в имплементации кастомного оператора inOrder, который вернет значения в правильном порядке.

Удачи! 🙋🏼‍♀️

👉 https://stackblitz.com/edit/rxjs-operator-challenge-in-order
🦊 Angular Fox 🚀 — русскогорящие новости сообщества
🐙 Octotree — еще один плагин для браузера, который 🦊 использует для GitHub

Он отображает файловую структуру репозитория, что делает навигацию проще. Есть бесплатная версия 🍟

👉 https://www.octotree.io/
🦊 Angular Fox 🚀 — русскогорящие новости сообщества
👩‍💻 Сложности в программировании

🍚 Разбираемся с ошибками
🥢 Расставляем капканы
🍛 Кушаем кушанье

👉 https://youtu.be/Xa-RHjUvQR0
🦊 Angular Fox 🚀 — русскогорящие новости сообщества
🦊 Что нового в RxJS v6.5

Добавили деструктуризацию в forkJoin 😸

Очень много deprecated, особенно обратите внимание на операторы combineLatest, forkJoin и другие 🙀

👉 https://netbasal.com/d0d74a6752ac
🦊 Angular Fox 🚀 — русскогорящие новости сообщества
👩‍💻 Builders для Angular CLI

Как создавать собственные команды для Angular CLI, настраивать их и переиспользовать 🙌

👉 https://blog.angular.io/d012d4489f1b
🦊 Angular Fox 🚀 — русскогорящие новости сообщества
🦊 Angular Fox Tip

Думаете, что чтобы проверить действительно ли изменилось значение у Reactive Forms, требуется подключить стороннюю библиотеку? 👩‍💻

Тогда попробуйте этот простой сниппет, который пометит Reactive Forms как pristine, когда значение не поменялось 🙌

👉 https://stackblitz.com/edit/angular-dirty-checker
🦊 Angular Fox 🚀 — русскогорящие новости сообщества
🦊 Angular Skill IQ

Прошел тест по Angular, и это мой результат 🙌

А какой результат получится у вас? Попробуйте пройти этот тест тоже, и обязательно присылайте скриншоты мне в twitter 🙋🏼‍♀️

👉 https://www.pluralsight.com/paths/angular

😻 Буду ждать ваших результатов здесь 👇
https://twitter.com/thekiba_io/status/1122440755874816000
🦊 Angular Fox 🚀 — русскогорящие новости сообщества
🦄 Основы реактивного программирования с использованием RxJS

Higher Order Observables
При работе с потоками часто возникает ситуация, когда необходимо в качестве значения одному потоку передать результаты работы другого. Как в этом помогут нам HOO? 🐥

👉 https://medium.com/p/d1337fbead32
🦊 Angular Fox 🚀 — русскогорящие новости сообщества
👩🏼‍🔬 Тестирование и подмена зависимостей в Angular

Как подменить зависимости для конкретной платформы: показываем и тестируем баннер для любимого Internet Explorer 11 😻

👉 https://blog.angularindepth.com/886495057121
🦊 Angular Fox 🚀 — русскогорящие новости сообщества
👩‍💻 Думаете, что хорошо знаете Regex?

Тогда предлагаю порешать в кроссворды с регулярными выражениями! Все что от вас требуется — это заполнить клеточки правильно 🙌

Не забудьте авторизироваться для сохранения своего прогресса 🐥

👉 https://regexcrossword.com/
🦊 Angular Fox 🚀 — русскогорящие новости сообщества
🦊 Определяем активна ли страница с помощью RxJS

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

👉 https://netbasal.com/ce499c522be4
🦊 Angular Fox 🚀 — русскогорящие новости сообщества
🦄 NG-Conf 🔴 Live Stream

С 1 по 3 мая проходит одна из самых больших конференций по Angular. Конференция доступна в режиме стрима на YouTube.

👉 https://www.ng-conf.org/livestream/
🦊 Angular Fox 🚀 — русскогорящие новости сообщества
🚀 Remote Development with VS Code, Back to the 1985 😻

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

Другими словами, вы можете без труда запустить ng serve на вашем сервере, автоматически развернуть удаленный VS Code Server, а всю разработку производить локально.

Похоже будущее, когда мы сможем легко использовать сервера для разработки, совсем не за горами 🙀

Анонс
👉 https://code.visualstudio.com/blogs/2019/05/02/remote-development

Как настроить
👉 https://code.visualstudio.com/docs/remote/remote-overview#_getting-started
🦊 Angular Fox 🚀 — русскогорящие новости сообщества
🦊 Использование Chrome DevTools

Учимся использовать инструменты более продутивно, ищем проблемы в производительности приложений и устраняем утечки памяти 🐥

👉 https://youtu.be/kBHUEFYawTk
🦊 Angular Fox 🚀 — русскогорящие новости сообщества
🦊 Декоратор OnChange вместо ngOnChanges

Если вам не хочется имплементировать хук ngOnChanges или get/set, то вы можете воспользоваться декоратором @OnChange().

Я предпочитаю использовать хук ngOnChanges, так как он дает большую гибкость. А вариант с декоратором: это альтернатива для get/set 👩‍💻

Доклад
👉 https://www.youtube.com/watch?v=rVDMmlCRvkg

npm
👉 https://www.npmjs.com/package/property-watch-decorator
🦊 Angular Fox 🚀 — русскогорящие новости сообщества
This media is not supported in your browser
VIEW IN TELEGRAM
🦄 Google I/O 🔴 Live Stream

С 7 по 9 мая проходит конференция Google I/O.
Конференция доступна в режиме стрима.

👉 https://events.google.com/io/live/