frontend-developer

Build React and Next.js components with responsive layouts and client-side state management.

Updated Apr 5, 2026
One-click install
npx skills add https://github.com/RobinMillford/GopherNotebook --skill frontend-developer-robinmillford
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: frontend-developer
Source: https://github.com/RobinMillford/GopherNotebook/tree/main/.claude/skills/frontend-developer
Command: npx skills add https://github.com/RobinMillford/GopherNotebook --skill frontend-developer-robinmillford

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve? Building modern web interfaces requires deep knowledge of React 19, Next.js 15, state management, accessibility, and performance optimization, which is difficult to apply consistently across a project. ## Core Features & Use Cases - Component Development: Build React 19 components using Server Components, Server Actions, Suspense, and concurrent rendering patterns. - State & Data Management: Implement client-side state with Zustand, TanStack Query, or Redux Toolkit, plus real-time updates via WebSockets. - Performance & Accessibility: Optimize Core Web Vitals, implement WCAG 2.1/2.2 AA compliance, and configure testing with Playwright and React Testing Library. - Use Case: Ask it to create an accessible data table with sorting and filtering in Next.js, and receive typed, production-oriented code with ARIA patterns and loading states. ## Quick Start Ask the assistant to build a responsive Next.js page component with TypeScript, Tailwind styling, and proper loading and error states.

Frequently Asked Questions about frontend-developer

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

FAQPage Schema
How do I build React Server Components in Next.js 15?

React Server Components in Next.js 15 render on the server by default in the App Router, streaming HTML to the client with Suspense boundaries. Use Client Components with the 'use client' directive only where interactivity is required.

What state management library should I use with React 19?

Zustand or Jotai work well for lightweight client state, while TanStack Query handles server state with caching and optimistic updates. Redux Toolkit suits complex state scenarios with many interacting slices.

Does Next.js 15 support Server Actions for form handling?

Yes, Next.js 15 supports Server Actions for client-server data mutations without separate API routes. Combined with useActionState and useOptimistic, they enable forms with optimistic updates and pending states.

How do I optimize Core Web Vitals in a React application?

Optimize Core Web Vitals by code splitting with dynamic imports, lazy loading images, prioritizing critical resources, and using Next.js Image optimization. Profile with React DevTools and Lighthouse to find rendering bottlenecks.

When should I not use this frontend development approach?

This skill does not apply to backend API architecture, native mobile apps outside the web stack, or pure visual design without implementation. Use backend or design-specific guidance for those tasks instead.