Real-time Analytics: How We Built a 24-Property Dashboard in 1 Day#

We needed to monitor analytics across 24 GA4 properties. Existing tools were either too expensive or too limited. So we built our own—in one day.

The Problem#

Managing 24 Google Analytics properties means:

• 24 different dashboards to check
• No unified view
• Hard to compare performance
• Slow context switching

Google's own interface isn't designed for this. Third-party tools wanted $500+/month.

The Solution#

A custom dashboard that:

• Auto-discovers all accessible properties
• Shows real-time visitor counts
• Compares metrics across properties
• Updates every 30 seconds
• Dark mode (essential for dashboards)

Development Timeline#

Hour 1-2: Setup and API Integration#

Google Analytics Data API setup:

typescriptCopy
Loading...

Hour 3-4: Real-time Metrics#

Fetching real-time data:

typescriptCopy
Loading...

Historical comparison:

typescriptCopy
Loading...

Hour 5-6: Frontend Dashboard#

Property cards with real-time updates:

typescriptCopy
Loading...

Hour 7-8: Comparison and Polish#

Cross-property comparison:

typescriptCopy
Loading...

Final Result#

What we shipped:

• 24 properties discovered automatically
• Real-time active user counts
• 7-day, 30-day, and 90-day comparisons
• Property search and filtering
• Dark mode UI
• Export to CSV

Cost: $0 (GA4 API is free within quotas)

Time: 8 hours from start to deployed

Technical Decisions#

Why Next.js?#

• API routes for server-side GA calls
• React for interactive UI
• Vercel deployment in minutes
• TypeScript for reliability

Why Recharts?#

• Simple API
• Good performance with many data points
• Easy dark mode styling
• No complex configuration

Caching Strategy#

typescriptCopy
Loading...

Lessons Learned#

1. API Discovery Is Powerful#

The Admin API's listAccountSummaries found all 24 properties automatically. No manual configuration.

2. Real-time Has Limits#

GA4 real-time data is approximate and has rate limits. Good enough for dashboards, not for precision.

3. Comparison Is The Value#

Single-property metrics are available in GA4 UI. Cross-property comparison is where custom dashboards shine.

4. Dark Mode Matters#

For dashboards you stare at, dark mode reduces eye strain. Worth the extra CSS.

What This Enables#

With unified analytics:

• Spot underperforming properties immediately
• Compare marketing effectiveness across products
• Identify trends across the portfolio
• Make data-driven decisions faster

Frequently Asked Questions#

Q: Can you really build a Google Analytics dashboard in one day?#

Yes, with the right tech stack and experience. We built a fully functional dashboard with auto-discovery of 24 GA4 properties, real-time metrics, cross-property comparison, and dark mode UI in 8 hours. The key enablers are the GA4 Data API (free within quotas), Next.js API routes for server-side calls, and React Query for automatic data refresh every 30 seconds. The hardest part is not the code but knowing the GA4 API quirks.

Q: Is the Google Analytics Data API free to use?#

Yes, the GA4 Data API is free within quota limits. Google provides generous free-tier quotas that handle most dashboard use cases without cost. The Admin API for property discovery is also free. This means the entire analytics dashboard infrastructure can run at $0 in API costs, with only hosting (Vercel Pro at $20/month) as the recurring expense.

Q: What are the limitations of GA4 real-time data?#

GA4 real-time data is approximate, not exact. It updates with some delay and has rate limits on how frequently you can query it. The data is reliable enough for dashboard monitoring and trend spotting, but not precise enough for real-time billing or capacity planning. Historical data is more accurate but has a 24-48 hour processing delay for events. Cache historical queries for 5 minutes and leave real-time uncached for freshness.

Q: Why build a custom analytics dashboard instead of using Google Analytics directly?#

The main value is cross-property comparison. Google Analytics shows one property at a time, requiring you to switch between 24 different dashboards. A custom dashboard provides a unified view, letting you spot underperforming properties immediately, compare marketing effectiveness across products, and identify portfolio-wide trends. Third-party tools offering similar functionality charge $500+/month, making a custom build financially smart.

Build Your Own Dashboard?#

We build custom analytics dashboards for:

• Multi-property GA4 accounts
• Business intelligence
• Real-time monitoring
• Custom metrics and KPIs

Discuss Your Analytics Project

---

AI 4U Labs builds production tools fast. This dashboard is one of 30+ projects we've shipped.