Pull to refresh
39
0
Игорь Кацуба @Katsuba

Frontend-developer

Send message

RxJS: как операторы высшего порядка упрощают код

Level of difficultyEasy
Reading time7 min
Views6.5K

Если вы работали с Angular, то наверняка встречались с RxJS. Потоки, развесистые конструкции, много аргументов у метода pipe, а каждый аргумент возвращают разные функции с разным количеством аргументов. Есть интуитивно понятные функции типа filter или map. Первый явно фильтрует значения в потоке, а второй эти значения меняет. Такие функции называют операторами. И чем глубже вы проваливаетесь в RxJS, тем больше самых разных операторов вы узнаете. И со временем добираетесь до потоков потоков. То есть вместо обычных значений такой поток эмитит другие потоки. Такие потоки называют Higher Order Observables. И для работы с такими потоками существуют специальные операторы. Возможно, вы слышали, что такие операторы называют Higher Order Operators (HOO). Они могут выравнивать потоки или, другими словами, делать их обычным.

В этой статье я покажу, что в HOO нет ничего мифического, и расскажу в каких случаях вам нужно использовать операторы высшего порядка. Сейчас вы подумаете, что это скучный лонгрид, но не торопитесь. Мы рассмотрим всего 4 оператора: switchMap, exhaustMap, concatMap и mergeMap.

Читать далее
Total votes 6: ↑4 and ↓2+2
Comments3

Перерождение Lerna. Что нового в Lerna 6?

Reading time5 min
Views4.1K

Состоялся релиз Lerna 6!!! В статье собрано все, что вы должны знать о новом опыте, который предлагает Lerna!

Lerna продолжает развиваться. Если вы и так это знаете, то можете не читать дальше. Но многие все еще не слышали, что Lerna вернулась, не устарела и даже получает новые фичи. Мы из Nrwl являемся создателями Nx, и, учитывая нашу экспертизу в монорепозиториях, мы предложили взять на себя развитие Lerna, когда она была объявлена "мертвой" в апреле 2022 года.

Когда мы получили управление над Lerna начались настоящие американские горки. Мы запустили совершенно новый сайт, обновили документацию и сделали Lerna в 10 раз быстрее. И вот, Lerna 6 вышла!

Читать далее
Total votes 4: ↑2 and ↓20
Comments3

Эволюция репозитория: от простого к сложному

Reading time10 min
Views2K

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

Меня зовут Игорь Кацуба, я лид Core команды в Tinkoff Business. Поделюсь своим опытом, расскажу какие этапы развития нам приходится проходить, чтобы получить результат и что мешает двигаться дальше. А также узнаем про принцип цикличности, на котором и основаны все этапы. Поехали…

Читать далее
Total votes 5: ↑4 and ↓1+3
Comments1

Как мутировать код в Angular-схематиках и не поседеть

Reading time7 min
Views3.8K

Чтобы использовать Angular CLI на полную, разработчики должны знать, что такое схематики. Например, команды ng add, ng update и ng generate используют схематики для добавления, обновления и настройки библиотек и кодогенерации в приложениях. Во время выполнения схематика вы получаете доступ к файловой системе и можете мутировать исходный код приложения так, как вам нужно. «Но, чтобы мутировать код, нужно работать с AST, а это сложно», — возможно, скажете вы, и будете правы!

В этой статье расскажу, как мы пытаемся упростить работу с AST и сделать написание схематиков обыденным. А еще покажу, что так же просто можно работать с AST не только в Angular-проектах, а практически в любом проекте на JavaScript/TypeScript.

Читать далее
Total votes 15: ↑15 and ↓0+15
Comments0

Angular Universal: проблемы реального приложения

Reading time9 min
Views17K

Angular Universal — это опенсорсный проект, который расширяет функциональность @angular/platform-server. Он делает возможным Server Side Rendering в Angular. В этой статье мы обсудим проблемы и возможные решения, с которыми мы столкнулись при разработке реального приложения с Angular Universal.

Читать далее
Total votes 26: ↑26 and ↓0+26
Comments5

Обзор npm 7

Reading time5 min
Views13K

13 октября состоялся релиз npm@7.0.0. Релиз носит экспериментальный характер и доступен для скачивания из публичного npm-реестра с тегом next-7. Также npm 7 поставляется вместе с node.js 15.

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

Читать далее
Total votes 26: ↑26 and ↓0+26
Comments0

Как мы распилили монолит. Часть 4. И как Angular между приложениями пошарили

Reading time8 min
Views7.2K

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

Если коротко, то мы создали решение, которое позволило в рамках одной открытой страницы браузера запускать несколько независимых Angular-приложений, шарить между ними данные, управлять роутингом и аутентификацией. Мы научились бороться с утечками памяти и решать конфликты глобальных стилей приложений. Но одна проблема оставалась открытой — каждое приложение несло в своем банде Angular, RxJS, zone.js и т. д. И в этой статье я расскажу, как мы ее решили.

Читать далее
Total votes 21: ↑21 and ↓0+21
Comments7

Возможности Angular DI, о которых почти ничего не сказано в документации

Reading time6 min
Views37K

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

Читать далее
Total votes 31: ↑31 and ↓0+31
Comments10

Как перестать бояться и создать свой Angular CLI Builder

Reading time6 min
Views5.2K


Всем привет! Меня зовут Игорь, я — фронтэндер в Tinkoff.ru. И, как ни странно, я давно и безнадежно прикипел к Angular и ко всему, что с ним связано.


Очень хорошо помню свои первые проблемы со сборкой приложения на Angular: как передать в приложение переменные окружения или изменить алгоритмы сборки стилей? Я так к этому привык при работе с React. И сначала это решали с помощью ng eject: конфигурация webpack просто извлекалась из недр Angular CLI и изменялась как душе разработчика угодно. Выглядело это как костыль — webpack.config.js был раздутым и сложным. Но, когда Angular CLI v8.0.0 принес нам стабильный CLI Builders API, который позволяет кастомизировать, заменять или даже создавать новые CLI команды, все стало проще.


Сейчас самый популярный билдер для кастомизации конфигурации webpack — @angular-builders/custom-webpack. Если заглянуть в исходники всех билдеров, поставляемых пакетом, можно увидеть очень компактные решения, не превышающие и 30 строк кода.


Го тогда запилим свой? Challenge Accepted!

Читать дальше →
Total votes 24: ↑24 and ↓0+24
Comments0

Information

Rating
Does not participate
Location
Лимассол, Government controlled area, Кипр
Date of birth
Registered
Activity