Все потоки
Поиск
Написать публикацию
Обновить
17.45

Angular *

JavaScript-фреймворк

Сначала показывать
Порог рейтинга
Уровень сложности

Я хотел улучшить React

Уровень сложностиСредний
Время на прочтение8 мин
Количество просмотров10K

Я давно пишу код, а React использую более пяти лет.

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

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

А о том, что из этого вышло, я бы хотел рассказать в этой статье.

Читать далее

Как сделать декларативный роутинг диалогов в Angular на примере Taiga UI

Уровень сложностиСредний
Время на прочтение6 мин
Количество просмотров5.3K

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

Часто на фронтенде нужно открывать модальные окна по определенному пути. Из коробки ангуляр не предоставляет такой возможности, так же как и популярные ui-kit-библиотеки. И разработчики каждый раз ищут способ, как это сделать.

Читать далее

Наблюдение за температурой: введение в холодные и горячие Observable в rxjs

Уровень сложностиПростой
Время на прочтение4 мин
Количество просмотров20K

По мере изучения RxJS разработчик рано или поздно сталкивается с такими понятиями, как cold и hot observable. А на технических собеседованиях в команды, которые используют RxJS, можно услышать вопросы по этой теме.

Например, чем горячий поток отличается от холодного? Можно ли холодный поток превратить в горячий и наоборот? И если да, то как это сделать?

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

Читать далее

Способы создания авторизации на сайте. Руководство с примерами. Безопасность в браузере

Уровень сложностиСредний
Время на прочтение14 мин
Количество просмотров65K

В данной статье мы разберем 4 способа как зарегистрировать нового пользователя:

1.Сторонние сервисы авторизации (такие как Google)

2.Авторизация с использованием токенов

3.Авторизация с помощью номера телефона

4.Логин + Пароль

Статья даст вам конкретный алгоритм реализации каждого способа. Необходимые библиотеки, а также примеры кода. Я постараюсь приводить в пример реализацию на чистейшем JavaScript, для того чтобы вы смогли внедрить функционал в свое проект, не зависимо от используемого фреймворка, однако также будут примеры для тандема Angular + Asp .Net Core. Мы обсудим как защитить ваш сайт от взлома. На сколько это сложно и возможно ли в принципе гарантировать 100% защиту. Итак, давайте приступим.

Читать далее

История о том, как мы на Module Federation съезжали. Часть 2

Уровень сложностиПростой
Время на прочтение7 мин
Количество просмотров4.8K

Привет! С вами снова Максим. Во второй части будет о том, что мы придумали.

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

Читать вторую часть

Signals – новая веха развития Angular

Уровень сложностиСложный
Время на прочтение9 мин
Количество просмотров38K

Angular Signals является частью будущей спецификации 16-й версии Angular. В первую очередь Signals нацелены на решение проблемы с обнаружением изменений в Angular, однако Angular Team позаботилась и о том, чтобы разработчики смогли не только писать более оптимальный код с точки зрения самого фреймворка, но и чтобы самим разработчикам было удобнее и приятнее писать код на Angular. Сигналы предлагают более декларативный подход для написания приложений, позволяя новичкам быстрее вкатываться в Angular и по-новому посмотреть на использование RxJs в своём приложении.

Читать далее

Архитектура front-end приложений — react, react native, angular. Обзор

Уровень сложностиПростой
Время на прочтение8 мин
Количество просмотров52K

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

Когда я провожу собеседование на позицию React разработчика, обычно задаю общий вопрос об архитектуре - "как бы ты строил архитектуру своего приложения и почему?". После обсуждения, я начинаю рассказывать небольшую часть материала из этой статьи, 5% по содержанию, приводя тезисы, по которым можно будет собрать общую картину моего видения. И обычно получаю положительную обратку. Поэтому решил изложить этот материал более развернуто здесь. Буду отправлять ссылку тем, кому это может пригодиться.

Читать далее

Кастомная стратегия виртуального скроллинга для просмотра pdf

Уровень сложностиСредний
Время на прочтение13 мин
Количество просмотров3.8K

Angular CDK имеет широкие возможности для скроллинга плоского списка. Если размер каждого элемента одинаков, то можно воспользоваться FixedSizeVirtualScrollStrategy: всего лишь нужно прокинуть размер элемента в пикселях, проитерироваться по данным и виртуальный скроллинг готов. Но что делать, если размер элементов разный? Данную проблему можно решить кастомной стратегией виртуального скроллинга. В данной статье мы рассмотрим как построить такую стратегию для pdf-документов.

Читать далее

Как мы выбирали технологию для фронтенда и что из этого вышло

Время на прочтение8 мин
Количество просмотров6.7K

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

Читать далее

Angular. Работа с template-driven формами

Уровень сложностиСредний
Время на прочтение4 мин
Количество просмотров4.5K

Разработчики angular, как правило знают, что для работы с формами существует два подхода: reactive forms и template driven forms. Также, хорошо известно, что для работы с формами разработан такой функционал как валидация, однако исчерпывающе описано его применения для подхода reactive forms. Давайте рассмотрим как можно получить те же преимущества для template driven подхода.

Читать далее

Angular — API композиции директив

Уровень сложностиСредний
Время на прочтение5 мин
Количество просмотров6.9K

Поговорим о новом (уже старом) способе управления директивами в Angular

Читать далее

История о том, как мы на Module Federation съезжали. Часть 1

Уровень сложностиПростой
Время на прочтение5 мин
Количество просмотров4.8K

Всем привет! На связи Максим Смирнов, архитектор по фронтенду в Тинькофф. В серии статей будет история о том, как мы переписывали один из монолитных сервисов на Federation.

Расскажу о том монолите, который переписали, и как дошли до момента, что надо распилиться. Еще покажу, какие фишки мы накрутили в Module Federation, потому что из коробки многих фич нет, надо докручивать самим. Добро пожаловать под кат!

Читать далее

Управление подписками: много слов о потоках, отписках и утечке памяти

Уровень сложностиСредний
Время на прочтение12 мин
Количество просмотров5.7K

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

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

Читать далее

Ближайшие события

Разница между debounceTime и throttleTime

Время на прочтение3 мин
Количество просмотров6.6K

В этой статье я хочу рассказать тонкую разницу между операторами debounceTime и throttleTime простыми словами

Читать далее

Изучаем mergeMap, switchMap, concatMap и exhaustMap

Уровень сложностиСредний
Время на прочтение4 мин
Количество просмотров44K

Я Angular разработчик. Это моя первая статья и таких я собираюсь написать много. Пришла эта идея мне в голову потому что иногда, пытаясь найти какую-то информацию в интернете о принципах работы какого-либо инструмента разработки, я не нахожу абсолютно ничего. Это либо ненавистные обожаемые мною доки, в которых написаны очень краткие принципы работы для знающих людей, либо stackoverflow, где кто-то норовит написать кучу слов ни о чём или без практической составляющей, либо просто статьи, не отражающие сути. Но иногда можно наткнуться на знающего человека, который за одну минуту объяснит тебе всю суть и от счастья хочется прыгать. Я решил писать обо всех таких моментах, которые мне очень сложно давались в понимании из-за отсутствия адекватной информации или моей криворукости. Я буду писать подобные статьи прежде всего для себя и если кому-то это поможет - я буду безумно рад, что какому-нибудь камраду не пришлось долго мучиться и понимать смысл того или иного инструмента для разработки. Статьи будут максимально краткими и по делу. Погнали!

Читать далее

Подборка материалов для погружения в Angular: выбор сотрудников Selectel

Время на прочтение3 мин
Количество просмотров12K

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

Jest: error Command failed with exit code 1

Время на прочтение3 мин
Количество просмотров4K

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

По сути в этой публикации речь пойдет о функции done() в jest. Функция очень полезная, так как позволяет разработчику решать в какой момент будет закончен тест. Бывают ситуации, когда это действительно очень нужно. В новом проекте я столкнулся с такой задачей и решил просто описать то, как я её решил.

Читать далее

Big State Managers Benchmark

Время на прочтение9 мин
Количество просмотров11K

Здравствуйте, меня зовут Дмитрий Карловский и я.. большой любитель физики высоких энергий. Сталкиваешь такой совершенно разные вещи между собой, и смотришь на бабахи, уплетая поп-корн.

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

Что ж, давайте возьмём их всех и столкнём лбами друг с другом и с суровой реальностью, чтобы узнать кто же на самом деле тут батя!

Мне больше 18 и я готов к последствиям

Год Тигра в Taiga UI

Время на прочтение8 мин
Количество просмотров5.4K

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

Весь год я участвовал в разработке потрясающего продукта — Taiga UI. Это библиотека компонентов на Angular, на которой построены сотни продуктов Тинькофф и много других проектов. Наша команда потратила много времени и сил — расскажу, что из этого получилось.

Читать далее

Redux в Angular. Туда и обратно

Время на прочтение29 мин
Количество просмотров9.4K

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

Читать далее