Development skills

Optimize React rendering, bundle size, and data flow with profiler-led decisions. Use when reducing re-renders, fixing waterfalls, or deciding whether memoization is warranted in React.

The English summary is being prepared. Showing the original description.

Build modern React component architecture with composition patterns. Use when designing reusable React components, applying composition patterns, or structuring component hierarchies.

The English summary is being prepared. Showing the original description.

Style React Native apps with StyleSheet API, Flexbox, theming, and responsive design. Use when implementing React Native styles, theming, Flexbox layouts, or responsive design.

The English summary is being prepared. Showing the original description.

Implement local and global state with Context, Zustand, and Redux Toolkit in React Native. Use when choosing or implementing state management in React Native with Context, Zustand, or Redux.

The English summary is being prepared. Showing the original description.

Resolve iOS and Android differences using Platform API and native modules in React Native. Use when platform branching or native-module integration is the primary task; defer cross-platform feature implementation such as push notifications.

The English summary is being prepared. Showing the original description.

Push notifications for React Native using Firebase or Expo Notifications. Use when integrating push notifications with Firebase or Expo in React Native.

The English summary is being prepared. Showing the original description.

Configure stack navigation, type-safe routes, deep linking, and URL-based routing with React Navigation in React Native. Use for React Navigation route configuration; defer unrelated performance, notification, build, and styling work.

The English summary is being prepared. Showing the original description.

Configure React Navigation 6+ stacks, tabs, and deep linking for React Native. Use when implementing React Navigation stacks, tabs, or deep linking in React Native.

The English summary is being prepared. Showing the original description.

Enforce design token usage in React Native. Use when enforcing a design system, preventing hardcoded styles, or implementing theme tokens in React Native.

The English summary is being prepared. Showing the original description.

Implement zero-runtime CSS with Tailwind, CSS Modules, and the cn() utility for RSC-compatible styling in Next.js. Use when choosing a styling library, creating dynamic class utilities, or optimizing fonts with next/font.

The English summary is being prepared. Showing the original description.

Apply best practices for managing URL, server, and client state in Next.js applications. Use when choosing between URL params, SWR/TanStack Query, Zustand, or Context for state, or when fixing hydration mismatches from localStorage.

The English summary is being prepared. Showing the original description.

Select and implement SSG, SSR, ISR, Streaming, or Partial Prerendering strategies in Next.js App Router. Use when choosing a rendering mode for a page, configuring generateStaticParams, or enabling PPR.

The English summary is being prepared. Showing the original description.

Implement Pages Router data fetching with getServerSideProps, getStaticProps, and API routes in Next.js legacy projects. Use when working in a pages/ directory project, adding SSR/SSG data fetching, or creating API routes.

The English summary is being prepared. Showing the original description.

Best practices for multi-language handling, locale routing, and detection strategies across App and Pages Router. Use when adding i18n, locale routing, or language detection in Next.js.

The English summary is being prepared. Showing the original description.

Configure Next.js cache layers, invalidation, and cache-component APIs. Use when choosing `fetch` caching, `use cache`, tags, or stale-data debugging in Next.js.

The English summary is being prepared. Showing the original description.

Secure token storage (HttpOnly Cookies) and Middleware patterns. Use when implementing authentication, secure session storage, or auth middleware in Next.js.

The English summary is being prepared. Showing the original description.

Structure Next.js projects with Feature-Sliced Design layers, domain-grouped slices, and strict import hierarchy. Use when organizing features into FSD layers, enforcing slice boundaries, or keeping page.tsx thin.

The English summary is being prepared. Showing the original description.

Configure file-system routing with nested layouts, route groups, parallel routes, and error boundaries in Next.js App Router. Use when creating page routes, adding loading/error states, or organizing routes with groups and dynamic segments.

The English summary is being prepared. Showing the original description.

Configure Next.js build tooling, deployment, and developer workflow. Use when setting up Turbopack, standalone Docker output, bundle analysis, CI caching, environment variable validation, or ESLint integration for Next.js projects.

The English summary is being prepared. Showing the original description.

Build async React Server Components and place 'use client' boundaries at leaf nodes for interactivity in Next.js App Router. Use when deciding RSC vs Client Component, composing server data into client wrappers, or fixing hydration errors.

The English summary is being prepared. Showing the original description.

Implement secure Next.js Server Actions for mutations, forms, and optimistic UI. Use when building actions, form flows, auth checks, or revalidation after writes.

The English summary is being prepared. Showing the original description.

Optimize images, fonts, scripts, and metadata for Next.js performance and Core Web Vitals. Use when configuring next/image for LCP, next/font for zero layout shift, next/script loading strategies, or generateMetadata for SEO.

The English summary is being prepared. Showing the original description.

Build modern React Native components using function components and composition. Use when building or refactoring React Native function components and composable UI.

The English summary is being prepared. Showing the original description.

Next.js version migrations using official guides and codemods. Use when migrating a Next.js project to a new major version using codemods.

The English summary is being prepared. Showing the original description.