Skip to Content
Engineering11 Documentation 🔥
FrontendOverview

Frontend — Engineering11 Full-Stack Foundation

The Foundation provides comprehensive frontend support across multiple frameworks and platforms, enabling teams to build modern, responsive applications with consistent patterns and integrated platform services.

Overview

The Foundation’s frontend ecosystem provides:

  • Seed Applications for Flutter, Angular, React, and React Native
  • Shared Component Libraries for consistent UI/UX across each platform
  • Authentication & Authorization patterns integrated with the Foundation backend
  • White-Label Theming systems for multi-tenant customization
  • Build & Deployment tooling for CI/CD across web and mobile

Platforms

Flutter

  • Composable SDK platform (25+ packages) managed by Melos
  • Abstract DI, typed SDK initialization, module facade pattern
  • 140+ widget E11 UI library with white-label tenant theming
  • GitHub Actions CI/CD to TestFlight and Google Play

Explore Flutter Mobile →

Angular

  • Nx monorepo with 26 publishable SDK libraries
  • ~65 custom e11- prefixed UI components (no Angular Material dependency)
  • NgRx ComponentStore for reactive state management
  • CSS design token system with runtime white-label theming
  • Cloud Build + Firebase Hosting CI/CD with conventional commits

Explore Angular Web →

React

  • Next.js 15 with App Router and server-side auth
  • pnpm + Turborepo monorepo (~24 shared packages)
  • ShadCn/Radix UI components with Tailwind v4 and CVA variants
  • TanStack Query data layer with Firestore realtime subscriptions
  • Vitest for testing, Storybook with Chromatic visual regression

Explore React Web →

React Native

  • Expo 54 with file-based routing (Expo Router 6)
  • Shared Foundation packages with React web (~24 packages)
  • ~35+ E11-themed native components
  • Biometric auth, OTA updates, EAS Build CI/CD

Explore React Native Mobile →

Shared Principles

Across all platforms, the Foundation emphasizes:

  • Feature-based module structure — code is organized by domain feature, not by file type
  • Backend integration — each platform has typed SDK packages or clients for Foundation backend services
  • White-label theming — theming systems support per-tenant customization from server configuration
  • Error handling — structured error types and centralized error monitoring (Rollbar)
  • Layered architecture — shared Foundation packages → optional product SDKs → product applications

What You Build

While the Foundation provides the infrastructure, your team builds:

  • Product-specific UI and user workflows
  • Custom components for your domain
  • Business logic in the frontend
  • Integration with your custom backend services
  • Branding and visual identity

Next Steps

  • Architecture — How the layered architecture works across platforms
  • Platforms — Deep-dive into each platform’s capabilities
  • Capabilities — Authentication, theming, error handling, state, testing, performance, build/deploy, component libraries, and SDKs
  • Backend Documentation — Understand the APIs you’ll integrate with
  • Foundation Overview — See the complete platform capabilities
Last updated on