jake/clawdbot-workspace
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity
clawdbot-workspace/jakes-learning-guide.md

50 KiB
Raw Blame History

Jake Shore's Tech Stack & Business Operations — Complete Learning Guide

A comprehensive syllabus for mastering full-stack AI product development, MCP protocol engineering, business automation, and creative tech.

1. Executive Summary

Jake Shore is a full-stack developer and technical entrepreneur who builds AI-powered products at the intersection of developer tooling, business automation, and creative technology. His flagship work includes 30+ MCP (Model Context Protocol) servers spanning CRM, advertising, communications, and workflow automation platforms — totaling ~240 tools with rich visual app interfaces. His centerpiece product, LocalBosses, is a Next.js application with a Discord-like UI that embeds MCP apps via iframe with intent-based smart filtering, powered by Anthropic's Claude API with real-time streaming responses. He operates across multiple verticals: EdTech (The Burton Method LSAT platform), commercial real estate CRM (CRE Sync/Real Connect V2), music technology (Remix Sniper Discord bot, bass music production, artist management), and market intelligence (competitive analysis across 30 companies, 10 SMB verticals).

Jake's technical range is unusually broad. He writes production TypeScript across the entire stack — from Three.js 3D visualizations and Remotion video generation to Puppeteer-based web scraping with anti-detection measures, n8n/Make.com workflow automation, and Docker containerized deployments on Vercel and Railway. His business acumen matches his technical depth: he builds revenue models, pricing strategies, and probability-based investment frameworks alongside the code. He leverages Clawdbot (an AI assistant framework with skills, memory, cron, and multi-channel support) as his operational backbone, and integrates tools like Google Veo 3, ffmpeg, and Supabase/Postgres into cohesive systems. Understanding Jake's work means understanding how a single developer can architect, build, ship, and monetize sophisticated AI-native products across wildly different domains.

2. Syllabus

Module 1: Foundations — TypeScript, Node.js, React/Next.js, Git

Learning Objectives:

  • Write fluent, type-safe TypeScript with generics, utility types, discriminated unions, and module patterns
  • Build Node.js applications with ES modules, async patterns, and the standard library
  • Create React applications with hooks, context, server components, and the App Router in Next.js
  • Use Git professionally (branching strategies, rebasing, monorepo management)

Key Concepts:

  • TypeScript: type vs interface, generics (<T>), Zod for runtime validation, tsconfig.json configuration for Node + browser targets
  • Node.js: Event loop, streams, child_process, ES module resolution ("type": "module"), environment variables
  • React: Component lifecycle, useState/useEffect/useRef/useCallback, Server Components vs Client Components, Suspense boundaries
  • Next.js: App Router, page.tsx/layout.tsx/loading.tsx, Server Actions, API routes (route.ts), middleware, ISR/SSG/SSR rendering strategies
  • Git: Feature branches, interactive rebase, .gitignore, monorepo tools (turborepo/nx)

Estimated Time: 4-6 weeks (if starting from intermediate JavaScript)

Module 2: AI & LLM Integration — Anthropic API, Vercel AI SDK, Prompt Engineering

Learning Objectives:

  • Call the Anthropic Messages API directly and via the Vercel AI SDK
  • Design system prompts that control AI behavior, persona, and output format
  • Implement streaming responses with proper UI feedback
  • Build tool-use flows where the LLM calls functions and you return results
  • Understand token economics, context windows, and model selection

Key Concepts:

  • Anthropic Messages API: /v1/messages, system / user / assistant roles, max_tokens, temperature, tool definitions
  • Vercel AI SDK: useChat hook, streamText, generateText, tool definitions, onToolCall handlers
  • Prompt Engineering: XML-structured prompts, few-shot examples, chain-of-thought, system prompt architecture for multi-tool routing
  • Streaming: Server-Sent Events (SSE), ReadableStream, chunked transfer encoding, UI state management during streams
  • Tool Use: JSON Schema for tool input definitions, multi-turn tool-use conversations, parallel tool calls

Estimated Time: 2-3 weeks

Module 3: MCP Protocol Deep Dive — Servers, Tools, Apps, SDK

Learning Objectives:

  • Understand the MCP architecture: hosts, clients, servers, and the JSON-RPC transport layer
  • Build an MCP server from scratch with tools, resources, and prompts
  • Create rich visual apps using structuredContent HTML renders
  • Integrate with the MCP Apps SDK (JSON-RPC postMessage protocol between host + iframe)
  • Implement lazy-loaded tool packs for large servers (50+ tools)
  • Design intent-based smart filtering for app surfacing

Key Concepts:

  • MCP Protocol: JSON-RPC 2.0 over stdio/SSE, tools/list, tools/call, resources/list, resources/read, prompts/list
  • Server Architecture: Tool definitions with inputSchema (JSON Schema), handler functions, error handling
  • Visual Apps: structuredContent with HTML/CSS renders, responsive layouts, interactive dashboards
  • Apps SDK: window.postMessage protocol, iframe sandboxing, bidirectional communication between host and embedded apps
  • Lazy Loading: Tool pack registration, on-demand loading, memory-efficient server design for 50+ tool servers
  • Real-world patterns: OAuth token forwarding, pagination across APIs, rate limit handling, webhook registration via tools

Estimated Time: 3-4 weeks

Module 4: CRM & Business Automation — GoHighLevel, n8n, Make.com, Webhooks

Learning Objectives:

  • Navigate the GoHighLevel API (OAuth2, sub-accounts, contacts, opportunities, pipelines)
  • Build n8n workflows that connect multiple SaaS tools with conditional logic
  • Design webhook architectures for real-time event processing
  • Implement CRM automation flows: lead capture → qualification → assignment → follow-up
  • Build onboarding flows with conditional branching (Supabase)

Key Concepts:

  • GoHighLevel: OAuth2 app marketplace flow, sub-account architecture, contact/opportunity CRUD, workflow triggers, custom fields/values
  • n8n: Nodes, triggers, expressions, error handling, sub-workflows, credential management, self-hosting
  • Make.com: Scenarios, modules, routers, iterators, data stores, scheduling
  • Webhooks: Inbound webhook receivers (Express/Next.js API routes), outbound webhook registration, HMAC signature verification, retry logic
  • CRM Patterns: Tagging systems, KPI tracking, dialer integration (CallTools), calendar booking (Calendly), document generation (LOI drafting)

Estimated Time: 3-4 weeks

Module 5: Advertising & Marketing Tech — Google Ads API, Meta Marketing API, Search Console API

Learning Objectives:

  • Authenticate with and query the Google Ads API (campaigns, ad groups, keywords, reporting)
  • Use the Meta Marketing API (campaigns, ad sets, ads, insights, audiences)
  • Pull search analytics from Google Search Console API (queries, pages, impressions, clicks, CTR, position)
  • Build dashboards and reporting tools on top of these APIs
  • Understand the advertising data model (campaign → ad group/ad set → ad → creative)

Key Concepts:

  • Google Ads API: OAuth2 + developer token, GAQL (Google Ads Query Language), resource hierarchy, change history, recommendations API
  • Meta Marketing API: Access tokens (system user vs user), campaign structure, Ads Insights API, custom audiences, pixel events
  • Google Search Console: Search Analytics API, URL inspection API, sitemaps API, dimension/filter combinations
  • Reporting: Date range aggregation, metric calculations (ROAS, CPA, CTR), trend analysis, anomaly detection
  • Visual Dashboards: HTML/CSS renders for campaign performance, keyword analysis views, audience breakdowns

Estimated Time: 3-4 weeks

Module 6: Full-Stack Product Development — Next.js Apps, Streaming, iframe Embedding

Learning Objectives:

  • Architect a production Next.js application with a Discord-like UI (channel sidebar, server sidebar, chat interface)
  • Implement real-time streaming AI responses with proper loading states
  • Embed MCP apps via iframes with secure postMessage communication
  • Design intent-based smart filtering (surfacing the right app based on conversation context)
  • Build channel-specific system prompts and tool routing

Key Concepts:

  • Layout Architecture: Nested layouts, sidebar navigation, responsive design, CSS Grid/Flexbox for Discord-style layouts
  • Streaming UI: useChat with streaming, message state management, auto-scroll, markdown rendering, code highlighting
  • iframe Embedding: <iframe sandbox> attributes, postMessage API, origin validation, bidirectional data flow
  • Smart Filtering: Intent classification from conversation, app metadata matching, relevance scoring, dynamic app panel
  • Multi-channel Architecture: Channel models in database, per-channel system prompts, tool routing tables, context isolation
  • Auth & Data: Supabase Auth, Row Level Security (RLS), real-time subscriptions, optimistic updates

Estimated Time: 4-6 weeks

Module 7: Data & Scraping — Puppeteer, Anti-Detection, API Recon, Postgres

Learning Objectives:

  • Build web scrapers with Puppeteer and Playwright
  • Implement anti-detection measures (stealth plugins, fingerprint randomization, session management)
  • Perform API reconnaissance (intercepting network requests, reverse-engineering endpoints)
  • Design Postgres schemas for scraped data storage and tracking
  • Handle rate limits, pagination, and error recovery in scrapers

Key Concepts:

  • Puppeteer/Playwright: Page navigation, element selectors, waitForSelector, screenshot/PDF generation, request interception
  • Anti-Detection: puppeteer-extra-plugin-stealth, user-agent rotation, viewport randomization, cookie management, proxy rotation
  • Session Management: Login persistence, cookie jars, rate limiting (e.g., 50/day caps), scheduling with cron
  • API Recon: Browser DevTools network tab analysis, header reconstruction, authentication token extraction, endpoint mapping
  • Postgres: Schema design for scraped entities, UPSERT patterns, indexing for search, pg / drizzle-orm / prisma usage
  • Scoring Algorithms: Multi-factor scoring (velocity, signal, viral potential, saturation — like Remix Sniper's algorithm)

Estimated Time: 3-4 weeks

Module 8: Creative Tech — Three.js, Remotion, Music Production, Animation

Learning Objectives:

  • Build interactive 3D visualizations with Three.js (scenes, cameras, geometries, materials, animation loops)
  • Create programmatic videos with Remotion (compositions, sequences, spring animations)
  • Understand music production concepts relevant to tech (Ableton, Serum, audio processing)
  • Build animated marketing content and explainer videos

Key Concepts:

  • Three.js: Scene graph, PerspectiveCamera, meshes (geometry + material), OrbitControls, raycasting, particle systems, shaders (GLSL)
  • Interactive Visualizations: Data-driven 3D scenes (genre universe), click interactions, camera transitions, responsive WebGL canvas
  • Remotion: <Composition>, <Sequence>, useCurrentFrame(), interpolate(), spring(), rendering to MP4/GIF
  • Camera Animation: Dolly movements, easing functions, keyframe interpolation, cinematic camera paths
  • Sprite Studio: Frame-by-frame animation, sprite sheets, animated explainer video production
  • Audio/Video Processing: ffmpeg for transcoding, format conversion, audio extraction, thumbnail generation
  • Music Tech: DAW concepts (Ableton), synthesizer programming (Serum), waveform manipulation, MIDI

Estimated Time: 3-4 weeks

Module 9: Business Intelligence — Competitive Analysis, Pricing, Revenue Modeling

Learning Objectives:

  • Conduct structured competitive analysis across a market landscape
  • Build revenue projection models with multiple pricing scenarios
  • Design intake forms and dashboards for market intelligence
  • Analyze SMB verticals for product-market fit
  • Build probability models for investment decisions

Key Concepts:

  • Competitive Analysis: Feature matrices, pricing comparisons, market positioning maps, SWOT analysis, moat identification
  • Revenue Modeling: Bottom-up vs top-down projections, cohort analysis, churn modeling, LTV/CAC calculations
  • Pricing Strategy: Value-based pricing, tiered pricing design, freemium conversion modeling, price sensitivity analysis
  • Market Research: TAM/SAM/SOM estimation, vertical-specific research frameworks, customer interview synthesis
  • SMB Intelligence: 10-vertical research methodology, vertical-specific pain points, technology adoption patterns
  • Probability Models: Expected value calculations, scenario analysis, Monte Carlo basics, catalyst tracking (crypto/macro)
  • Dashboards: Building HTML/CSS visual dashboards for market intel, competitor tracking over time

Estimated Time: 2-3 weeks

Module 10: Infrastructure & DevOps — Docker, Vercel, Railway, Multi-Service Architecture

Learning Objectives:

  • Containerize Node.js/Next.js applications with Docker
  • Deploy to Vercel (frontend/serverless) and Railway (backend/databases/persistent services)
  • Set up cron jobs for automated workflows (daily scans, weekly reports)
  • Design multi-service architectures where MCP servers, web apps, bots, and databases coordinate
  • Manage environment variables, secrets, and deployment pipelines

Key Concepts:

  • Docker: Dockerfile (multi-stage builds), docker-compose.yml, volume mounts, networking between containers, health checks
  • Vercel: vercel.json configuration, serverless function limits, edge functions, preview deployments, environment variables
  • Railway: Service deployment, Postgres provisioning, persistent storage, custom domains, logging, cost management
  • Cron & Scheduling: Node-cron, system crontab, Railway cron services, n8n scheduled workflows
  • Multi-Service Architecture: Service communication patterns (HTTP, webhooks, queues), shared databases, API gateways
  • Clawdbot Framework: Skills system, memory management, cron tasks, multi-channel support (Discord, etc.)
  • CI/CD: GitHub Actions basics, automated testing, deployment pipelines, branch protection

Estimated Time: 2-3 weeks

3. YouTube Resources

Module 1: Foundations

Topic Video/Channel URL
TypeScript in 100 Seconds Fireship https://www.youtube.com/watch?v=zQnBQ4tB3ZA
React in 100 Seconds Fireship https://www.youtube.com/watch?v=Tn6-PIqc4UM
Next.js in 100 Seconds + Full Tutorial Fireship https://www.youtube.com/watch?v=Sklc_fQBmcs
Node.js Crash Course 2024 Traversy Media https://www.youtube.com/watch?v=32M1al-Y6Ag
Express.js Crash Course Traversy Media https://www.youtube.com/watch?v=CnH3kAXSrmU
Advanced Next.js Patterns Jack Herrington https://www.youtube.com/@jherr
ProNextJS Course (free tutorials) Jack Herrington https://www.pronextjs.dev/tutorials
TypeScript Full Stack (opinions + depth) Theo - t3.gg https://www.youtube.com/c/TheoBrowne1017
Fireship Channel (all 100 Seconds series) Fireship https://www.youtube.com/c/Fireship

Module 2: AI & LLM Integration

Topic Video/Channel URL
Claude AI Prompt Engineering Guide (2025) Skill Leap AI https://www.youtube.com/watch?v=dG2iFVKdyhs
Build AI Chatbot with Vercel AI SDK NestJS + Next.js tutorial https://www.youtube.com/watch?v=ad_g8ajmFy0
Anthropic's Interactive Prompt Engineering Tutorial Anthropic (GitHub) https://github.com/anthropics/prompt-eng-interactive-tutorial
AI Tools for Developers Matt Wolfe https://www.youtube.com/@mreflow
Anthropic Academy: Build with Claude Anthropic https://www.anthropic.com/learn/build-with-claude

Module 3: MCP Protocol Deep Dive

Topic Video/Channel URL
MCP Explained in 20 Minutes Shaw Talebi https://www.youtube.com/watch?v=N3vHJcHBS-w
MCP Clearly Explained (Why It Matters) Greg Isenberg https://www.youtube.com/watch?v=7j_NE6Pjv-E
You Need to Learn MCP RIGHT NOW TechWorld with Nana https://www.youtube.com/watch?v=GuTcle5edjk
MCP End-to-End Course 2025 (Playlist) Sunny Savita https://www.youtube.com/playlist?list=PL6tW9BrhiPTCDteflzehKS6Cn3a79-iCs
Anthropic's Introduction to MCP (Official Course) Anthropic https://anthropic.skilljar.com/introduction-to-model-context-protocol
Build an MCP Server (Official Docs) MCP https://modelcontextprotocol.io/docs/develop/build-server

Module 4: CRM & Business Automation

Topic Video/Channel URL
GoHighLevel SaaS Mode Setup (2024) GHL Tutorials https://www.youtube.com/watch?v=5F9spSSExoI
GoHighLevel Complete Setup Tutorial (2025) Keaton Walker https://www.youtube.com/watch?v=eQudUY-w3vg
GoHighLevel Calendars Automation Dom Bavaro https://www.youtube.com/watch?v=9sT2Nr6t7Bo
n8n Complete Beginner Course (2025) n8n Official (Playlist) https://www.youtube.com/playlist?list=PLYLEmQupIzOEEvgtBduSgYLaug7LKqlSo
n8n Quick Start Tutorial (2025) The Flowgrammer https://www.youtube.com/watch?v=4cQWJViybAQ
n8n Full Course for Beginners freeCodeCamp / Gavin Lon https://www.youtube.com/watch?v=GIZzRGYpCbM

Module 5: Advertising & Marketing Tech

Topic Video/Channel URL
Google Ads API Video Guides (Official) Google Ads Developers https://www.youtube.com/c/GoogleAdsDevelopers
Google Ads API Video Catalog Google for Developers https://developers.google.com/google-ads/api/videos/catalog
Matt Wolfe - Best AI Tools for Marketers Matt Wolfe https://www.youtube.com/watch?v=DeeVKUuEv6Y

Module 6: Full-Stack Product Development

Topic Video/Channel URL
Build an AI Chatbot with Streaming Vercel AI SDK tutorial https://www.youtube.com/watch?v=ad_g8ajmFy0
Supabase Full-Stack Course Fireship / Supaship https://fireship.io/courses/supabase/
Supabase Official Channel Supabase https://www.youtube.com/c/supabase
Advanced React/Next.js Patterns Jack Herrington https://www.youtube.com/@jherr
Next.js AI Chatbot Template Vercel https://vercel.com/templates/next.js/nextjs-ai-chatbot

Module 7: Data & Scraping

Topic Video/Channel URL
Puppeteer Anti-Detection Scraping Coding with Robby https://www.youtube.com/watch?v=9zwyfrVv3hg
Puppeteer Stealth Guide ScrapingBee Blog https://www.scrapingbee.com/blog/puppeteer-stealth-tutorial-with-examples/

Module 8: Creative Tech

Topic Video/Channel URL
Three.js Journey (Full Course) Bruno Simon https://threejs-journey.com/
Three.js + Prismic Tutorial Bruno Simon https://www.youtube.com/watch?v=tVr89249gwM
Three.js Learning Path 2025 threejsresources.com https://threejsresources.com/blog/three-js-learning-path-from-zero-to-mastery
Remotion - Create Videos with React Jonny Burger (creator) https://www.youtube.com/watch?v=gwlDorikqgY
Building Videos with React & Remotion Maximilian Schwarzmüller https://www.youtube.com/watch?v=qlYhdO11EfQ

Module 10: Infrastructure & DevOps

Topic Video/Channel URL
Docker in 100 Seconds Fireship https://www.youtube.com/watch?v=Gjnup-PuquQ
Kubernetes in 100 Seconds Fireship https://www.youtube.com/watch?v=PziYflu8cB8
Railway Quick Start Railway Docs https://docs.railway.com/quick-start

4. Articles & Documentation

Core Platform Docs

Resource URL
MCP Protocol Specification https://modelcontextprotocol.io/
MCP — Build a Server (Official Tutorial) https://modelcontextprotocol.io/docs/develop/build-server
MCP Reference Servers (GitHub) https://github.com/modelcontextprotocol/servers
Anthropic API Docs (Messages API) https://docs.anthropic.com/en/api/messages
Anthropic Prompt Engineering Guide https://platform.claude.com/docs/en/build-with-claude/prompt-engineering/overview
Anthropic Prompt Engineering Tutorial (Interactive) https://github.com/anthropics/prompt-eng-interactive-tutorial
Anthropic Academy https://www.anthropic.com/learn/build-with-claude
Vercel AI SDK Docs https://ai-sdk.dev/docs/introduction
Next.js Documentation https://nextjs.org/docs
React Documentation https://react.dev/
TypeScript Handbook https://www.typescriptlang.org/docs/handbook/
Node.js Documentation https://nodejs.org/docs/latest/api/

Automation & CRM

Resource URL
GoHighLevel API Docs https://marketplace.gohighlevel.com/docs/
GoHighLevel Support Portal https://help.gohighlevel.com/support/solutions/articles/48001060529-highlevel-api
n8n Documentation https://docs.n8n.io/
Make.com Documentation https://www.make.com/en/help

Advertising APIs

Resource URL
Google Ads API — Getting Started https://developers.google.com/google-ads/api/docs/get-started/introduction
Google Ads API — GAQL Reference https://developers.google.com/google-ads/api/docs/query/overview
Meta Marketing API — Getting Started https://developers.facebook.com/docs/marketing-api/get-started/
Meta Marketing API — Insights https://developers.facebook.com/docs/marketing-api/insights/
Google Search Console API https://developers.google.com/webmaster-tools
Google Search Console API — Getting Started https://developers.google.com/webmaster-tools/v1/getting-started

Creative Tech

Resource URL
Three.js Documentation https://threejs.org/docs/
Three.js Examples https://threejs.org/examples/
Three.js Journey (Course) https://threejs-journey.com/
Remotion Documentation https://www.remotion.dev/docs/
Remotion GitHub https://github.com/remotion-dev/remotion

Data & Infrastructure

Resource URL
Supabase Documentation https://supabase.com/docs
PostgreSQL Documentation https://www.postgresql.org/docs/
Puppeteer Documentation https://pptr.dev/
Playwright Documentation https://playwright.dev/docs/intro
Puppeteer Stealth Plugin https://github.com/berstend/puppeteer-extra/tree/master/packages/puppeteer-extra-plugin-stealth
Docker Documentation https://docs.docker.com/
Vercel Documentation https://vercel.com/docs
Railway Documentation https://docs.railway.com/

Business & Strategy

Resource URL
Anthropic's MCP Announcement https://www.anthropic.com/news/model-context-protocol
Streaming AI Responses in Next.js (LogRocket) https://blog.logrocket.com/nextjs-vercel-ai-sdk-streaming/
Puppeteer Web Scraping Guide 2025 https://www.browserless.io/blog/ultimate-guide-to-puppeteer-web-scraping-in-2025

5. AI Rabbit Hole Prompts

Module 1: Foundations

  1. "Explain TypeScript's type system in depth. Cover generics with constraints (<T extends Base>), conditional types (T extends U ? X : Y), mapped types, template literal types, and the infer keyword. Give me real-world examples of each that I'd actually use in a Next.js application."

  2. "Walk me through the Node.js event loop in detail. Explain the phases (timers, pending callbacks, poll, check, close), how process.nextTick and queueMicrotask fit in, and how this affects async/await patterns. Show me common mistakes developers make with the event loop."

  3. "Explain React Server Components vs Client Components in Next.js App Router. When should I use 'use client'? How do Server Actions work? Walk me through the rendering lifecycle of a page that has both server and client components, including how data flows between them."

  4. "I'm building a Next.js 14+ app with the App Router. Explain the file-based routing system in depth: page.tsx, layout.tsx, loading.tsx, error.tsx, not-found.tsx, route groups (group), parallel routes @slot, and intercepting routes (.). Give me a real example of a complex routing setup."

  5. "Explain ES Modules in Node.js vs CommonJS. How does 'type': 'module' in package.json work? What are the gotchas with __dirname, require, and interop between ESM and CJS? How should I configure tsconfig.json for a Node.js project using ES Modules with TypeScript?"

  6. "Design a TypeScript project structure for a monorepo that has: a Next.js frontend, a Node.js MCP server, shared types, and a Postgres database layer. Explain the directory structure, tsconfig setup for each package, and how to share types between frontend and backend."

  7. "Explain Zod for runtime validation in TypeScript. How does z.infer<typeof schema> work? Show me patterns for validating API inputs, environment variables, and webhook payloads. How does Zod compare to io-ts and yup?"

Module 2: AI & LLM Integration

  1. "Explain the Anthropic Messages API in detail. What are the fields in a messages request (model, max_tokens, system, messages, tools, temperature)? Walk me through the response format, including streaming with Server-Sent Events. Show me the TypeScript types for the request and response."

  2. "I'm using the Vercel AI SDK with Next.js and Anthropic's Claude. Explain how useChat works on the client side, how streamText works on the server side, and how the two connect. Show me the complete code for a streaming chat interface with error handling and loading states."

  3. "Explain tool use with Claude in depth. How do I define tools with JSON Schema? Walk me through the multi-turn conversation flow where Claude calls a tool, I return the result, and Claude uses it in its response. What are tool_use and tool_result content blocks?"

  4. "I'm designing system prompts for a multi-channel chat application where different channels have different tools available. Explain how to architect system prompts that: (1) define the AI's persona, (2) list available tools contextually, (3) handle tool routing, and (4) maintain conversation context. Give me a real example."

  5. "Explain prompt engineering best practices for Claude specifically. Cover XML-structured prompts, giving Claude a role, prefilling assistant responses, using examples (few-shot), chain-of-thought reasoning, and how to handle long context windows effectively. What are Claude-specific tricks that don't work as well with GPT?"

  6. "Compare the Vercel AI SDK, LangChain, and calling the Anthropic API directly. When should I use each? What are the tradeoffs in terms of abstraction, flexibility, streaming support, and tool use? I'm building a production chat app — which approach gives me the most control?"

  7. "Explain token economics for building AI-powered products. How do I estimate costs for a chat application with streaming responses? What's the difference between input and output tokens? How do I optimize prompts to reduce token usage without losing quality? What's the cost difference between Claude Sonnet and Opus?"

Module 3: MCP Protocol Deep Dive

  1. "Explain the MCP protocol architecture. How does a host communicate with an MCP server? Walk me through the JSON-RPC message flow for listing tools and calling a tool, including the TypeScript types involved. What are the three primitives (tools, resources, prompts) and when should I use each?"

  2. "I want to build an MCP server in TypeScript that wraps a REST API (like ServiceTitan or Gusto). Walk me through the complete setup: project structure, the @modelcontextprotocol/sdk package, defining tools with inputSchema, implementing handlers, and testing with the MCP inspector. Give me working code."

  3. "Explain MCP's structuredContent for rich UI rendering. How do I return HTML/CSS in tool responses that the host can render as visual apps? Walk me through building a dashboard-style visual app that displays data in a styled HTML layout. What are the security considerations?"

  4. "I'm building a large MCP server with 50+ tools (like a GoHighLevel integration with 65 apps). How should I organize the code? Explain patterns for: tool registration, lazy-loaded tool packs, category-based organization, shared utilities, and keeping the server performant."

  5. "Explain the MCP Apps SDK and JSON-RPC postMessage protocol. How does a host application embed MCP apps in iframes and communicate with them? Walk me through the bidirectional message flow, security model (origin validation, sandboxing), and how to build an interactive app that sends data back to the host."

  6. "I need to build intent-based smart filtering for MCP apps. When a user is chatting with an AI, I want to automatically surface the most relevant visual app (e.g., show a 'Campaign Dashboard' app when discussing Google Ads performance). Explain how to design this system: intent classification, app metadata, relevance scoring, and the UI pattern."

  7. "Walk me through building an MCP server for the Twilio API with 54 tools and 23 visual apps. How do I handle: OAuth token management, SMS/call operations, webhook configuration, usage analytics dashboards, and conversation history views? Focus on the architecture decisions."

  8. "Compare MCP to other AI-tool protocols (OpenAI's function calling, LangChain tools, custom tool systems). What makes MCP different? Why would I build an MCP server instead of a custom API? What are the advantages of the standardized protocol?"

Module 4: CRM & Business Automation

  1. "I'm building a GoHighLevel integration. Explain the OAuth2 flow for GHL's API, how sub-accounts work, and how to structure webhooks for real-time contact updates. What's the difference between agency-level and sub-account-level API access?"

  2. "Design an n8n workflow that: (1) receives a webhook from GoHighLevel when a new contact is created, (2) enriches the contact data by calling an external API, (3) creates a task in Trello, (4) sends a Slack notification, and (5) updates the contact in GHL with the enriched data. Walk me through each node and the error handling."

  3. "Explain how to build a conditional onboarding flow using Supabase. A new user signs up, and based on their answers to intake questions, they're routed to different onboarding paths with different data collected. Show me the database schema, the API routes, and the frontend flow."

  4. "I'm integrating CallTools (a dialer) with GoHighLevel for a commercial real estate CRM. Explain: how to set up call disposition webhooks, how to track KPIs (calls made, contacts reached, appointments set), and how to automate follow-up sequences based on call outcomes."

  5. "Compare n8n vs Make.com vs Zapier for building business automations. I need: complex conditional logic, API integrations, self-hosting capability, and webhook handling. Which platform is best for each use case? Can I use them together?"

  6. "Explain how to build a lead scoring system in a CRM. A lead comes in from multiple sources (web form, API, referral). I need to: assign initial scores, adjust based on engagement (email opens, page visits, form fills), and trigger automated actions when scores cross thresholds. Show me the data model and automation logic."

Module 5: Advertising & Marketing Tech

  1. "Walk me through the Google Ads API authentication flow for a production application. Explain: developer tokens, OAuth2 client credentials, refresh tokens, the google-ads-api npm package, and how to make your first GAQL query to fetch campaign performance data."

  2. "Explain GAQL (Google Ads Query Language) in depth. How do I query campaigns, ad groups, keywords, and search terms? Show me queries for: top spending campaigns, keyword performance with quality scores, search term reports, and audience performance. How does GAQL compare to SQL?"

  3. "I'm building a Meta Ads reporting tool. Explain the Facebook Marketing API's campaign structure (Campaign → Ad Set → Ad), how to query the Insights API for performance metrics, and how to handle the asynchronous report generation flow. Show me the API calls and response formats."

  4. "Explain how to build a Google Search Console analytics dashboard. I need to: pull search query data, track keyword rankings over time, identify content gaps, and compare performance across date ranges. Walk me through the API calls, data processing, and visualization approach."

  5. "Design a unified advertising dashboard that pulls data from Google Ads, Meta Ads, and Google Search Console into a single view. How do I normalize the metrics across platforms? What's the common data model? How do I handle the different date ranges, attribution models, and rate limits?"

  6. "I want to build automated alerting for advertising campaigns. If a campaign's CPA exceeds a threshold, or spend is pacing too fast, or conversions drop significantly — I want to get notified. Explain the architecture: polling intervals, metric calculations, anomaly detection logic, and notification delivery."

Module 6: Full-Stack Product Development

  1. "I'm building a Next.js app with a Discord-like UI: left sidebar for servers, second sidebar for channels within a server, main content area for chat, and a right panel for contextual tools/apps. Walk me through the component architecture, layout system (CSS Grid), and responsive behavior."

  2. "Explain how to implement real-time streaming AI responses in a Next.js chat interface. Cover: the server-side streaming with ReadableStream, client-side consumption with useChat, progressive rendering of markdown, auto-scrolling behavior, and how to show typing indicators. Give me production-quality code."

  3. "I need to embed third-party apps (MCP visual apps) in iframes within my Next.js chat application. Explain: secure iframe sandboxing, the postMessage protocol for bidirectional communication, how to pass data from the chat context to the iframe app, and how to handle iframe loading states and errors."

  4. "Design a system where different chat channels have different AI personas and tool sets. Channel A is a 'Marketing Assistant' with access to Google Ads tools, Channel B is a 'CRM Manager' with GoHighLevel tools. Explain the database schema, system prompt architecture, and tool routing logic."

  5. "Walk me through building an intent-based app filtering system. During a chat conversation, I want to dynamically show relevant visual apps in a sidebar panel. For example, if the user asks about 'campaign performance,' show the Campaign Dashboard app. Explain: intent extraction, app registry design, relevance scoring, and smooth UI transitions."

  6. "Explain how to handle authentication and authorization in a multi-tenant Next.js application using Supabase. Cover: Supabase Auth (magic links, OAuth), Row Level Security policies, organization/team membership, and how to scope data access per user."

  7. "I want to add real-time collaboration features to my chat app (presence indicators, typing status, live updates when other users send messages). Explain how to implement this with Supabase Realtime subscriptions, and how to handle optimistic updates and conflict resolution."

Module 7: Data & Scraping

  1. "I'm building a web scraper with Puppeteer that needs to avoid detection. Explain: puppeteer-extra-plugin-stealth, what browser fingerprints are checked (WebDriver, navigator properties, WebGL renderer), how to randomize fingerprints, and how to manage sessions across multiple scraping runs."

  2. "Walk me through building a Reonomy-style property data scraper (v13 level). Cover: session management for authenticated scraping, rate limiting (50 requests/day), request queuing, data extraction with CSS selectors, error recovery, and Postgres storage for the extracted data."

  3. "Explain API reconnaissance techniques. I have a web application that loads data dynamically. How do I: intercept network requests in Puppeteer, identify the underlying API endpoints, reconstruct the authentication headers, and build a direct API client that's more efficient than browser automation?"

  4. "Design a Postgres schema for a remix opportunity tracking system (like Remix Sniper). I need to: store song data from multiple sources (Spotify, Shazam, TikTok, SoundCloud), track scores over time, record prediction accuracy, and query for the best current opportunities. Show me the schema and key queries."

  5. "Explain how to build a multi-factor scoring algorithm. I'm scoring music tracks for remix potential based on: velocity (growth rate), signal strength, viral coefficient, market saturation, label tolerance, and audio fit. How do I normalize these factors, weight them, and combine into a single score? Show me the math and the TypeScript implementation."

  6. "I need to schedule daily and weekly scraping jobs. Explain the options: node-cron in a long-running process, system crontab, Railway cron services, n8n scheduled workflows. Which is best for: a Discord bot that scans Spotify daily, a web scraper that runs 50 times per day, and a weekly report generator?"

Module 8: Creative Tech

  1. "Walk me through building an interactive 3D genre universe visualization with Three.js. I want to: create a scene with floating spheres representing music genres, size them by popularity, color them by category, add labels, enable orbit controls for navigation, and add click interactions that show genre details."

  2. "Explain how to build a marketing animation with Remotion. I want to create a 30-second video that: shows a product logo, animates text with spring physics, does a dolly camera movement through a scene, and renders to MP4. Walk me through the composition structure, animation utilities, and rendering pipeline."

  3. "I want to create animated explainer videos using code. Compare Remotion, Motion Canvas, and traditional tools like After Effects/Sprite Studio. For a developer who thinks in code, which approach gives the best results for: product demos, social media clips, and educational content?"

  4. "Explain ffmpeg for developers. I need to: transcode video formats, extract audio from video, generate thumbnails at specific timestamps, concatenate clips, add text overlays, and compress for web delivery. Give me the ffmpeg commands and explain how to call them from Node.js."

  5. "Walk me through Three.js shaders (GLSL). I want to create a custom material that: has a gradient color based on vertex position, pulses with time, and responds to mouse position. Explain vertex shaders, fragment shaders, uniforms, varyings, and how to integrate custom shaders in a Three.js scene."

Module 9: Business Intelligence

  1. "I'm conducting competitive analysis on 30 companies in the MCP ecosystem. Design a structured framework: what data to collect (pricing, features, team size, funding, positioning), how to organize it (spreadsheet vs database), how to identify competitive advantages and gaps, and how to present findings. Give me the actual template."

  2. "Build a revenue projection model for a SaaS product that sells MCP servers. I have three pricing tiers ($29/$99/$299), an estimated market of 10,000 potential customers, and 5% monthly growth. Walk me through: bottom-up revenue modeling, churn assumptions, LTV/CAC calculations, and how to present this to investors."

  3. "I need to research 10 SMB verticals (plumbing, HVAC, legal, dental, etc.) for product-market fit. Design a research framework: what questions to answer for each vertical, where to find the data, how to score vertical attractiveness, and how to present a recommendation on which vertical to target first."

  4. "Explain how to build probability models for investment decisions. I'm tracking Bitcoin/crypto catalysts and want to assign probabilities to different scenarios, calculate expected values, and update my beliefs as new information comes in. Walk me through Bayesian updating for investment analysis."

  5. "Design an intake form and dashboard system for competitor research. A user fills out a form with their company details and competitors, and the system generates a competitive analysis dashboard. Explain: form design, data collection, analysis logic, and the HTML/CSS dashboard layout."

Module 10: Infrastructure & DevOps

  1. "Write a production Dockerfile for a Next.js 14 application with: multi-stage builds, minimal final image size, proper .dockerignore, environment variable handling, and health check configuration. Explain each stage and why it's structured that way."

  2. "I'm deploying a multi-service architecture: a Next.js frontend on Vercel, an MCP server on Railway, a Postgres database on Railway, and a Discord bot on Railway. Explain: how to set up each service, configure networking between them, manage shared environment variables, and handle deployments. What are the cost considerations?"

  3. "Design a cron-based automation system for a Discord bot. I need: daily scans at 6 AM (scrape Spotify for new tracks), weekly reports every Monday (generate and post analytics), and real-time webhook processing. Explain the architecture: where each job runs, how to handle failures, and how to monitor execution."

  4. "Explain the Clawdbot AI assistant framework architecture. It has: skills, memory, cron, multi-channel support (Discord, etc.), and a workspace system. How would I design a similar framework? What are the key abstractions? How does memory work across sessions? How does cron integrate with an LLM?"

  5. "I'm managing 30+ MCP servers and multiple web applications. Design a CI/CD pipeline with GitHub Actions that: runs tests, builds Docker images, deploys to Railway/Vercel, and handles rollbacks. How do I manage the complexity of many services without drowning in configuration?"

  6. "Explain the tradeoffs between Vercel, Railway, Fly.io, and running your own VPS for different types of services. I have: serverless API routes, long-running processes, WebSocket servers, and cron jobs. Which platform is best for each? How do I minimize costs while maintaining reliability?"

6. Hands-On Projects

Project 1: Simple MCP Server with 5 Tools

Difficulty: ⭐⭐ | Time: 1 week

What you build: An MCP server that wraps the JSONPlaceholder API (or any simple REST API) with 5 tools: list users, get user by ID, list posts by user, create post, search posts.

Skills practiced:

  • MCP SDK setup and TypeScript configuration
  • Tool definition with JSON Schema input validation
  • HTTP requests from tool handlers
  • Testing with MCP inspector

Steps:

  1. Initialize a Node.js project with TypeScript and @modelcontextprotocol/sdk
  2. Define 5 tools with proper inputSchema using JSON Schema
  3. Implement handlers that call the REST API and return formatted results
  4. Add error handling for network failures and invalid inputs
  5. Test with the MCP inspector and connect to Claude Desktop

Stretch: Add a 6th tool that returns structuredContent with a simple HTML table.

Project 2: Next.js Chat App with Streaming AI Responses

Difficulty: ⭐⭐⭐ | Time: 2 weeks

What you build: A chat application built with Next.js App Router and the Vercel AI SDK that streams responses from Claude. Has a clean UI with message history, loading states, and markdown rendering.

Skills practiced:

  • Next.js App Router and Server Actions
  • Vercel AI SDK (useChat, streamText)
  • Anthropic API integration
  • Real-time UI updates during streaming
  • Markdown rendering and code highlighting

Steps:

  1. Set up a Next.js 14+ project with the App Router
  2. Create a chat UI with a message list and input form
  3. Implement the API route using streamText with Anthropic's Claude
  4. Connect the UI with useChat hook for streaming
  5. Add markdown rendering (react-markdown) and code syntax highlighting
  6. Implement conversation persistence with localStorage (or Supabase)
  7. Add system prompt configuration

Stretch: Add 2-3 tools (web search, calculator, date/time) and display tool-use in the UI.

Project 3: Full MCP Server with Visual Apps (HTML Renders)

Difficulty: ⭐⭐⭐⭐ | Time: 3 weeks

What you build: An MCP server for a real API (GitHub, Notion, or a CRM) with 15+ tools organized into categories, plus 5+ visual apps that render HTML dashboards.

Skills practiced:

  • Large MCP server architecture and organization
  • Category-based tool registration
  • structuredContent HTML/CSS visual apps
  • OAuth/API key authentication
  • Complex data transformation and formatting

Steps:

  1. Choose a real API with good documentation (GitHub API recommended for learning)
  2. Design 15+ tools across 3-4 categories (e.g., Repos, Issues, Users, Analytics)
  3. Implement category-based code organization (one file per category)
  4. Build 5 visual apps: user profile card, repo stats dashboard, issue tracker view, contribution chart, org overview
  5. Add shared utilities for authentication, pagination, and error handling
  6. Implement lazy-loaded tool packs (tools are registered but handlers loaded on-demand)
  7. Write comprehensive tool descriptions that help the AI use them correctly

Stretch: Implement the MCP Apps SDK protocol for interactive iframes that can send data back to the host.

Project 4: Multi-Channel Automation Platform

Difficulty: ⭐⭐⭐⭐ | Time: 3-4 weeks

What you build: A platform that connects multiple services via webhooks and automated workflows. Includes: a webhook receiver (Next.js API routes), an n8n workflow engine, a Discord bot for notifications, and a Supabase database for tracking.

Skills practiced:

  • Webhook architecture (inbound + outbound)
  • n8n workflow design
  • Discord bot development (discord.js)
  • Supabase schema design and real-time subscriptions
  • Multi-service orchestration
  • Cron scheduling

Steps:

  1. Design the data model in Supabase (events, contacts, tasks, notifications)
  2. Build a webhook receiver that accepts events from multiple sources (form submissions, CRM updates)
  3. Create n8n workflows that: enrich data, route to appropriate channels, trigger follow-ups
  4. Build a Discord bot that: posts notifications, responds to commands, runs scheduled reports
  5. Implement a scoring algorithm for prioritizing incoming leads/events
  6. Add a simple dashboard (Next.js page) that shows system activity
  7. Deploy: Next.js on Vercel, n8n on Railway, Postgres on Railway, bot on Railway

Stretch: Add GoHighLevel or Calendly integration for real CRM automation.

Project 5: Full LocalBosses-Style Product

Difficulty: ⭐⭐⭐⭐⭐ | Time: 6-8 weeks

What you build: A production-grade AI chat platform with: Discord-like UI (servers + channels + chat), multiple MCP server integrations, iframe-embedded visual apps with smart filtering, real-time streaming, and multi-tenant architecture.

Skills practiced:

  • Everything from Projects 1-4, combined
  • Complex UI architecture (multi-panel layouts)
  • iframe embedding with postMessage protocol
  • Intent-based smart filtering
  • Multi-tenant auth and data isolation
  • Production deployment and monitoring

Steps:

  1. Week 1-2: Build the UI shell — server sidebar, channel sidebar, main chat area, right app panel. Use CSS Grid for the layout. Implement routing with Next.js App Router.
  2. Week 2-3: Implement the chat backend — Supabase for message storage, Vercel AI SDK for streaming, system prompts per channel, message history loading.
  3. Week 3-4: Build 2-3 MCP servers — connect them as tool providers. Implement tool routing (Channel A gets MCP Server 1's tools, Channel B gets MCP Server 2's tools).
  4. Week 4-5: Build visual apps for each MCP server — render them as structuredContent HTML. Embed them in the right panel using iframes. Implement the postMessage protocol for bidirectional communication.
  5. Week 5-6: Build intent-based smart filtering — analyze conversation context, match to app metadata, auto-surface the most relevant app in the right panel.
  6. Week 6-7: Add auth (Supabase Auth), multi-tenant data isolation (RLS), user settings, and team/org management.
  7. Week 7-8: Deploy to production — Next.js on Vercel, MCP servers on Railway, Postgres on Railway. Set up monitoring, error tracking, and usage analytics.

Stretch goals:

  • Add real-time presence (who's online, typing indicators)
  • Implement conversation search across channels
  • Build an admin panel for managing servers, channels, and system prompts
  • Add file upload support (images, documents) in chat
  • Integrate Google Ads + Meta Ads MCP servers for a real marketing use case

Appendix: Jake's Complete Tech Stack Reference

Category Technologies
Languages TypeScript, JavaScript, SQL, GLSL, HTML/CSS
Frontend React, Next.js (App Router), Tailwind CSS
Backend Node.js, Express (API routes in Next.js)
AI/LLM Anthropic Claude API, Vercel AI SDK, MCP Protocol
Database Supabase, PostgreSQL, Drizzle ORM
Automation n8n, Make.com, GoHighLevel, Calendly, CallTools
Advertising Google Ads API, Meta Marketing API, Google Search Console API
Communications Twilio, Discord.js
Scraping Puppeteer, Playwright, puppeteer-extra-plugin-stealth
3D/Video Three.js, Remotion, Sprite Studio, ffmpeg
Music Ableton Live, Serum (synth), audio processing
Infrastructure Docker, Vercel, Railway, GitHub Actions
AI Tooling Clawdbot, Google Veo 3 (Vertex AI)
APIs Integrated ServiceTitan, Gusto, Rippling, Mailchimp, Toast, Zendesk, Trello, Close, Pipedrive, Spotify, Shazam, TikTok, SoundCloud

Last updated: February 3, 2026 Guide authored by Clawdbot for Jake Shore's workspace