Quick Start

Go from zero to a live, shared dashboard in about 15 minutes. This walkthrough covers everything — GCP setup, sample data, building with AI, and deploying.

1

Sign up

Head to overscore.dev and sign in with your Google account. It's free during beta — no credit card required.
2

Create a project

Click New Project in the Hub. Give it a name and a slug (e.g., acme). The slug becomes part of your dashboard URLs.
3

Set up BigQuery

If you don't already have one, create a GCP project at console.cloud.google.com. The free tier includes 1 TB of queries/month and 10 GB of storage. Then:
  1. Enable the BigQuery API under APIs & Services
  2. Go to IAM & Admin > Service Accounts and create one
  3. Grant it BigQuery Data Viewer and BigQuery Job User roles
  4. Create a key (JSON type) and download the file — you'll upload this in the next step
4

Upload sample data

Download our sample marketing CSV (~500 rows of monthly marketing metrics) and upload it to a BigQuery table. In the BigQuery console, click your dataset, then Create Table> Upload > select the CSV.
5

Connect BigQuery in the Hub

In your project's Settings > BigQuery tab, upload the service account JSON file you downloaded earlier. Overscore uses this to proxy queries securely — your credentials never reach the browser.
6

Create a dashboard

Inside your project, click New Dashboard. Give it a name and slug (e.g., marketing-overview). This slug becomes the URL path.
7

Register queries

In the dashboard settings, add the queries your dashboard will use. For the sample data, create two:
-- monthly_metrics
SELECT
  FORMAT_DATE('%Y-%m', date) AS month,
  SUM(spend) AS total_spend,
  SUM(revenue) AS total_revenue,
  SUM(clicks) AS total_clicks
FROM `your-project.your_dataset.marketing_data`
GROUP BY month
ORDER BY month

-- channel_breakdown
SELECT
  channel,
  SUM(spend) AS total_spend,
  SUM(revenue) AS total_revenue,
  ROUND(SAFE_DIVIDE(SUM(revenue), SUM(spend)), 2) AS roas
FROM `your-project.your_dataset.marketing_data`
GROUP BY channel
ORDER BY total_spend DESC
8

Generate an API key

Go to Settings > API Keysand create one. Copy it now — it's only shown once. You'll need it for the CLI.
9

Scaffold your dashboard locally

Open your terminal and run:
npx create-overscore my-dashboard
This creates a React project pre-configured with @overscore/client, Tailwind, and an overscore.config.ts file.
10

Build with Claude Code

Open the project in your terminal and start Claude Code. Use a prompt like:
Build a marketing dashboard with two sections:

1. A line chart showing monthly spend vs revenue
   using the "monthly_metrics" query

2. A bar chart showing ROAS by channel
   using the "channel_breakdown" query

Use the useQuery hook from @overscore/client to fetch data.
Use Recharts for charts and Tailwind for styling.
Dark theme with bg-gray-950 background.
Claude Code will read your overscore.config.ts and build the dashboard.
11

Preview locally

Run the dev server to see your dashboard:
npm run dev
Open http://localhost:3000 in your browser. The useQuery hook will call the Overscore API to fetch live BigQuery data.
12

Deploy

When it looks good, deploy with a single command:
npx @overscore/cli deploy
The CLI builds your project, uploads it, and gives you a live URL.
13

Share it

Your dashboard is now live at:
https://<project-slug>.overscore.dev/<dashboard-slug>
Share the link with your team. They sign in with Google, and if they're on your project's team list, they see the dashboard instantly.
14

Enable caching

To speed up load times and reduce BigQuery costs, enable client-side caching. In the Hub, go to your dashboard settings and set a TTL (e.g., 1 hour). Overscore will cache query results in the browser using DuckDB-WASM and Parquet, so repeat visits are instant.

That's it — you've built and deployed a live dashboard from scratch. From here, check out the Core Concepts docs to learn more about queries, caching, and team management, or the CLI Reference for advanced deploy options.