Frontend Components

Reusable React components follow single responsibility and clear prop interfaces to minimize duplication. Break complex UI into smaller, focused units with defined state management and composable structures, enabling faster development and easier maintenance across projects.

Proper state management within components ensures data flows predictably across your UI. Isolate state to the component level that needs it, pass data through props, and use lifting when multiple components share state, maintaining clear interfaces and reducing side effects.

Frontend components must comply with documented standards covering accessibility, modularization, styling, and documentation. Review components against frontend/components.md standards during creation and code review to enforce compliance, automated checking, and consistent quality across frameworks like React and Vue.

Yes, component standards for reusability, state management, and composition apply across React and Vue frameworks. The guidance ensures coding-standard compliance regardless of framework choice, enabling consistent component design and maintenance practices across your tech stack.

Break down components when they handle multiple responsibilities, manage complex state, or become difficult to test and maintain. Decomposing into smaller, focused units with single responsibilities improves reusability, testability, and enables clearer component composition patterns.