القائمة
Component organization and modern React principles for the FrontEnd.
التثبيت باستخدام Codex أو Claude انسخ هذا Prompt والصقه في Codex أو Claude أو مساعد آخر ليراجع صفحة Skill ويثبّتها لك.
استنادا إلى تصنيف SOC المهني
Mandatory rule requiring a corresponding test file for every business logic file and UI component.
Guidelines for frontend component and E2E testing in FinanzApp.
Catalog of all specialized skills used across the FinanzApp project (Frontend & Backend).
Reglas obligatorias para garantizar la accesibilidad web (A11y) en FinanzApp. Sigue estándares WCAG 2.1 para usuarios con discapacidad visual y navegación por teclado.
Guidelines for cross-layer testing (Hooks + UI + Services) using real logic and MSW for network interception.
Guidelines for end-to-end testing in FinanzApp using Playwright.
| name | clean-structure |
| description | Component organization and modern React principles for the FrontEnd. |
A well-organized frontend is easier to maintain and scale. This project uses Next.js with the App Router.
src/app: Page components and routing (App Router).src/components: UI components.src/hooks: Custom React hooks (logic, state, side effects).src/services: API communication layer.src/types: TypeScript definitions.src/utils: Pure helper functions and shared logic.src/theme: Global styles, themes, and design tokens..test.ts file in a nested tests/ directory (except in src/app/).