debug:nextjs
Next.js Debugging Guide
This guide provides a systematic approach to debugging Next.js applications, covering common error patterns, debugging tools, and resolution strategies for both development and production environments.
Common Error Patterns
1. Hydration Mismatches
Symptoms:
Warning: Text content did not match. Server: '...' Client: '...'
Warning: Expected server HTML to contain a matching <div> in <div>
Hydration failed because the initial UI does not match what was rendered on the server
Common Causes:
- Using
Date.now(),Math.random(), or timestamps in render - Browser-only APIs accessed during SSR (
window,localStorage,document) - Conditional rendering based on client-only state
More from snakeo/claude-debug-and-refactor-skills-plugin
refactor:flutter
Refactor Flutter/Dart code to improve maintainability, readability, and performance. This skill applies Dart 3 features like records, patterns, and sealed classes, implements proper state management with Riverpod or BLoC, and uses Freezed for immutable models. It addresses monolithic widgets, missing const constructors, improper BuildContext usage, and deep nesting. Apply when you notice widgets doing too much, performance issues from unnecessary rebuilds, or legacy Dart 2 patterns.
60refactor:nestjs
Refactor NestJS/TypeScript code to improve maintainability, readability, and adherence to best practices. Identifies and fixes circular dependencies, god object services, fat controllers with business logic, deep nesting, and SRP violations. Applies NestJS patterns including proper module organization, provider scopes, custom decorators, guards, interceptors, pipes, DTOs with class-validator, exception filters, CQRS, repository pattern, and event-driven architecture. Transforms code into exemplary implementations following SOLID principles.
42refactor:spring-boot
Refactor Spring Boot and Java code to improve maintainability, readability, and adherence to enterprise best practices. This skill transforms messy Spring Boot applications into clean, well-structured solutions following SOLID principles and Spring Boot 3.x conventions. It addresses fat controllers, improper transaction boundaries, field injection anti-patterns, and scattered configuration. Leverages Java 21+ features including record patterns, pattern matching for switch, virtual threads, and sequenced collections.
39debug:flutter
Debug Flutter applications systematically with this comprehensive troubleshooting skill. Covers RenderFlex overflow errors, setState() after dispose() issues, null check operator failures, platform channel problems, build context errors, and hot reload failures. Provides structured four-phase debugging methodology with Flutter DevTools, widget inspector, performance profiling, and platform-specific debugging for Android, iOS, and web targets.
38refactor:nuxtjs
Refactor Nuxt.js/Vue code to improve maintainability, readability, and adherence to best practices. Identifies and fixes DRY violations, oversized components, deep nesting, SRP violations, data fetching anti-patterns with useFetch/useAsyncData/$fetch, poor composable organization, and mixed business/presentation logic. Applies Nuxt 3 patterns including auto-imports, proper data fetching, single-responsibility composables, TypeScript integration, runtime config, Nitro server routes, Nuxt Layers, middleware patterns, Pinia state management, and performance optimizations.
36refactor:django
Refactor Django/Python code to improve maintainability, readability, and adherence to best practices. Transforms fat views, N+1 queries, and outdated patterns into clean, modern Django code. Applies Python 3.12+ features like type parameter syntax and @override decorator, Django 5+ patterns like GeneratedField and async views, service layer architecture, and PEP 8 conventions. Identifies and fixes anti-patterns including mutable defaults, bare exceptions, and improper ORM usage.
35