bi-builder

Generate BI dashboards from Prisma schemas using Next.js and Recharts.

2|Updated Jan 30, 2026
One-click install
npx skills add https://github.com/DangJin/bi-builder-skills --skill bi-builder
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: bi-builder
Source: https://github.com/DangJin/bi-builder-skills/tree/main/skills/bi-builder
Command: npx skills add https://github.com/DangJin/bi-builder-skills --skill bi-builder

SYSTEM DOCUMENTATION & REQUIREMENTS

💡 This Skill includes references (resource) components.

What problem does it solve?

This Skill eliminates the tedious manual process of turning raw database schemas into production-ready BI dashboards, enabling teams to go from database exploration to a complete UI quickly.

Core Features & Use Cases

  • 6-Phase Workflow: Database Connection → Schema Exploration → Requirements Dialog → Metrics Design → Chart Planning → Page Implementation
  • 4 Layout Patterns: Executive, Operational, Analytical, Comparison dashboards with templates
  • Industry-Specific Templates: Pre-configured metrics for 7 industries (E-commerce, SaaS, Finance, Content, Education, Healthcare, Logistics)
  • Smart Skip Conditions: Automatically skip phases based on project state
  • Progressive Document Loading: Load reference docs on-demand to save context

Use Case: When you need a sales analytics dashboard, this skill guides you from connecting to Prisma to implementing the page with Recharts components.

Quick Start

Use the bi-builder skill to scaffold a dashboard from your database. Then tell it to "Create a sales analytics page" or "Build a dashboard from Prisma schema."

Frequently Asked Questions about bi-builder

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I build a BI dashboard from an existing Prisma schema?▼

This Skill builds BI dashboards from existing databases by automating schema exploration, metric design, and UI implementation using Next.js and Recharts. It guides you through a 6-phase workflow to generate production-ready analytics pages quickly.

What is the typical workflow for creating data visualizations with Next.js and Recharts?▼

The workflow for creating data visualizations with Next.js and Recharts follows a 6-phase process: Database Connection, Schema Exploration, Requirements Dialog, Metrics Design, Chart Planning, and Page Implementation. It includes smart skip conditions to bypass phases based on your project state.

Do I need Prisma and Node.js to generate analytics dashboards?▼

Yes, you need Prisma, Node.js, and a modern React/Next.js environment to generate analytics dashboards using this Skill. These dependencies are required to connect to your database and scaffold production-ready UI components.

Can I use pre-configured metrics for specific industries like E-commerce or SaaS?▼

Yes, you can use pre-configured metrics for 7 industries including E-commerce, SaaS, Finance, Content, Education, Healthcare, and Logistics. The Skill provides industry-specific templates to accelerate dashboard deployment.

What are the available layout patterns for operational and analytical dashboards?▼

Available layout patterns for operational and analytical dashboards include four templates: Executive, Operational, Analytical, and Comparison. These patterns help structure your UI implementation based on the specific analytics use case.

How do I start scaffolding a sales analytics page from my database?▼

To start scaffolding a sales analytics page from your database, initiate the Skill and instruct it to build a dashboard from your Prisma schema. It guides you from database connection to implementing the page with Recharts components.