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
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
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
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
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