No native binary linking or pod installs are required. Redis v6+ and MySQL 5+ or PostgreSQL 12.5+ must be available as separate services before starting the server.

Project setup

1. Copy source/ into your project root, e.g. ./chartbrew/.

2. Install monorepo dependencies from the root:

   cd chartbrew && npm run setup
   

3. Create a .env file at the project root (next to server/). Required variables:

   CB_DB_HOST=localhost
   CB_DB_PORT=3306
   CB_DB_NAME=chartbrew
   CB_DB_USERNAME=root
   CB_DB_PASSWORD=yourpassword
   CB_DB_DIALECT=mysql          # or postgres
   CB_SECRET=your_jwt_secret
   CB_ENCRYPTION_KEY=<32-byte-hex>   # generate: node -e "console.log(require('crypto').randomBytes(32).toString('hex'))"
   REDIS_HOST=127.0.0.1
   REDIS_PORT=6379
   CB_MAIL_HOST=smtp.example.com
   CB_MAIL_USER=user@example.com
   CB_MAIL_PASS=mailpassword
   

4. Generate the 32-byte encryption key:

   node -e "console.log(require('crypto').randomBytes(32).toString('hex'))"
   

5. Start the backend in development mode:

   cd server && npm run start-dev
   

6. Start the frontend in a separate terminal:

   cd client && npm run start
   

7. To wire the backend into an existing Express app, require server/api/index.js and mount the route modules:

   const routes = require("./chartbrew/server/api");
   app.use("/api/team", routes.team);
   app.use("/api/user", routes.user);
   // etc.
   

Public API

AppReducer

// server/reducers/index.js (client-side Redux root reducer map)
import AppReducer from "./client/src/reducers/index";
// Shape:
// {
//   user, project, team, chart, connection, savedQuery,
//   dataset, dataRequest, error, tutorial, template,
//   alert, integration, ui, chartTemplate
// }

Used when initialising the Redux store with configureStore({ reducer: AppReducer }). Each key maps to a slice reducer covering one domain of the application state.

FRONTEND_BY_SOURCE_ID

// client/src/sources/index.js
import FRONTEND_BY_SOURCE_ID from "./client/src/sources/index";
// Record<string, { ConnectionForm: React.ComponentType, DataRequestBuilder: React.ComponentType }>
// Keys: "api" | "mongodb" | "postgres" | "mysql" | "firestore" | "realtimedb" | ...

Use this map to dynamically render the correct connection form and data-request builder for a given source type. Look up by source ID string to get the matching React components.

SOURCE_DEFINITIONS / helpers

import SOURCE_DEFINITIONS, {
  findSourceDefinitionForConnection,
  getSourceDefinition,
  getSourceDefinitionLogo,
  getSourceDefinitionSummaries,
} from "./client/src/sources/definitions";

findSourceDefinitionForConnection(connection: object): SourceDefinition;
getSourceDefinition(sourceId: string): SourceDefinition;
getSourceDefinitionLogo(sourceId: string): string;
getSourceDefinitionSummaries(): SourceDefinitionSummary[];

Use getSourceDefinition to retrieve metadata (label, logo, category) for a data source by its string ID. Use findSourceDefinitionForConnection when you have a connection object and need to resolve its definition. getSourceDefinitionSummaries returns a flat list useful for rendering source pickers.

Express route modules

// server/api/index.js
const { team, user, project, connection, chart,
        savedQuery, dataRequest, dataset, template,
        chartTemplate, google, update, updateRun,
        integration, ai } = require("./server/api");

// Each is an Express Router:
app.use("/api/team", team);
app.use("/api/user", user);
app.use("/api/project", project);
// ... etc.

Each exported router encapsulates all CRUD endpoints for its domain. Mount them under a common /api prefix in your host Express application.

Working examples

Scenario - Bootstrapping the Redux store in a host React app

Import AppReducer directly and create the store without re-declaring every slice.

import { configureStore } from "@reduxjs/toolkit";
import AppReducer from "./chartbrew/client/src/reducers/index";

export const store = configureStore({
  reducer: AppReducer,
  middleware: (getDefault) => getDefault({ serializableCheck: false }),
});

export type RootState = ReturnType<typeof store.getState>;
export type AppDispatch = typeof store.dispatch;

Wrap your React tree with <Provider store={store}> and all Chartbrew UI components will have access to the shared state.

Scenario - Rendering a dynamic connection form by source type

import React from "react";
import FRONTEND_BY_SOURCE_ID from "./chartbrew/client/src/sources/index";

interface Props {
  sourceId: string;
  onSave: (data: unknown) => void;
}

export function DynamicConnectionForm({ sourceId, onSave }: Props) {
  const entry = FRONTEND_BY_SOURCE_ID[sourceId];
  if (!entry) return <p>Unknown source: {sourceId}</p>;

  const { ConnectionForm } = entry;
  return <ConnectionForm onComplete={onSave} />;
}

Pass sourceId="postgres" or sourceId="api" and the right form renders automatically, including all validation logic bundled with the source.

Scenario - Mounting Chartbrew API routes in an existing Express server

import express from "express";
import cors from "cors";
import cookieParser from "cookie-parser";

// Require Chartbrew route modules
const {
  team, user, project, connection, chart, ai
} = require("./chartbrew/server/api");

const app = express();
app.use(cors());
app.use(express.json());
app.use(cookieParser());

// Mount routes under /cb namespace to avoid collisions
app.use("/cb/team", team);
app.use("/cb/user", user);
app.use("/cb/project", project);
app.use("/cb/connection", connection);
app.use("/cb/chart", chart);
app.use("/cb/ai", ai);

app.listen(4300, () => console.log("Server on :4300"));

Ensure .env is loaded before these imports so Sequelize and Redis connections are initialised correctly.

File walkthrough

• server/index.js - Express application entry point: loads encryption keys, sets up middleware (CORS, Helmet, cookie-parser, busboy), mounts API and apps routes, starts cron jobs and socket manager.
• server/api/index.js - Aggregates all Express Router modules and exports them as a single object for easy mounting.
• server/apps/index.js - Exports third-party app integrations (currently Slack) as additional Express routers.
• client/src/reducers/index.js - Combines all Redux slice reducers into a single AppReducer object for configureStore.
• client/src/sources/index.js - Maps source type IDs to their ConnectionForm and DataRequestBuilder React components, and re-exports source definition helpers.
• client/src/App.jsx - Root React component: sets up routing and global providers.
• client/src/main.jsx - Vite entry point, mounts <App /> into the DOM.
• client/src/slices/ - RTK slice files, one per domain (user, project, chart, etc.).
• client/src/actions/ - Legacy action creators (some domains still use thunks outside RTK slices).
• client/src/components/ - Shared UI primitives reused across containers.
• client/src/containers/ - Page-level React components wired to Redux.
• ecosystem.config.js - PM2 configuration for production process management.
• docker-compose.yml / docker-compose-postgres.yml - Ready-to-run Docker Compose stacks.

Common pitfalls and fixes

• Missing CB_ENCRYPTION_KEY: Server crashes on boot if this is absent or not exactly 32 hex bytes. Fix: generate with node -e "console.log(require('crypto').randomBytes(32).toString('hex'))" and set in .env.
• Redis not running: Bull queues fail silently or throw ECONNREFUSED. Fix: start Redis before the server; set REDIS_HOST and REDIS_PORT in .env.
• Wrong CB_DB_DIALECT: Sequelize defaults or throws if dialect does not match the installed driver. Fix: set CB_DB_DIALECT=mysql or CB_DB_DIALECT=postgres explicitly and install the matching npm driver (mysql2 or pg).
• CJS/ESM mismatch: server/ uses CommonJS (require); importing it from an ESM host with import fails. Fix: use createRequire or rename host entry to .cjs.
• Vite proxy not set: Frontend calls to /api return 404 in dev. Fix: add server.proxy in client/vite.config.js pointing to http://localhost:4019.
• FSL license restriction: The LICENSE-FSL.md restricts commercial competing use. Fix: review source/LICENSE-FSL.md before shipping a SaaS product that competes with Chartbrew.

Vibe-coding prompt template

I have the Chartbrew open-source analytics platform source code in ./source/ and its integration guide at ./USAGE.md.
The upstream package is user@example.com

Please integrate Chartbrew into my existing project step-by-step:

1. Read USAGE.md and the file excerpts to understand the real exports.
2. Add the required npm dependencies listed in USAGE.md to my project.
3. Mount the Express API route modules from source/server/api/index.js into my existing Express app under the /cb prefix.
4. Initialise the Redux store using AppReducer from source/client/src/reducers/index.js.
5. Show me how to render a dynamic connection form using FRONTEND_BY_SOURCE_ID from source/client/src/sources/index.js.
6. Ensure all required .env variables (CB_ENCRYPTION_KEY, CB_DB_*, CB_SECRET, REDIS_*) are documented and wired.
7. Do not invent any API symbols - only use exports visible in USAGE.md and the source file excerpts.

License and credit

Chartbrew is dual-licensed. The community edition is available under the Functional Source License (FSL) as described in source/LICENSE-FSL.md, which permits non-commercial and internal use but restricts building competing commercial services. An additional permissive license is provided in source/LICENSE.md. Review both files before deploying commercially.

Upstream project: https://github.com/chartbrew/chartbrew - package user@example.com.

This product’s unique contribution is clean room implementation of valuable code block into AVCP compatible standard.

The full install guide and integration prompts unlock after purchase.

NeonNight Data Visualization Dashboard

CRM, ERP, Admin & Internal Tools

$18.12