skills.rest
AubreyHan
AubreyHanCOMMUNITY
Explore all skills by this author →
GitHub

building-data-apps

Build data dashboards and interactive reports from BigQuery sources.

Updated Jun 10, 2026
Search Tags:#data visualization#react#vite#streamlit#bigquery#data dashboards#gemini chat
One-click install
npx skills add https://github.com/AubreyHan/SKILL_Repo --skill building-data-apps-aubreyhan
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: building-data-apps
Source: https://github.com/AubreyHan/SKILL_Repo/tree/main/building-data-apps
Command: npx skills add https://github.com/AubreyHan/SKILL_Repo --skill building-data-apps-aubreyhan

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This Skill helps you create modern data apps, dashboards, and interactive reports without reinventing the core UI, layout, and analytics patterns from scratch.

Core Features & Use Cases

  • Framework selection: Choose Streamlit for Python-first workflows or React + Vite for richer frontend interactivity and larger web app ecosystems.
  • Data-centric interfaces: Build dashboards that query, visualize, and present data from GCP sources such as BigQuery.
  • Optional AI chat: Add a Gemini-powered chat experience for natural language questions against your data, with streaming responses and follow-up suggestions.
  • Shared design system: Apply a consistent zinc-based, card-driven visual style with dark mode support and polished typography.
  • Use case: A team can turn a BigQuery dataset into a responsive executive dashboard with KPI cards, charts, filters, and an optional chat panel for ad hoc analysis.

Quick Start

Build a BigQuery-backed analytics dashboard in React + Vite with KPI cards, charts, and an optional Gemini chat interface.

Frequently Asked Questions about building-data-apps

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

FAQPage Schema
How do I build a data dashboard with BigQuery and React?▼

To build a data dashboard with BigQuery and React, use a Vite-powered setup to create KPI cards, charts, and filters that query BigQuery data sources. This approach provides rich frontend interactivity and access to larger web app ecosystems.

Should I use Streamlit or React for building data visualization apps?▼

Choose Streamlit for Python-first data visualization workflows, or React plus Vite when you need richer frontend interactivity. Streamlit offers faster Python integration, while React provides a larger web ecosystem for complex dashboards.

How do I add a Gemini chat interface to a data dashboard?▼

To add a Gemini chat interface to your data dashboard, implement streaming SSE chat integration that references BigQuery datasources. This enables natural language questions against your data with streaming responses and follow-up suggestions.

Can I create interactive data reports from GCP sources without designing UI from scratch?▼

Yes, you can create interactive data reports from GCP sources by applying a shared design system with a zinc-based, card-driven visual style. This provides dark mode support and polished typography without reinventing core UI layouts.

What is the best way to turn a BigQuery dataset into an executive analytics dashboard?▼

The best way to turn a BigQuery dataset into an executive analytics dashboard is building a responsive interface with KPI cards, charts, and filters. You can optionally include a Gemini-powered chat panel for ad hoc analysis.

Do I need a specific frontend framework to build data dashboards with GCP data?▼

You need either Streamlit or React plus Vite to build data dashboards with GCP data. Streamlit suits Python-first workflows, while React with Vite delivers richer frontend interactivity for querying and visualizing BigQuery sources.

Related Skills

Explore More Data & Analytics Skills→
fritzprixfritzprix
8

system-setup

Install and verify MCP runtime dependencies across Windows, Linux, and macOS.

Community
Intermediate
nesihaver-ILnesihaver-IL

analytics-metrics

Build interactive analytics dashboards and charts in React with Recharts.

Community
Intermediate
interflownexinterflownex
2

building-data-apps

Construct data-centric web apps with Streamlit or React and Vite.

Community
Advanced
scumunnascumunna
1

marketing-analytics-warehouse-and-dashboards

Design and implement a BigQuery marketing analytics warehouse with Looker Studio dashboards.

Community
Advanced