Resume

Arnab Banerji

AI-native Principal Engineer | Frontend Architecture, Engineering Systems & Design Systems

Bengaluru, India·reach.arnab@live.in·thearnab.com

Updated 2026-07-09

Summary

  • AI-native Principal Engineer with 10+ years of experience designing frontend architecture, engineering systems, and product foundations for complex enterprise software.
  • Treats AI as an engineering multiplier: specification-first development, context routing, agent-driven implementation, review loops, guardrails, and verification workflows.
  • Owns frontend direction for feature-heavy fleet-management dashboards in an AI, ML, IoT, and cloud product environment.
  • Builds design-system foundations, component standards, accessibility patterns, performance practices, and release guardrails that help teams ship consistently.
  • Brings product thinking into architecture decisions, including timezone behavior, i18n workflows, map-heavy UX, API contracts, and backend-query reduction opportunities.
  • Mentors engineers and creates agent-friendly standards, reusable prompts, and delivery workflows that raise the quality of the whole team.

Experience

Principal Engineer at Netradyne Technologies India Pvt. Ltd.

Owns frontend architecture, engineering systems, and delivery standards for Netradyne dashboard products in a fleet-management suite powered by AI, ML, IoT, and cloud systems.

  • Defines frontend direction for two feature-heavy dashboards: a customer-facing product dashboard and an internal operations dashboard.
  • Leads AngularJS-to-modern-Angular architecture across Angular 11, Angular 19, and Angular 22 while preserving delivery continuity.
  • Drives platform work across design-system foundations, navigation, i18n, accessibility, performance, map-heavy workflows, video-heavy workflows, and release-readiness tooling.
  • Builds AI-assisted engineering workflows around Figma, Atlassian, analytics, feature intelligence, context routing, reusable prompts, and agent verification.
  • Turns product observations into technical direction across timezone behavior, i18n strategy, map UX, API contracts, and backend-query reduction opportunities.
  • Built systems for frontline teams that reduced manual effort at scale and contributed to multimillion cost reduction.
  • Establishes engineering guardrails through SonarQube, custom ESLint configuration, automated code-review checks, targeted validation scripts, and AI-friendly development standards.
  • Mentors front-end engineers through design reviews, architecture reviews, code review systems, and shared component governance.
AngularAngularJSTypeScriptRxJSSignalsSCSSAngular MaterialNG BootstrapPrimeNGMapboxOpenSearchREST APIsi18nAccessibilityPerformanceESLintSonarQubeFigmaAtlassianAnalyticsAgent WorkflowsContext EngineeringAI VerificationVitestKarmaJasmineNodeJS

Consultant at Deloitte

Maintained and modernised the primary web platform for a major US healthcare provider, working across Drupal-backed content systems and reusable frontend components.

  • Built reusable UI components for a Drupal-backed enterprise web platform.
  • Developed search experiences using React and modern frontend tooling.
  • Worked across Drupal 6, Drupal 7, and Drupal 8 upgrade paths for large content platforms.
  • Planned and executed a Drupal 7 to Drupal 8 migration in under one year while keeping Lighthouse performance scores above 80.
  • Delivered AngularJS-to-React modernisation work for search and content experiences.
  • Created a sitemap-driven visual regression tool that reduced manual testing effort by roughly 2000 hours.
Drupal 6Drupal 7Drupal 8PHPReactAngularAngularJSTypeScriptJavaScriptNodeJSWebpackSCSSHTMLCSS

Software Engineer at LearningMate Solutions Private Ltd.

Built web-based learning applications, widgets, and tooling using HTML5-era browser capabilities, JavaScript frameworks, testing, and CI/CD.

  • Built applications, widgets, and tools for web-based learning using HTML5, JavaScript, jQuery, and AngularJS.
  • Migrated legacy Flash and Java applet learning experiences to JavaScript-based browser applications.
  • Added unit testing through Karma and Jasmine and contributed to CI/CD implementation.
  • Developed a Flash-to-HTML5 conversion tool that supported migration of more than 15000 widgets.
HTML5CSS3JavaScriptjQueryAngularJSKarmaJasmineJavaSpring BootPostgreSQLWeb WorkersNodeJS

Featured Systems

AI-native Engineering Workflow

An engineering system that treats AI as a first-class development participant: specs, context routing, coding agents, review loops, guardrails, and verification.

  • Defined specification-first workflows that turn product, design, and repository context into implementation-ready packets.
  • Built agent workflows around Figma, Atlassian, analytics, and feature intelligence so AI-assisted delivery starts with the right context.
  • Created reusable prompts, coding standards, and guardrails to keep generated work inside team conventions.
  • Added review and verification loops through focused tests, browser proof, code review checks, and targeted validation scripts.
Coding AgentsContext EngineeringPrompt EngineeringAI SpecificationsAI VerificationGuardrailsFigmaAtlassianGitHubVitestPlaywright

Enterprise Dashboard Architecture

Architecture direction for customer-facing and internal fleet-management dashboards with legacy coexistence, Angular modernization, routing, state, i18n, and release discipline.

  • Defined boundaries for feature-heavy dashboards where maps, alerts, tables, permissions, video, and operational workflows must coexist.
  • Led AngularJS-to-modern-Angular modernization across multiple Angular generations without freezing product delivery.
  • Established routing, component ownership, state models, and validation practices that make large product surfaces easier to change.
  • Created release-readiness tooling and targeted checks so teams can ship dashboard changes with stronger confidence.
AngularAngularJSTypeScriptRxJSSignalsSCSSi18nAccessibilityCI/CDVitestKarma

Design System and Component Governance

Design-system foundations and component governance for dense SaaS dashboards where reusable patterns must preserve product meaning, accessibility, and visual consistency.

  • Defined component APIs around product language instead of styling switches, so templates read like workflow decisions.
  • Connected design tokens, Figma usage, theme foundations, accessibility, and reusable component patterns into delivery standards.
  • Reviewed designs and implementation plans for consistency, responsive behavior, and long-term maintainability.
  • Balanced reusable primitives with product-specific patterns so the design system speeds delivery without flattening important differences.
Design TokensFigmaAngularTypeScriptSCSSAngular MaterialNG BootstrapPrimeNGAccessibilityTheme Systems

Large-scale Data Visualization and Real-time UX

Performance and interaction architecture for map-heavy, video-heavy, alert-driven dashboards where users need real-time context without losing scanability.

  • Designed UI structures for live alerts, map-heavy workflows, video playback, large datasets, dense tables, and repeated operational actions.
  • Kept expensive transformations out of repeated render paths and made loading, stale, partial, and error states explicit.
  • Pushed map and alert experiences toward clearer aggregation, better backend contracts, and more useful product states.
  • Focused performance work on user trust: stable context, predictable actions, fast scanning, and recoverable failures.
AngularTypeScriptRxJSMapboxOpenSearchVideo PlaybackVirtualizationLazy LoadingPerformance ProfilingREST APIs

Product Engineering and API Direction

Cross-functional product and architecture work that turns workflow problems into better UI behavior, backend contracts, search strategy, and team standards.

  • Reframed timezone handling as a product and platform concern rather than a local formatting issue.
  • Proposed i18n workflow improvements that reduce translation drift and make runtime behavior easier to verify.
  • Identified backend-query and API-contract improvements from frontend workflow pain points.
  • Used problem-observation-proposal-impact framing to move product decisions beyond ticket-by-ticket implementation.
Product ArchitectureAPI DesignRESTOpenSearchSQLi18nTimezone SystemsAnalyticsUX ReviewArchitecture Review

Engineering Standards and Quality System

Repository-level standards, documentation, code review practices, and automated checks that help engineers and coding agents ship with stronger consistency.

  • Defined architecture guidance, development rules, and context-routing documents that make repository ownership easier to understand.
  • Added custom ESLint, SonarQube, code-review, and validation checks for high-risk frontend changes.
  • Built team workflows for design review, implementation review, and AI-assisted verification.
  • Mentored engineers through reusable examples, PR review patterns, and clearer standards for component and route ownership.
Architecture DocumentationESLintSonarQubeVitestKarmaJasmineCI/CDCode ReviewContext RoutingEngineering Governance

Organisation-scale Application Modernisation

Career-long modernization track record upgrading legacy application estates across learning platforms, healthcare content systems, and fleet-management dashboards.

  • Moved browser learning experiences from Flash and Java applets to JavaScript and HTML5.
  • Worked through Drupal 6, Drupal 7, and Drupal 8 transitions for large content platforms.
  • Modernized AngularJS applications into React and modern Angular generations.
  • Built automation, testing, and quality gates around migrations so teams could move faster without losing reliability.
JavaScriptHTML5AngularJSAngularReactDrupalPHPNodeJSCI/CDAutomated TestingVisual Regression

The 1 Hz Computer

Educational binary CPU simulator built as an Angular application, focused on making low-level computing visible through registers, memory, instruction decode, compiler stages, pipeline state, IO, and timeline inspection.

  • Built a browser-based simulator with CPU, memory, registers, ALU, decoder, assembler, compiler, input/output devices, and execution timeline concepts.
  • Designed inspector surfaces for program memory, binary diffs, instruction decode, compiler stages, pipeline state, and machine snapshots.
  • Uses a standalone Angular application structure suitable for embedding as a portfolio showcase.
Angular 21TypeScriptRxJSVitestSCSS

Skills

AI-native Engineering

Agent-driven implementationSpecification-first developmentContext engineeringContext routingPrompt systemsAI review loopsAI verificationEngineering guardrailsReusable promptsLocal AI infrastructure exploration

Frontend Architecture

AngularAngularJSReactTypeScriptRxJSSignalsRouting architectureState ownershipComponent systemsLegacy coexistenceModernisation strategy

Design Systems

Design tokensComponent API designTheme foundationsAccessibilityResponsive systemsFigma integrationAngular MaterialNG BootstrapPrimeNGUI quality governance

Performance and Real-time UX

Rendering optimizationBundle optimizationLazy loadingLarge datasetsVirtualizationMap-heavy workflowsVideo playbackLive alertsStreaming statesMemory optimization

Product and API Thinking

Outcome ownershipProblem framingTimezone behaviori18n workflow designBackend API contractsOpenSearch workflowsBackend-query reductionMap UX redesignOperational workflow design

Engineering Standards

Architecture documentationCoding standardsCode review systemsESLintSonarQubeVitestKarmaJasmineCI/CD quality gatesRelease-readiness checks

Enterprise Modernisation

Flash to JavaScriptJava applets to JavaScriptDrupal 6 to Drupal 7 to Drupal 8AngularJS to ReactAngularJS to modern AngularMigration planningAutomation around migrationsVisual regression automation

Education

Master of Science, Computer Science

Bachelor of Computer Applications, Computer Applications