🦊 Angular Fox 🚀 — русскогорящие новости сообщества
3.97K subscribers
1.19K 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 — это компонентная природа фреймворка. Компоненты — это блоки для построения масштабируемых приложений. Однако иногда одних компонентов недостаточно.

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

👉 https://medium.com/p/b7fcba2f5f38
👍8🔥3
Плюсы и минусы TypeScript

Выразительность TypeScript позволяет делать умопомрачительные вещи. Вы можете не просто сказать, что функция вернет какое-то значение, а описать, что конкретно она будет возвращать даже для частных случаев.

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

👉 https://habr.com/ru/company/oleg-bunin/blog/660683/
👍7
Реализуем прогресс бар

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

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

👉 https://medium.com/p/ae6299e86bc7
👍12
HolyJS — конференция для JavaScript-разработчиков от JUG Ru Group

Online-часть:
8–10 июня.
Offline-день: 23 июня.

В online вас ждут выступления, посвященные трендам и новым технологиям, обмен опытом и общение в чатах.
На offline-дне в Санкт-Петербурге можно вживую послушать спикеров, лично познакомиться с коллегами и потусоваться у стендов партнеров.

В программе:
– Каким бывает легаси во фронтенде, как с ним справляться и не допускать его появления.
– Что такое proposal Wasm GC, почему его так долго делают и какой путь прошли движки за 2 года экспериментов.
– Как построить дизайн-систему для продукта с 20-миллионной аудиторией, огромной кодовой базой и массой поверхностей.
– Что такое сложность для человеческого мозга и как эти знания помогают писать более понятный код.

Для подписчиков канала организаторы сделали промокод, который поможет вам купить персональный билет со скидкой: angularfox2022JRGpc

👉 Билеты, подробности и первая программа — на сайте.
👍8👎6🔥2
Angular Universal в e-commerce проектах

Про Angular Universal написано довольно много, но мало примеров настройки в больших e-commerce проектах, где есть свои нюансы.

Дмитрий Дружков рассказал, чем полезен Angular Universal в e-commerce проектах, как выбрать вид рендеринга и как выглядит первоначальная настройка.

👉 https://habr.com/ru/company/utkonos/blog/663518/
👍11🔥8
Осваиваем NestJS

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

Игорь Агапов опираясь на структуру и содержание официальной документации рассмотрел основы работы с Nest.

👉 https://habr.com/ru/company/timeweb/blog/663234/
👍21🔥2
Изучаем операторы в RxJS

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

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

👉 https://dev.to/this-is-learning/understanding-rxjs-use-cases-part-ii-51ll
👍14🔥5
Разрабатываем пакетный менеджер

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

Игорь Агапов разработал простой пакетный менеджер на Node.js и TypeScript.

👉 https://habr.com/ru/company/timeweb/blog/662830/
👍15
Стилизуем проецируемый контент

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

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

👉 https://medium.com/p/731c0721902f
👍22
Лучшие практики в NgRx

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

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

👉 https://medium.com/p/6c837fb14877
👍15👎7🔥1
Кэшируем данные с помощью RxJS

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

RxJS предоставляет нам простой способ создания кэша и его хранения. Операторы share и shareReplay, позволяют не запрашивать данные каждый раз.

👉 https://dev.to/this-is-angular/how-caching-data-in-angular-with-rxjs-27mj
👍18🎉1
TechTrain 2022 Spring — бесплатный онлайн-фестиваль для всех разработчиков

Дата: 14 мая
Начало — в 11:45 (Мск, GMT+3)

Сезон конференций от JUG Ru Group традиционно начинается с TechTrain. В программе — 8 докладов по разным направлениям: технологии видео и стриминга, тестирование, .NET, мобильная разработка, JavaScript, параллельные и распределенные системы, Java, C++.

В рамках JavaScript-направления будет доклад «Electron + Node.js = ❤️».

👉 Подробности и регистрация — на сайте фестиваля.

Кстати, конференция по JavaScript, HolyJS пройдет 8 — 10 июня. Напоминаем вам промокод, с ним можно купить персональный билет дешевле: angularfox2022JRGpc

👉 Подробности на сайте.
👍7🔥2🎉1
Стилизуем вложенные компоненты

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

Игорь Мотовилов рассмотрел три варианта стилизации компонентов.

👉 https://habr.com/ru/post/665040/
👍14🔥5
Итерация по объекту в TypeScript

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

Stefan Baumgartner рассказал как TypeScript старается спасти ваш код от ошибок.

👉 https://fettblog.eu/typescript-iterating-over-objects/
👍8🔥4
Изучаем автономные компоненты

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

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

👉 https://medium.com/p/f4fc50bed6cf
👍12🔥3🤩1
Создаем оповещения на RxJS

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

В этом руководстве вы узнаете, как сделать простой, элегантный компонент Alert, используя RxJS, Angular и Bootstrap.

👉 https://medium.com/p/69134162c8b2
👍10🔥4
Загружаем файлы с помощью RxJS

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

В этой статье рассмотрено использование bindCallback, scan, mergeMap, takeWhile и AsyncPipe для создания полностью реактивного элемента управления загрузкой файлов.

👉 https://medium.com/p/34262b3450ae
👍12🔥5
🔥 Повышаем отказоустойчивость

Иногда требуется, чтобы веб-приложение работало непрерывно 24 часа, 7 дней в неделю, круглый год, без остановок, с выводом данных в режиме реального времени. Такие условия требуют особых подходов к обеспечению стабильности и отказоустойчивости.

Илья Сахаров поделился опытом разработки фронтенда в экстремальных условиях.

👉 https://habr.com/ru/company/lanit/blog/665592/
🔥8👍6
30 мая стартует новый сезон конференции Techlead Crew.

Тема недели — «Continuous Delivery» или подходы и инструменты непрерывной поставки кода. Будет интересно не только техлидам, но всем, кто хочет выкатывать релизы в продакшен часто, быстро, качественно и с минимальными рисками для бизнеса.

За неделю сессий вы:
🔥 Разберетесь в аббревиатурах CI\CD\QA\QC.
🔥 Узнаете все про A\B тестирование и стратегии деплоймента.
🔥 Научитесь собирать и тестировать нефункциональные требования на поставку вместе с экспертами из Bolt, AWS и Scentbird.
🔥 Оцените перспективность микрофронтенд-технологий на круглом столе.
🔥 Узнаете, как выстроены CD процессы, выкатка новых фич, A\B тестирование и проверка качества в компаниях мирового уровня.

Если вы еще ни разу не были на Podlodka Crew, то самое время попробовать!

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

С нетерпением ждем на борту!

👉 Подробное расписание и билеты с хорошей скидкой уже на сайте!
👍4🔥1
🔥 Розыгрыш билета Podlodka Crew

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

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

Конференция состоится 30 мая - 03 июня

💖 Желаем удачи всем участникам
👍14🔥1