👏 FrontendConf 2021 в оффлайне!

11 и 12 октября в Москве состоится ежегодная конференция FrontendConf 2021. Это 2 дня живого общения, знакомство с современными подходами в разработке, обзор лучших практик и перспективных технологий. Поговорим и о хлебе насущном: карьера, софт-скиллс, работа с командой.

А для более доступного участия, всем подписчикам канала предложили промокод FR2021_FOX со скидкой -7%.

И если будете на конференции, то обязательно пишите, буду рад пообщаться 🦊

👉 https://clck.ru/WiLkp

✍️ Как построить архитектуру в Angular?

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

Почему? Да все очень просто, эта книга:
✨ научит Strategic Design (DDD)
✨ покажет как строить микрофронтенды
✨ расскажет о Module Federation
✨ и улучшит ваши архитектурные навыки

А еще, что круто, книга полностью бесплатная, дерзайте! 👏

👉 https://www.angulararchitects.io/en/book/

🎉 Мы создали RxJS сообщество

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

💖 Получите совет по RxJS от экспертов
✨ Окунитесь в дружелюбную атмосферу
✨ У нас нет конфликтов и нет "глупых вопросов"
✨ У нас довольно большая экспертиза

До встречи в новом сообществе, буду рад вас там увидеть! 👋

👉 https://t.me/rxjs_ru

👆 Стратегии изменений в Angular

Наверняка, вы задавались вопросом, как происходит отслеживание изменений в Angular.

В этой статье ребята из Тинькофф расскажут вам о особенностях при работе с изменениями в Angular и почему лучше поставить OnPush-стратегию по умолчанию.

👉 https://habr.com/ru/company/tinkoff/blog/581378/

🎉 Анонсирован TypeScript 4.5 beta.

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

💖 Что интересного

🔥 Поддержка ECMAScript модулей в Node.js
🔥 Модификатор типа для импорта
🔥 Новый тип Awaited
🔥 Оптимизации хвостовой рекурсии для условных типов
🔥 Множество других улучшений

👌 По этому поводу @kirjs, разработчик из Firebase, написал развернутый пост.

После выпуска бета-версии команда сосредоточится на исправлении проблем и доработке релиз-кандидата (RC).

👉 https://devblogs.microsoft.com/typescript/announcing-typescript-4-5-beta

🚀 Кастомные директивы

Если вы хотели создать собственную директиву, но боялись.

Александр Инкин показал на примере ngFor и ngIf, как расширить функциональность встроенных директив.

👉 https://habr.com/ru/company/tinkoff/blog/580172/

🚀 Проекция контента с помощью ng-content

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

Роман Седов рассказывает о том, как с помощью ng-content упростить использование и поддержку компонентов.

👉 https://habr.com/ru/company/tinkoff/blog/573660/

🎉 Мы создали Angular Jobs

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

Если вы хотите получать только сообщения о новых вакансиях и резюме, но вы не хотите общаться, то присоединяйтесь к каналу с вакансиями по Angular @angular_jobs_feed.

До встречи в новом сообществе, будем рады вас там увидеть! 👋

👉 https://t.me/angular_jobs

✨ Лениво подгружаем библиотеки

Возможно вы замечали сомнительные практики в официальном YouTube-компоненте Angular Material.

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

👉 https://habr.com/ru/company/tinkoff/blog/585534/

🎉 Новая версия Angular 13 уже доступна

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

Что интересного:
— Улучшена скорость сборки
— Ускорение тестов и дебага
— View Engine не доступен
— Новый Angular Package Format
— Улучшен a11y в Angular Material
— IE11 теперь не поддерживается
— RxJS 7.4 по умолчанию
— TypeScript 4.4

Чтобы обновиться, выполните следующую команду:
ng update

👉 http://goo.gle/angular-v13

🤔 Интерфейс или тип?

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

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

👉 https://ultimatecourses.com/blog/typescript-interfaces-vs-types

🔥 Роль микрофронтендов в будущем Angular

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

Давайте вместе выясним, в чем их преимущества и почему Angular превосходно подходит для микрофронтендов.

👉 https://itnext.io/how-micro-frontend-changes-the-future-of-angular-bb4deb2cfdad

🎉 Мы создали канал с анонсами тех.стримов

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

👋 Если вам важно держать руку на пульсе технологий, подписывайтесь.

👉 https://t.me/techStreamsRu

✨ Легкий старт в создании библиотеки компонентов

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

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

Kevin Kreuzer ответил на все эти вопросы.

👉 https://kevinkreuzer.medium.com/angular-component-library-best-practices-a8318bae6257

🚀 Познаем реактивность

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

👉 https://habr.com/ru/company/timeweb/blog/586450/

🚀 Делаем телеграф c RxJS и Angular

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

Давайте вместе создадим работающую демонстрацию, которая выглядит и звучит великолепно. Поехали!

👉 https://indepth.dev/posts/1481/rxjs-telegraph

🔍 Поиск по адресу с помощью Angular и Google Maps

Google Maps одно из самых известных приложений. Начиная с 9-й версии Angular, оно доступно в виде компонента, но все равно часто приходится обращаться к Google Maps API.

Kevin Kreuzer облегчил нам жизнь и показал, как реализовать карту Google с поисковой строкой и автозаполнением адреса.

👉 https://kevinkreuzer.medium.com/how-to-implement-an-address-search-with-angular-and-google-maps-32a2df09f8e9

⚡️ Мощь дженериков в TypeScript

Все еще не освоили дженерики? Тогда вам будет полезно узнать о их параметризации, научиться с помощью них типизировать переменные, функции и методы, а также классы. Узнать, как можно ограничить типы и при необходимости помочь TypeScript с выведением типов, использовав Type Guard.

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

👉 https://habr.com/ru/company/tinkoff/blog/588655/

💳 E-Commerce сайт на Angular

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

В этом руководстве рассказывается, как создать сайт электронной коммерции с помощью Angular. Сайт будет использовать Commerce Layer в качестве headless e-commerce API и Paypal для обработки платежей.

👉https://www.smashingmagazine.com/2021/07/ecommerce-angular11-headless-paypal/

✨ Template Literal Types в TypeScript

Template Literal Types динамически определяет новые литеральные типы со всеми возможными комбинациями. Таким образом, вы можете быстро создавать типы из других. Typescript также поставляется с утилитами для работы со строками, которые помогают преобразовать строковые литералы.

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

👉 https://betterprogramming.pub/mastering-typescript-template-literal-types-f4131a94ffb1