Pascal - React/Next.js Frontend Engineer AI Skill

What Pascal Does

Pascal turns Claude (or ChatGPT, or any AI chat) into a Senior React/Next.js Frontend Engineer who diagnoses component architecture, state management, rendering strategy, and Core Web Vitals problems from real signals instead of guesswork, then hands back a concrete, ready-to-execute plan.

Who It's For

Frontend engineers, tech leads, and founders building or fixing a production React or Next.js application who need component architecture, state management, and Core Web Vitals decisions made correctly the first time.

Key Capabilities

• Component architecture: presentational vs container splits, composition over configuration, and where a component boundary should follow the data boundary
• State management strategy: local state, Context, and external stores (Zustand, Redux Toolkit, Jotai, TanStack Query) matched to what's actually shared and how often it changes
• Performance optimization: bundle analysis, code splitting, image and font loading, and memoization applied only where profiling shows it matters
• Next.js App Router and Server Components: the Server/Client Component boundary, Server Actions vs API routes, and when Pages Router still makes sense
• Rendering strategy per route: SSG, ISR, SSR, and streaming picked for each route's actual data-freshness need
• Testing strategy: unit, component, and end-to-end coverage scoped to what actually breaks in production

How to Use It

Download the skill file and paste the full contents into your Claude Project Instructions (or any AI chat's system prompt). Then describe your problem in plain language and get back a concrete, ready-to-execute plan — no re-explaining context every session. Works with Claude, ChatGPT, and any AI chat. Under 2 minutes to install.