skills.rest
devturco
devturcoCOMMUNITY
Explore all skills by this author →
GitHub

debug

Trace frontend-to-backend data flow across tRPC, auth middleware, and Drizzle.

Updated May 23, 2026
Search Tags:#debugging#react#drizzle#trpc#tanstack query#auth#schema mismatch
One-click install
npx skills add https://github.com/devturco/thiago-dev-template --skill debug-devturco
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: debug
Source: https://github.com/devturco/thiago-dev-template/tree/main/.claude/skills/debug
Command: npx skills add https://github.com/devturco/thiago-dev-template --skill debug-devturco

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

It reduces time spent guessing by systematically tracing a failing feature from the frontend request down to the backend procedure, auth context, and database query, then applying the smallest safe fix.

Core Features & Use Cases

  • End-to-end data flow tracing: Follows the path from UI components through tRPC hooks, middleware, handlers, and Drizzle queries.
  • Targeted isolation: Helps narrow issues to the specific recent change set using version history signals like diffs.
  • Common stack-specific failure detection: Highlights frequent causes such as Zod/Zod-v4 import mismatches, auth context/header wiring issues, TanStack Query cache invalidation gaps, and Drizzle query builder misuse.

Quick Start

Use the debug skill to analyze and fix the issue described as: Your app shows the wrong data after submitting a mutation, and the server logs indicate a validation or auth context problem.

Frequently Asked Questions about debug

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

FAQPage Schema
How do I trace a tRPC mutation error from my React frontend to the Drizzle database?▼

To trace a tRPC mutation error, follow the data flow from React UI components through tRPC hooks, auth middleware, and Drizzle queries to isolate the failure. This systematic tracing reduces guessing by pinpointing the exact frontend-to-backend disconnect.

Why does my TanStack Query cache show stale data after a tRPC mutation?▼

TanStack Query cache shows stale data when query invalidation is missing or misconfigured after mutations. Verify that your cache invalidation logic correctly triggers refetches to ensure the UI reflects the latest backend state changes.

What causes a schema mismatch error between Zod and Drizzle in a fullstack app?▼

A schema mismatch error between Zod and Drizzle occurs when frontend validation rules do not align with backend database schemas. Debugging this requires validating schema alignment across your tRPC procedures to ensure data shapes match exactly.

How do I fix auth context issues in a tRPC protectedProcedure?▼

Fixing auth context issues in a tRPC protectedProcedure involves checking the auth header and session wiring. You must verify that your auth middleware correctly passes the session context to downstream handlers to prevent unauthorized or failed data access.

Can I debug SSR data-fetching problems with TanStack Router and tRPC?▼

Yes, you can debug SSR data-fetching problems by verifying server-side rendering expectations against your tRPC query setup. This process ensures that initial server loads fetch and hydrate data correctly without runtime mismatches.

Related Skills

Explore More Software Engineering Skills→
devturcodevturco

add-feature

Add fullstack features with Zod 4, Drizzle, tRPC, and TanStack Router.

Community
Advanced
mopeyjellyfishmopeyjellyfish
1

test-driven-development

Coordinate red-green-refactor cycles to validate one behavior at a time.

Community
Advanced
neverinfamousneverinfamous
19

trpc

Create end-to-end typesafe APIs for TypeScript backends with tRPC.

Community
Intermediate
AmidVoshakulAmidVoshakul

distributed-tracing

Implement distributed tracing with Jaeger and Tempo across microservices.

Community
Advanced