🦊 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 inject

Angular 14 содержит множество замечательных функций. Помимо автономных компонентов и типизированных форм, функция inject была одной из самых обсуждаемых.

Но что же это такое? Давайте разберемся.

👉 https://medium.com/p/33c6ce8cfd07
👍12🐳4
Управляем доступом с помощью директив

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

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

👉 https://medium.com/p/48f477f69d23
👍14🔥2
Создаем чат

Appwrite — это backend-as-a-service с открытым исходным кодом, который предоставляет набор функций, от взаимодействия с базой данных до аутентификации, и обновлений в реальном времени.

В статье на примере чата показано, как начать работу с Appwrite.

👉 https://dev.to/appwrite/building-a-realtime-chat-application-using-angular-and-appwrite-i3o
👍4
Делаем код более абстрактным

Angular позволяет писать абстрактный код без каких-либо неожиданных зависимостей. Самый простой способ проверить, насколько абстрактен ваш код — попробовать запустить проект в режиме SSR.

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

👉 https://medium.com/p/7b16273658db?sk=752ffb35983f38e82be8e45759371ed4
👍10🔥2
Ищем и устраняем неисправности маршрутизации

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

Мария Корнеева рассказала, что может пойти не так при настройке Angular роутера.

👉 https://medium.com/p/bc96c59fe49b
👍3🔥2🤩1
Типизированные формы

Ранние версии Angular Reactive Forms не были полностью безопасными с точки зрения типов, значение выдаваемое формой, имело тип any. Поэтому легко было случайно столкнуться с ошибками, например, присвоить полю формы значение неправильного типа.

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

👉 https://blog.angular-university.io/angular-typed-forms/
👍6🔥4
Выходим на мета-уровень!🤯 11 июля начинается новый сезон Podlodka Soft Skills Crew, который называется "Научиться учиться"🤩

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

Поэтому в новом сезоне мы сконцентрируемся на выстраивании эффективного подхода к самообучению:

⭐️ Проанализируем свои потребности и цели в обучении
⭐️ Построим план по достижению этих целей
⭐️ Поймем принципы обучения на биологическом уровне
⭐️ Изучим и сравним инструменты обучения от книг и до сессий с ментором
⭐️ Научимся разбираться с мотивацией и находить силы

Бонус трек – в течение всей недели по утрам будут практические воркшопы по осознанности, рефлексии и самодиагностике!

Если вы еще не разу не были на Podlodka Crew, то самое время попробовать! Главные фичи:
💡Узкая тема. Разбираем теорию и практику конкретного подхода или технологии.
💡Удобное расписание: сессии идут 2 раза в день с понедельника по пятницу.
💡Море практики, реальных кейсов и нетворкинга без границ

👉 Купить билеты и посмотреть расписание можно на сайте конференции. Ждем вас на борту!
👎7👍3
🔥 Розыгрыш двух билетов на Podlodka Crew

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

Для участия необходимо:
💖 Быть подписанным на канал
👉 Ответить на несколько вопросов

Конференция состоится 11 - 15 июля

💖 Желаем удачи
👎9👍8
Начинаем розыгрыш билетов Podlodka Crew

Если вы еще не подали заявку на участие, то можете сделать это здесь

Нажмите, чтобы присоединиться к стриму
👍5👎3
Повышаем надежность

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

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

👉 https://medium.com/p/855deec98fbc
👍8🔥2
Новый подход к шаблону Container-Presenter

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

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

👉 https://medium.com/p/dac60ca1b65e
👍9🔥3
Разбираемся с ошибками

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

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

👉 https://dev.to/this-is-angular/errors-and-angular-n0b
👍7👏1
Проверяем ответы сервера

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

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

👉 https://timdeschryver.dev/blog/why-we-should-verify-http-response-bodies-and-why-we-should-use-zod-for-this
👍5👎5🔥1
Предотвращаем утечки памяти

JavaScript язык программирования высокого уровня. В отличие от низкоуровневых языков, таких как C или C++, разработчику не нужно выделять и освобождать память в явном виде. Сборщик мусора берет на себя эту ответственность. Однако сборщику мусора нужны подсказки, должны ли определенные объекты существовать в памяти.

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

👉 https://medium.com/p/5b83eb361b82
👍10🔥2🙏1
Разбираемся с реактивностью

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

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

👉 https://dev.to/this-is-angular/progressive-reactivity-in-angular-1d40
👍11🤩1
Внешние конфигурации

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

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

👉 https://indepth.dev/posts/1502/external-configurations-in-angular
👍7👎1
Пользовательские операторы RxJS

Библиотека RxJS поставляется с богатым набором операторов, которые способны решить большинство проблем, возникающих при работе с потоками.

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

👉 https://medium.com/p/da8443a89c3a
👍81💩1