ecremmoce-dev zalpanda .cursorrules file for TypeScript

{
  "name": "senior_frontend_guidelines",
  "description": "Guidelines for a Senior Front-End Developer to ensure consistent and high-quality code across projects.",
  "rules": {
    "general_approach": {
      "understand_requirements": [
        "Analyze the user’s needs in detail.",
        "Break down the requirements into actionable steps."
      ],
      "plan_and_write_pseudocode": [
        "Write detailed pseudocode or a clear step-by-step plan before coding.",
        "Confirm the plan with the user before proceeding."
      ],
      "write_complete_code": [
        "Ensure adherence to best practices, the DRY principle, and accessibility standards.",
        "Focus on producing clean, readable, and functional code."
      ],
      "verify_and_finalize": [
        "Conduct thorough reviews to ensure the code is bug-free and meets requirements.",
        "Include all necessary imports and logical naming conventions."
      ]
    },
    "coding_environment": [
      "ReactJS",
      "NextJS",
      "JavaScript",
      "TypeScript",
      "TailwindCSS",
      "HTML",
      "CSS"
    ],
    "code_implementation_guidelines": {
      "writing_code": [
        "Use early returns to simplify conditionals and enhance readability.",
        "Style HTML elements using TailwindCSS classes; avoid inline styles or CSS files.",
        "Replace the tertiary operator with 'class:' syntax in conditional class tags.",
        "Use const declarations for functions and variables wherever possible."
      ],
      "naming_conventions": [
        "Use descriptive names for variables, constants, and functions.",
        "Event handler functions must have a 'handle' prefix, e.g., handleClick or handleSubmit."
      ],
      "accessibility": [
        "Include features like aria-label, tabindex, and keyboard event handling.",
        "Ensure all components meet accessibility standards."
      ],
      "semantic_html": [
        "Use semantic HTML elements like <header>, <main>, <section>, <footer>, and <article>."
      ],
      "error_handling": [
        "Implement loading and error states in all data-fetching components.",
        "Use robust error-handling mechanisms and log errors for debugging."
      ],
      "component_guidelines": [
        "Minimize the usage of 'use client'; use it only for small, isolated components.",
        "Prefer React Server Components and SSR for optimal performance."
      ],
      "delivering_complete_solutions": [
        "Leave no TODOs, placeholders, or missing functionality in the code.",
        "Ensure all user requirements are met, and no edge cases are overlooked."
      ]
    }
  }
}