AI-Native Development

How We Build

A transparent look at the technologies, tools, and AI systems that power Value-First Team. We believe in sharing how we work, not just what we sell.

Modern web stack
AI-first operations
Autonomous agents
Unified customer view
32
Technologies
31
Active Tools
5
AI Agents
8
Categories
Platform & Hosting
3 tools

The foundation that runs and deploys our website

Astro

v5.0.0
active

Content-focused web framework with islands architecture. Ships zero JavaScript by default, adds interactivity where needed.

Why we chose it

Perfect for a content-heavy site with selective interactivity. Fast builds, great DX, and the islands pattern lets us use React only where we need it.

Zero JS by default Islands architecture Content collections Server-side rendering +1 more

Lesson learned

"The islands pattern is incredibly powerful for content sites. We wish we had understood Astro content collections earlier."

Vercel

active

Cloud platform for frontend frameworks. Handles deployment, edge caching, and serverless functions.

Why we chose it

First-class Astro support, global edge network, and seamless GitHub integration. Preview deployments are invaluable.

Edge caching Preview deployments Cron jobs Serverless functions +1 more

Lesson learned

"Vercel cron jobs are great for scheduled automations like weekly episode creation."

GitHub

active

Version control and CI/CD platform. Hosts our code and runs automated workflows.

Why we chose it

Industry standard, great CI/CD with Actions, and integrates with everything.

Git hosting GitHub Actions Issue tracking Pull requests +1 more
Content Operations
4 tools

Where we manage and serve content to visitors

Sanity

v7.13.2
active

Headless CMS with real-time collaboration. Our canonical source for methodology, shows, episodes, and educational content.

Why we chose it

Flexible schema, real-time preview, excellent GROQ query language, and the Studio is highly customizable.

Real-time collaboration GROQ query language Portable Text Custom Studio +2 more

Lesson learned

"Sanity shines when you embrace Portable Text. The build cache pattern saves thousands of API calls."

View Profile

Mux

v12.8.1
active

Video infrastructure for premium content. Handles on-demand, live streaming, and provides transcription-ready audio.

Why we chose it

Best-in-class video APIs, transcription-ready audio extraction, and reliable live streaming with automatic recording.

On-demand video Live streaming Automatic recording Audio extraction +2 more

Lesson learned

"The yt-dlp → Mux → Gemini pipeline unlocked automated transcription at scale."

YouTube

active

Public video distribution for SEO and reach. Hosts 635+ episodes across 11 shows.

Why we chose it

Free hosting, massive reach, SEO benefits, and familiar embed experience for viewers.

Free hosting Search discovery Playlist organization Live streaming +1 more

Lesson learned

"YouTube for reach, Mux for premium experience. The lazy-load facade pattern dramatically improves page load times."

Pagefind

v1.4.0
active

Static site search that runs entirely in the browser. Built at deploy time, no external service needed.

Why we chose it

Zero-cost, privacy-friendly, and surprisingly powerful for a static index. Perfect for content sites.

Build-time indexing Client-side search Zero external calls Faceted filtering +1 more

Lesson learned

"Hybrid search combining Pagefind with quick actions creates a command palette experience."

Customer Value Platform
3 tools

How we understand and serve customers (powered by HubSpot)

HubSpot

active

Our Customer Value Platform. Houses contacts, companies, deals, and 18 custom objects that model our entire business.

Why we chose it

Unified view of customers across marketing, sales, and service. Custom objects let us model methodology concepts like Signals, Courses, and Deliverables.

18 custom objects Workflows automation Email marketing Commerce (carts, quotes, invoices) +2 more

Lesson learned

"Custom objects are powerful but require careful planning. The Stakeholder Theater model (organizing by role, not object type) transformed our approach."

Magic Link Authentication

active

Custom JWT-based authentication using HubSpot Contact IDs. Passwordless login via email magic links.

Why we chose it

No separate auth system needed. HubSpot Contact becomes the user identity, unifying portal experience with CRM data.

Passwordless login 30-day sessions httpOnly cookies Head Coach impersonation +1 more

Lesson learned

"Magic links eliminate password management but require solid email deliverability."

HubSpot Behavioral Events

active

Custom event tracking that feeds directly into HubSpot. 26+ event types capture user engagement.

Why we chose it

Events enrich contact records automatically. No third-party analytics means all data stays in our CVP.

26+ custom event types Contact property enrichment Workflow triggers Stage progression tracking +1 more

Lesson learned

"Building analytics into HubSpot creates a single source of truth for customer engagement."

AI Layer
4 tools

Artificial intelligence powering operations and content

Claude Code

active

AI-powered coding assistant. Our "Implementation Lead" that writes code, reviews PRs, and builds features.

Why we chose it

Best-in-class code understanding, can work autonomously on complex tasks, and understands our codebase context.

Code generation Codebase understanding Autonomous agents Skills and patterns +1 more

Lesson learned

"Treating Claude as a team member (with clear roles and handoffs) is more effective than treating it as a tool."

Claude (Operations)

active

Strategic AI assistant. Our "Operations Lead" for planning, analysis, and documentation.

Why we chose it

Different strengths than Claude Code. Excels at strategic thinking, documentation, and cross-session context.

Strategic analysis Documentation writing Planning support Methodology development +1 more

Google Gemini

v0.24.1
active

Unified AI model for content processing and visual generation. Powers transcription, summarization, trap detection, and Tron:Ares styled image generation via Imagen 3.

Why we chose it

Excellent audio transcription, long context window for full episodes, cost-effective batch processing, and unified API for both text and image generation.

Audio transcription Content summarization Key point extraction Trap detection +4 more

Lesson learned

"Gemini handles hour-long episodes well. The prompt engineering for trap detection took iteration. Imagen 3 integration enables unified text+visual generation from single API."

Gamma

deprecated

AI-powered visual content generation (DEPRECATED - migrated to Gemini/Imagen 3 for unified API).

Why we chose it

Originally used for rapid visual content creation. Replaced by Gemini to consolidate AI providers.

AI presentations Visual explanations Brand consistency API integration
Development
6 tools

Languages, frameworks, and tools we code with

TypeScript

v5.3.0
active

Typed superset of JavaScript. Catches errors early and provides excellent IDE support.

Why we chose it

Type safety prevents entire categories of bugs. Self-documenting code and great refactoring support.

Static typing IDE autocomplete Refactoring support Interface definitions +1 more

React

v18.2.0
active

UI component library. Used for interactive islands within our Astro pages.

Why we chose it

Mature ecosystem, component reusability, and excellent for interactive widgets.

Component model Hooks State management Event handling +1 more

Tailwind CSS

v3.4.0
active

Utility-first CSS framework. Rapid styling without leaving your HTML.

Why we chose it

Consistent design system, rapid prototyping, and eliminates CSS file management.

Utility classes Custom theme Responsive design Dark mode +1 more

Lesson learned

"Our TRON:Ares design system (Trapped=Red, Transitioning=Yellow, Transformed=Teal) maps beautifully to Tailwind."

Nanostores

v1.1.0
active

Tiny state manager for framework-agnostic state. Works across Astro and React islands.

Why we chose it

Minimal footprint, works with Astro islands, and simpler than Redux for our needs.

Tiny bundle size Framework agnostic Reactive updates Simple API

Framer Motion

v12.23.24
active

Animation library for React. Powers smooth transitions and micro-interactions.

Why we chose it

Declarative animations, great performance, and gesture support.

Declarative animations Layout animations Gestures Variants +1 more

Zod

v3.25.76
active

TypeScript-first schema validation. Validates API inputs and ensures type safety at runtime.

Why we chose it

Type inference from schemas, great error messages, and works everywhere.

Type inference Runtime validation Error messages Composable schemas
Integrations
5 tools

External services that extend our capabilities

Google Workspace

active

Email, calendar, and file storage. Integrates with HubSpot for scheduling and communication.

Why we chose it

Industry standard, great HubSpot integration, familiar to team and clients.

Gmail Google Calendar Google Drive Meet

StreamYard

active

Browser-based live streaming studio. Powers our 11 shows with professional-quality broadcasts.

Why we chose it

Easy for guests, multistream capability, and professional overlays without complex software.

Browser-based Multistreaming Custom overlays Guest management +1 more

LinkedIn Live

active

Professional network live streaming. Primary distribution for our B2B content.

Why we chose it

Our audience lives on LinkedIn. Native live gets better reach than shared YouTube links.

Live streaming Event posts Engagement tracking

Slack

active

Team communication platform. Internal coordination and client channels.

Why we chose it

Real-time communication, integrations, and familiar to most teams.

Channels Direct messages Integrations Search

Krisp

active

AI meeting assistant that runs locally. Captures transcripts, notes, and action items from every call without a bot joining.

Why we chose it

Works with any app (Zoom, Teams, Meet), no bot joins meetings, and the new webhook API enables custom intelligence pipelines.

Local transcription AI meeting notes Action item extraction Works with any app +2 more

Lesson learned

"The webhook API (just released) unlocks meeting intelligence beyond what the native HubSpot integration provides."

Autonomous Agents
5 tools

AI agents that perform tasks without constant supervision

Data Integrity Monitor

active

Audits codebase for stale data, orphaned collections, and source/consumer mismatches.

Why we chose it

Automated detection of data problems that humans miss. Runs on schedule.

Stale data detection Orphan collection finding Source/consumer validation Markdown reports

Content Pipeline

active

Automates episode creation from YouTube ingestion to Sanity publishing.

Why we chose it

Manual episode creation was unsustainable at 635+ episodes. Now runs weekly.

YouTube ingestion Show matching Sanity episode creation Content tagging

Transcript Harvester

active

Batch processes YouTube episodes through the Mux transcription pipeline.

Why we chose it

Unlocks semantic search across 635+ episodes. yt-dlp → Mux → Gemini pipeline.

YouTube audio download Mux upload Gemini transcription Trap detection +1 more

Lesson learned

"Processing 10 episodes at a time prevents rate limits and allows for monitoring."

Code Butler

active

Codebase maintenance agent. Handles dependency audits, lint fixes, TODO harvesting.

Why we chose it

Automates the boring but important maintenance tasks that accumulate.

Dependency audit Lint autofix TODO harvesting Environment sync +1 more

Doc Butler

active

Documentation maintenance agent. Syncs planning docs, updates current state, detects staleness.

Why we chose it

Documentation drift is real. Automated sync keeps docs and code aligned.

Planning sync Current state updates Staleness detection Archive management +1 more
Monitoring & Analytics
2 tools

How we track performance and understand usage

HubSpot Tracking Script

active

Standard HubSpot website tracking. Captures page views, identifies contacts, powers forms.

Why we chose it

Built-in to our CVP. No additional analytics service needed.

Page view tracking Contact identification Form capture Live chat ready

Custom Event Tracking

active

In-house analytics library (src/lib/analytics.ts) that sends events to HubSpot.

Why we chose it

Complete control over event schema. Events map directly to HubSpot behavioral events.

26+ event types sendBeacon transport Content tracking Media tracking +1 more
Philosophy

AI-Native Development

Our tech stack reflects a fundamental belief: AI should be integrated at every level, not bolted on as an afterthought. Here's how we think about building.

AI as Team Members

We treat Claude and Gemini as team members with specific roles, not just tools. Operations Lead handles strategy, Implementation Lead writes code.

Unified Customer View

HubSpot is our Customer Value Platform, not just a CRM. Every interaction enriches our understanding of how to create value.

Content is Knowledge

635+ episodes represent institutional knowledge. Transcription and AI processing make that knowledge searchable and actionable.

Autonomous Maintenance

Butler agents handle the boring but important tasks. Code hygiene, documentation sync, and data integrity run without supervision.

Transparency Multiplies Value

Sharing how we work creates more value than protecting it. This page exists because we believe knowledge compounds when shared.

Start Simple, Add Complexity

No traditional database because we dont need one yet. No Stripe because HubSpot Commerce works. Complexity should be earned.

Want to learn how we apply these principles to transform B2B organizations?

See How We Help

Last updated: December 29, 2025