Шашанк Агарвал

Staff / Principal Frontend

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

Шашанк Агарвал

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

Импакт

Плотные высокопроизводительные канвасы

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

  • Для iAnalyse я написал свою сводную таблицу на Angular. Аналитики группировали по обеим осям и листали тысячи сворачиваемых строк и десятки колонок при 60 FPS.
  • В Butlerapp Dashboard полностью управляемая бэкендом сетка рендерит островки виджетов и элементов форм. Островки реагируют на изменения полей и подстраиваются под настраиваемую адаптивную раскладку.
  • TaylorDb нужен был канвас-датагрид, построенный с нуля под его требования к производительности: живая сетка на десятки тысяч строк, которую питает GraphQL через WebSockets. Ячейки не ограничены текстом и числами: списки, аватары, чекбоксы, чипы или файлы. Правки на месте и взаимодействия идут с optimistic updates и глобальными undo и redo.

Встраиваемый, модульный UI

Я отдаю UI, который чужие сайты и другие продукты могут встроить и достраивать вокруг него.

  • Butlerapp Booking Form — набор web components, который приводит бронирования в Butlerapp Dashboard. Он живёт больше чем на двухстах сайтах клиентов и приносит тысячи бронирований в месяц. Хосты могут встроить форму бронирования, календарь записи, карточки офферов, аккордеоны офферов, таблицу офферов, корзину и виджеты логина.
  • Внутренние продукты Webbee выходят на react-native-molecules, наборе компонентов, который я спроектировал, пока вёл TaylorDb.
  • json-schema-form переносит ту же идею в open source: валидность и раскладку описываешь отдельно, а свой рендерер пишешь только там, где дефолтов не хватает.

Планирование UI

Я рано выясняю, что интерфейс должен считать сам, чтобы продукт обещал только то, что может выполнить.

  • Я спроектировал фронтенд-архитектуру TaylorDb с запасом на будущее: готовая система плагинов лениво подгружает плагины, известные только во время выполнения, так что новые возможности выходят без правок ядра.
  • SchnellTestButler считал доступность сам: слоты по две минуты, впритык, на протяжении пятнадцатичасовых рабочих дней, с учётом праздников, занятых окон и пересекающихся рабочих часов. На пике им пользовались 1 500 тест-центров. Ещё мы выпустили React Native check-in, раннюю версию ticketing-продукта.

Проекты

shashankagarwal.devshashankagarwal.devэтот проект

Astro · Puppeteer · TypeScript · CSS Grid

Это CV: три языка, вёрстка как в печати и PDF, собираемый на этапе сборки.

json-tree-editorпобочный проект

SolidJS · TypeScript · Web Component

Редактор JSON-дерева для Solid и как web component для любого другого стека. Исходная строка остаётся документом; дерево никогда не становится второй правдой.

json-schema-formпобочный проект

React · JSON Schema · UI Schema · TypeScript

Формы на React из JSON Schema. UI-схема отвечает за раскладку, а свои рендереры подключаются только там, где дефолтов не хватает.

react-native-moleculesс Webbee

React Native · TypeScript

Библиотека компонентов React Native, ставшая внутренней дизайн-системой Webbee, пока я вёл TaylorDb.

Dashboardхобби, в разработке

SolidJS · TanStack Query · Router

Хобби-конструктор дашбордов и процессов на своих данных. Ещё не выпущен.

Опыт работы

Ведущий инженер Front-End · Webbee GmbH

Август 2020 – Настоящее время

Минск, Беларусь

Я отвечаю за фронтенд двух продуктов: Butlerapp, менеджера бронирований с CRM, и TaylorDb, конструктора приложений на AI. Архитектура, поставка и команда, которая это выпускает.

  1. Butlerapp Booking Form

    React · TypeScript · Redux Toolkit Query · встраиваемые виджеты

    React-приложение, которое работает на 200+ сайтах-хостах и ведёт весь путь бронирования: поиск оффера, настраиваемый сценарий бронирования и управление бронированиями. Каждый месяц оно приносит бронирований на тысячи евро.

    • Виджеты поиска офферов вписываются в любой сайт-хост. Большую часть темизации берут на себя CSS-переменные, так что хосты подгоняют виджеты под свой бренд, не трогая наш код.
    • Тот же проект работает внутри Butlerapp Dashboard как микрофронтенд, а логика для сотрудников доступна только в аутентифицированной области.
  2. Butlerapp Dashboard

    React Native · Expo · NativeBase · системы виджетов

    Центр управления всем Butlerapp: бронирования, общение с клиентами, офферы, скидки, способы оплаты, локализация и другое.

    • Перевёл классовый React-дашборд в гибридное приложение на React Native, Expo и NativeBase и использовал переезд для полной переработки UX.
    • Спроектировал систему views. Операторы один раз сохраняют фильтры, сортировку и раскладку и открывают их одним кликом, вместо того чтобы собирать заново каждое утро.
    • Перевёл большие таблицы на Autodesk BaseTable, переработал фильтры в ранжированные чипы и построил сетку, управляемую бэкендом: островки виджетов и элементов форм в адаптивной раскладке, которую задаёт бэкенд.
    • Настроил GitHub Actions для CI/CD, чтобы тесты и деплой шли автоматически.
  3. SchnellTestButler

    React Native · Expo · NativeBase

    Butlerapp, заточенный под массовое COVID-тестирование: бронирования, тайминг очереди и передача результатов.

    • Построил движок доступности во фронтенде. Слоты по две минуты в 15-часовые дни, с праздниками, занятыми окнами и пересекающимися сменами прямо в календаре.
    • Выпустил в App Store и Google Play полевое приложение на React Native с QR-check-in и доступом к нескольким аккаунтам. На пике оно работало в 1 500 тест-центрах по всей Германии.
  4. TaylorDb — конструктор приложений на основе AI

    React Native · GraphQL · WebSockets

    Конструктор приложений на AI: no-code платформа, созданная внутри компании для быстрой разработки приложений.

    • Вёл фронтенд, пока TaylorDb рос из умной базы данных в конструктор приложений, а затем в конструктор на AI.
    • Собрал канвас с нуля: живая сетка на десятки тысяч строк и 20+ типизированных колонок, с inline-редактированием, optimistic updates и глобальным undo/redo.
    • Спроектировал слой данных для продукта, который стримит всё по GraphQL через WebSockets: слой загрузки и систему подписок, которые держат состояние клиента согласованным, пока события приходят наперегонки.
    • Довёл инженеров команды до самостоятельного senior-уровня и написал PRD для react-native-molecules, теперь это внутренняя дизайн-система.

UX Lead · Zycus India Pvt. Ltd.

Январь 2018 – июль 2020

Мумбаи, Индия · React · Angular 8

Zycus делает source-to-pay платформу для закупок. Я вёл фронтенд по всем продуктовым модулям, снял два из них с legacy-стеков и руководил командой из пяти фронтенд-инженеров.

  1. iAnalyse и CRMS

    Angular 8 · Highcharts

    • Вёл фронтенд-переписывание CRMS и iAnalyse с раздельных стеков PHP/jQuery и Java/jQuery на Angular 8, когда Zycus стандартизировал одну UX-платформу.
    • Довёл дашборд COVID-анализа расходов от двухдневного хакатон-POC до продакшена примерно за неделю. Он сравнивал расходы компании с отраслью, чтобы закупщики быстро находили выбросы.

Software Engineer II · Omnichanneler Technologies Pvt. Ltd.

Апрель 2017 – ноябрь 2017

Бангалор, Индия · React · Backbone.js

Retail POS и многоканальный инвентарь для магазинов, которые продают онлайн и офлайн.

  • Построил UI управления складом для магазинов, продающих через Shopify, Amazon, Flipkart и собственные точки, плюс B2B-сценарий для оптовых заказов.
  • Встроил онбординг QuickBooks и Tally в настройку, чтобы владельцы магазинов подключали бухгалтерию за один шаг.
  • Вёл пересборку ключевых экранов с Backbone.js на React: быстрее и проще в поддержке.

Ассистент Project Manager · Unlock Technologies Pvt. Ltd.

Сентябрь 2013 – апрель 2017

Мумбаи, Индия · jQuery · AJAX · HTML5 · CSS3 · Ionic

Сервисная компания: корпоративные сайты, e-commerce и мобильные приложения. Я открыл её мобильную продуктовую линейку и модернизировал работу команды.

  • Построил первые мобильные приложения компании на Ionic: кошелёк PayPointZ и приложение для дубайского арт-аукционного дома, что открыло новый поток клиентской выручки.
  • Сдавал продакшен-сайты и веб-приложения от wireframes до поставки и собрал переиспользуемые шаблоны витрин для Unlock Commerce.
  • Вёл онбординг и обучение клиентов и ставил цели кросс-функциональным командам поставки.
  • Внедрил Git вместо VSS и упорядочил процесс разработки.

Навыки

Основное
  • React
  • React Native
  • SolidJS
  • TypeScript
  • JavaScript
  • Node.js
Архитектура
  • Слоистые кодовые базы с разделением доменов
  • Переиспользуемые UX-паттерны
  • Web components и микрофронтенды
  • Плагинные архитектуры
  • SPA / SSR / SSG
  • Профилирование производительности
Состояние и данные
  • Redux
  • GraphQL
  • TanStack Query
  • TanStack Router
  • React Router
Стиль
  • CSS-in-JS
  • Tailwind
Качество
  • Разработка, управляемая тестами
  • Vitest
  • Playwright
  • Модульное / интеграционное / E2E тестирование
  • Storybook
  • Отладка
Платформы
  • Next.js
  • Expo
  • Reanimated / Gesture Handler
Мягкие навыки
  • Наставничество
  • Код-ревью
  • Инженерия на основе AI

Разговорные языки

Образование

Степень бакалавра наук в области информационных технологий

Университет Мумбаи, Мумбаи, Индия

2009
Пообщаемся?