⚠️ ALPHA RELEASE - This is an early alpha version under active development. We are actively testing on different machines and adding production deployment capabilities. Use at your own risk and expect breaking changes.
Area Code is a production-ready starter repository with all the necessary building blocks for building multi-modal applications with real-time analytics, transactional data, and search capabilities.
This setup is only needed if you want to use the AI Chat feature. The UFA application includes AI-powered chat functionality that requires an Anthropic API key:
- Get an API key: Visit console.anthropic.com to create an account and generate an API key
- Create a
.env.localfile in the transactional service directory (services/transactional-supabase-foobar/):ANTHROPIC_API_KEY=your-api-key-here
This enables the Sloan MCP (Model Context Protocol) which provides AI tools for intelligent data analysis and querying across your multi-modal backend.
Get up and running in minutes with our automated setup:
# 1. Install dependencies
pnpm install
# 2. Start development environment
pnpm ufa:dev
# 3. Seed databases with sample data (in a new terminal)
pnpm ufa:dev:seed
# 4. Open front-end
http://localhost:5173/This will:
- Seed transactional database with 1M foo records and 100K bar records
- Migrate data to analytical database (ClickHouse)
- Start Elasticsearch migration for search capabilities
- Restart workflows for real-time synchronization
# Development
pnpm ufa:dev # Start all services
pnpm ufa:dev:clean # Clean all services
pnpm ufa:dev:seed # Seed databases with sample data
# Individual services
pnpm --filter web-frontend-foobar dev # Frontend only
pnpm --filter transactional-supabase-foobar dev # Transactional API only
pnpm --filter analytical-moose-foobar dev # Analytical API only
pnpm --filter retrieval-elasticsearch-foobar dev # Search API only| Category | Technologies |
|---|---|
| Frontend | Vite, React 19, TypeScript 5.5, TanStack Router |
| Styling | Tailwind CSS v4, shadcn/ui, Lucide Icons |
| State Management | TanStack Query, TanStack Form |
| Database | PostgreSQL (transactional), ClickHouse (analytical) |
| ORM | Drizzle ORM |
| API Framework | Fastify (transactional), Moose (analytical) |
| Search | Elasticsearch |
| Real-time | Supabase Realtime |
| Build Tool | Turborepo, pnpm |
area-code/
├── ufa/ # User-Facing Analytics
│ ├── apps/ # Frontend applications
│ │ └── web-frontend-foobar/ # React + Vite frontend
│ ├── services/ # Backend services
│ │ ├── transactional-supabase-foobar/ # PostgreSQL + Fastify API
│ │ ├── analytical-moose-foobar/ # ClickHouse + Moose API
│ │ ├── retrieval-elasticsearch-foobar/ # Elasticsearch search API
│ │ └── sync-supabase-moose-foobar/ # Data synchronization
│ ├── packages/ # Shared packages
│ │ ├── models/ # Shared data models
│ │ ├── ui/ # Shared UI components
│ │ ├── eslint-config/ # ESLint configuration
│ │ ├── typescript-config/ # TypeScript configuration
│ │ └── tailwind-config/ # Tailwind configuration
│ └── scripts/ # Development scripts
- Modern React application with TanStack Router
- Real-time data visualization with Recharts
- Form handling with TanStack Form
- Data tables with TanStack Table
- Fastify-based REST API
- PostgreSQL database with Drizzle ORM
- Real-time subscriptions via Supabase
- OpenAPI/Swagger documentation
- Transactional business logic
- Moose analytical APIs + ClickHouse with automatic OpenAPI/Swagger docs
- Moose streaming Ingest Pipelines + Redpanda for routing change data events from PostgreSQL to ClickHouse
- Elasticsearch search API
- Full-text search capabilities
- Real-time indexing
- Moose workflows + Temporal for durable long-running data synchronization
- Real-time replication with Supabase Realtime
The application uses a multi-database architecture:
- Supabase (Transactional)
- ClickHouse (Analytical)
- Elasticsearch (Search)
🚧 UNDER DEVELOPMENT - Production deployment capabilities are actively being developed and tested. The current focus is on stability and compatibility across different machine configurations.
We're working on a production deployment strategy that will be available soon.
🔬 TESTING STATUS - We are actively testing on various machine configurations. Currently tested on Mac M3 Pro (18GB RAM), M4 Pro, and M4 Max. We're expanding testing to more configurations.
- Node Version: Ensure you're using Node 20+ (required for Moose)
- Memory Issues: Elasticsearch requires significant memory (4GB+ recommended)
Tested Configurations:
- ✅ Mac M3 Pro (18GB RAM)
- ✅ Mac M4 Pro
- ✅ Mac M4 Max
- 🔄 More configurations being tested
# Clean all services
pnpm ufa:dev:clean
# Restart development
pnpm ufa:dev- 🚀 Moose Repository - The framework that powers this demo
- 📚 Moose Documentation - Complete guide to building with Moose
- 💬 Moose Community Slack - Join the discussion
📋 ALPHA FEEDBACK - We welcome feedback and bug reports during this alpha phase. Please include your machine configuration when reporting issues.
- 💬 Moose Discussions - Get help with Moose
- 🐛 Moose Issues - Report Moose-related bugs
- 📚 Moose Documentation - Comprehensive guides
For issues and questions about this demo:
- Check the troubleshooting section above
- Open an issue on GitHub with your machine configuration
- Join our development discussions for alpha testing feedback
This repository demonstrates Moose's capabilities for building production-ready applications with:
- Real-time analytics with ClickHouse
- Event streaming with Redpanda
- Reliable workflows with Temporal
- Multi-database architectures (PostgreSQL + ClickHouse + Elasticsearch)
