How Metabase Works
Metabase solves the "everyone needs data but not everyone writes SQL" problem. Its architecture is built around a visual query builder that translates clicks into database queries — and the driver abstraction layer underneath is what makes it work across 20+ database types.
What metabase Does
Open-source business intelligence tool for data visualization and analytics
Metabase is a comprehensive web-based BI platform that enables users to create dashboards, ask questions about data, and build embedded analytics. It combines a TypeScript/React frontend with backend APIs, offering both self-hosted and cloud options with enterprise features.
Architecture Overview
metabase is organized into 5 layers, with 10 components and 3 connections between them.
How Data Flows Through metabase
Data flows from databases through the backend API to the React frontend, with enterprise features adding embedding capabilities and advanced analytics. The embedding SDK allows external applications to consume Metabase components.
1Database Connection
Backend connects to various databases and exposes data through REST APIs
2Frontend State Management
Redux/RTK Query manages API calls and application state in the React frontend
3Enterprise Extensions
Enterprise features extend base functionality with advanced analytics and embedding
4SDK Distribution
Embedding SDK packages Metabase components for external consumption
5External Integration
Host applications integrate Metabase components using the SDK with authentication
Technology Choices
metabase is built with 10 key technologies. Each serves a specific role in the system.
Key Components
- EnterpriseApi (service): Enhanced API service that extends the base API with enterprise-specific endpoints and tag types
- createDashboard (utility): Cypress helper function for creating dashboard test fixtures with embedding and auto-apply filter options
- CLI_STEPS (config): Configuration object defining the sequential steps for the embedding SDK CLI setup process
- DataSourceSelector (component): React component for selecting data sources in the embedding data picker interface
- InteractiveDashboard (component): Angular wrapper component that embeds Metabase interactive dashboards using the React SDK
- propagateErrorResponse (utility): Error handling utility that converts API responses to CLI-friendly error messages
- OUTPUT_STYLES (config): Chalk-based styling configuration for CLI output formatting with colors and emphasis
- ENTERPRISE_TAG_TYPES (type-def): Tag type definitions for RTK Query caching in enterprise API endpoints
- DATA_BUCKET (config): Constants defining data source categories (models, raw data, saved questions) for the data picker
- CliState (type-def): TypeScript interface defining the state object passed through CLI setup steps
Who Should Read This
Data teams looking for self-service analytics, or engineers evaluating Metabase for embedded analytics.
This analysis was generated by CodeSea from the metabase/metabase source code. For the full interactive visualization — including pipeline graph, architecture diagram, and system behavior map — see the complete analysis.
Explore Further
Full Analysis
Interactive architecture map for metabase
metabase vs superset
Side-by-side architecture comparison
metabase vs redash
Side-by-side architecture comparison
How Apache Superset Works
Dashboards & Analytics
Frequently Asked Questions
What is metabase?
Open-source business intelligence tool for data visualization and analytics
How does metabase's pipeline work?
metabase processes data through 5 stages: Database Connection, Frontend State Management, Enterprise Extensions, SDK Distribution, External Integration. Data flows from databases through the backend API to the React frontend, with enterprise features adding embedding capabilities and advanced analytics. The embedding SDK allows external applications to consume Metabase components.
What tech stack does metabase use?
metabase is built with React (Frontend framework with hooks and context), Redux Toolkit (State management with RTK Query for API calls), TypeScript (Type safety across frontend and enterprise code), Rspack (Fast bundler with multiple configuration targets), Cypress (E2E testing with extensive helper utilities), and 5 more technologies.
How does metabase compare to superset?
CodeSea has detailed side-by-side architecture comparisons of metabase with superset, redash. These cover tech stack differences, pipeline design, and system behavior.