Designs and reviews React components for modern TypeScript projects using React, Next.js, and TailwindCSS. Use when the user asks to build React components, refactor UI components, debug React code, improve component structure, or optimize frontend performance.
This skill helps design, refactor, and review React components to ensure production-grade architecture, readability, and performance.
It assumes the project uses:
Focus on clean, scalable frontend engineering practices.
Use this skill when the user asks to:
When generating or modifying React code:
All components should follow this structure:
Example structure:
import React from "react";
interface Props {
title: string;
}
export default function Example({ title }: Props) {
return <div className="p-4">{title}</div>;
}