Building blocks for React data analytics applications powered by DuckDB
SQLRooms is a comprehensive framework for building powerful data analytics applications that run entirely in the browser. It combines DuckDB's SQL capabilities with React to create interactive, client-side analytics tools without requiring a backend.
Check out our example projects to see what you can build with SQLRooms.
- Browser-Based Analytics Engine: Leverages DuckDB-WASM to process data directly in the browser, enabling offline functionality and eliminating backend dependencies.
- Complete UI Framework: Provides a rich set of React components including data tables, SQL editors, and visualization tools built with Tailwind CSS.
- Flexible Layout System: Includes a mosaic-style panel system for creating customizable, responsive dashboards.
- Project Management: Built-in state management for analytics projects with persistence capabilities.
- Data Source Integration: Support for various data sources including CSV, Parquet files, and S3-compatible storage.
- AI-Ready: Optional AI integration for natural language querying and automated insights.
- Privacy-Focused: All data processing happens client-side, keeping sensitive data local when needed.
- @sqlrooms/project-builder: Foundation for building analytics applications with Zustand-based state management
- @sqlrooms/project-config: Central configuration and type definitions using Zod schemas
- @sqlrooms/duckdb: DuckDB integration for query execution and data source connections
- @sqlrooms/ui: Comprehensive UI toolkit based on shadcn/ui with Tailwind preset
- @sqlrooms/data-table: Interactive data grid for query result visualization
- @sqlrooms/sql-editor: SQL query editor with syntax highlighting and auto-completion
- @sqlrooms/layout: Flexible panel management system
- @sqlrooms/s3-browser: S3-compatible storage browser for data management
- @sqlrooms/vega: Data visualization integration with Vega-Lite
- @sqlrooms/ai: Optional AI integration for natural language querying
- @sqlrooms/cosmos: Graph visualization capabilities
- @sqlrooms/dropzone: Drag-and-drop file upload functionality
- @sqlrooms/mosaic: Integration with UW Interactive Data Lab's Mosaic library
- @sqlrooms/monaco-editor: Monaco Editor integration with specialized JSON editing support
- @sqlrooms/utils: Shared helper functions for various operations
- Interactive data exploration and analysis tools
- Custom business intelligence dashboards
- Self-contained analytics applications
- Privacy-focused data processing solutions
- AI-powered data analysis workflows
See our example projects for real-world implementations, including:
- AI-powered analytics with natural language querying
- Graph visualization with Cosmos
- 2D embedding visualization
- Interactive dashboards with Mosaic
Check out the Getting Started guide.
pnpm install
pnpm build
cd examples/ai
pnpm dev
open http://localhost:5173
pnpm install
pnpm build
pnpm dev
The documentation is built using VitePress and TypeDoc. To develop the documentation locally:
-
Install dependencies:
pnpm install pnpm build pnpm docs:dev
This will start a local server with hot-reloading at http://localhost:5173
-
Build the documentation:
pnpm docs:build
-
Preview the built documentation:
pnpm docs:preview
This will serve the built documentation at http://localhost:4173
The documentation source files are located in the docs/ directory. API documentation is automatically generated from TypeScript source code using TypeDoc.
This project uses Git Large File Storage (LFS) for managing media files in the documentation. To work with these files:
-
Install Git LFS on your system:
# macOS (using Homebrew) brew install git-lfs # Ubuntu/Debian sudo apt install git-lfs
-
Initialize Git LFS in your local repository:
git lfs install
-
Pull existing LFS files:
git lfs pull
-
When adding new media files to the
docs/media/directory, they will be automatically tracked by Git LFS as specified in the.gitattributesfile.