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

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

Чаты @angular_ru @angular_jobs
Download Telegram
🦄 Битва CLIs

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

Даниил рассказал, почему они используют Nx для всех Angular-проектов, какие проблемы решает этот инструмент и чем он лучше Angular CLI.

👉 https://habr.com/ru/companies/tinkoff/articles/738654/
👍16💩4🔥3😁1
Руководство по пользовательским директивам

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

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

👉 https://www.thisdot.co/blog/a-guide-to-custom-angular-attribute-directives/
👍4👎2💩1
Анонс NgRx v16

В версии 16 в NgRx Store появился новый метод selectSignal, который обеспечивает интеграцию с сигналами.

Так же в нее вошли другие интересные функции и исправления ошибок.

👉 https://dev.to/ngrx/announcing-ngrx-v16-integration-with-angular-signals-functional-effects-standalone-schematics-and-more-5gk6
🔥14👍5
Angular Route Guards: Руководство по безопасной навигации

Если вы заинтересованы в ограничении доступа к определенным маршрутам.

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

👉 https://dev.to/this-is-angular/demystifying-angular-route-guards-a-beginners-guide-to-secure-navigation-597b
👍11
Основные операторы RxJS

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

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

👉 https://www.danywalls.com/key-rxjs-operators-every-angular-developer-should-know
👍8💩6
Тестирование в Angular

В Angular 16 была отменена Karma и введен Jest в экспериментальном режиме. Означает ли это, что в настоящее время у нас нет стабильного фреймворка для тестирования? Должны ли мы перейти на Jest? Что не так с Karma в первую очередь?

В этой статье ответы на эти и другие вопросы.

👉 https://dev.to/this-is-angular/angular-testing-in-2023-past-present-and-future-j5m
👍101🔥1
TypeScript 5.0 и 4.9: оцениваем и сравниваем изменения

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

В этой статье разобраны изменения предыдущих версий.

👉 https://habr.com/ru/companies/simbirsoft/articles/740224/
👍62
Занимаемся оптимизацией

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

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

👉 https://dev.to/brihoum/how-i-optimized-my-angular-website-3fd0
👍13
Берем данные из роутера

Начиная с 16 версии Angular, мы можем использовать inputs для объявления свойств, которые будут привязываться к параметрам маршрута.

В этой статье показано, как это работает.

👉 https://indepth.dev/posts/1519/router-data-as-components-inputs-in-angular-v16
👍25🔥5
Пишем расширение для VSCode с помощью GPT-4

Можем ли мы использовать нейросеть для генерации всего кода программы без человеческого вмешательства?

В статье проверяется способность GPT-4 генерировать сложные программы.

👉 https://habr.com/ru/companies/ruvds/articles/740716/
🤔7💩5👍4
🦄 История о том, как мы на Module Federation съезжали

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

Максим Смирнов опубликовал заключительную часть трилогии о переезде на MFE.

👉 https://habr.com/ru/companies/oleg-bunin/articles/741722/
👍5🥱5
🦄 Работа с формами в Angular

Большая зависимость от UI-библиотеки при обновлении мажорной версии приведет к куче рефакторинга во всех формах.

Александр Бухтатый показал один из способов работы с формами, который упрощает создание новых форм и изолирует зависимость от внешней UI-библиотеки.

👉 https://habr.com/ru/companies/tinkoff/articles/740706/
👍14🔥2
🔥 RFC: Built-In Control Flow

Этот RFC предлагает новый синтаксис потока управления для Angular и представляет значительные изменения в фреймворке.

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

👉 https://github.com/angular/angular/discussions/50719
👎21👍7🤔32🤮2
🦄 Maskito – новая коллекция библиотек для маскирования текстовых полей

Maskito — коллекция библиотек, упрощающих маскирование текстовых полей, с удобным и гибким публичным API.

Барсуков Никита рассказал о релизе первой мажорной версии.

👉 https://habr.com/ru/companies/tinkoff/articles/743060/
👍13🔥5
Как RxJS разделил мой мир на до и после

По RxJS есть много докладов, но еще ни один не показал его силу.

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

👉 https://youtu.be/Ibq3EPi2cH4
👍15👎8🔥4🤔1🕊1🐳1🌭1
Не пропусти это при работе с Nx

Часто работа с Nx заканчивается на имеющихся дефолтных настройках. Все остальное остается черным ящиком. Время сборки проектов начинает расти, а причины так и остаются неизвестными.

Анастасия Анисимова предложила отправиться на изучение официальной документации и поискать лайфхаки.

👉 https://habr.com/ru/companies/skyeng/articles/743458/
👍165🔥2😁1
Полезные приемы Chrome DevTools

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

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

👉 https://indepth.dev/posts/1521/useful-chrome-devtools-techniques-when-debugging-change-detection-in-angular
👍5🤔1
Как легко отлаживать приложения

Иногда поиск ошибки занимает больше времени, чем ее исправление.

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

👉 https://www.danywalls.com/how-to-debug-angular-applications-easy
👍6👎3
🎉 Анонс TypeScript 5.2 Beta

Обычно после создания объекта необходимо произвести некоторую "очистку". Например, вам может понадобиться закрыть сетевые соединения, удалить временные файлы или просто освободить память.

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

👉 https://devblogs.microsoft.com/typescript/announcing-typescript-5-2-beta/
👍6🔥1
Angular Dependency Injection инфографика

Angular имеет свой собственный фреймворк инъекции зависимостей. Он помогает повысить эффективность и модульность, но может быть сложным по сравнению с традиционными DI-фреймворками.

Надеемся, эта инфографика упростит его изучение.

👉 https://christiankohler.net/angular-dependency-injection-infographic-updated
👍20🔥4