edufigueiredos/edufigueiredos icon
public
Published on 5/31/2025
Angular Developer

Rules

Build & Development Commands

  • Standardization with Angular CLI:
    Always use Angular CLI commands for creating and managing your projects. Commands like ng new, ng generate component|service|module, and ng build should be standard practice.

  • Environment-Specific Builds:
    Use configuration files to manage multiple environments. For development, run ng serve (with hot reload enabled) and for production use ng build --prod to generate optimized bundles.

  • Consistent Scripting:
    Define and document custom NPM scripts in the package.json for tasks such as linting, testing, building, and deployment. This ensures that all team members use the same commands and settings.

  • Dependency Management:
    Regularly update dependencies and verify compatibility with Angular’s version system. Include commands to check for outdated packages (e.g., npm outdated) and update them accordingly.

  • Error Reporting and Debugging:
    Incorporate source maps and verbose logging in development commands to facilitate easy debugging and quick resolution of runtime issues.


Testing Guidelines

  • Unit Testing:
    Write unit tests using Jasmine in conjunction with Karma, ensuring comprehensive coverage for components, services, directives, and pipes. Emphasize testing both logical and presentation layers using the Arrange-Act-Assert pattern.

  • Integration & Component Testing:
    Utilize Angular Testing Library or similar tools to simulate user interactions and validate component integration within the Angular ecosystem. Ensure that components encapsulate minimal logic and are easily testable.

  • End-to-End (E2E) Testing:
    Implement E2E tests using Cypress (or Protractor in legacy projects) to validate critical user workflows and integration with backend services. Keep test cases concise, focused, and maintainable.

  • Test Coverage and CI/CD:
    Aim for high code coverage (around 80% or above) and integrate testing into your continuous integration pipelines. Ensure that failing tests block code merges to maintain code quality.

  • Accessibility and Performance Testing:
    Regularly include tests for accessibility (a11y) and performance benchmarks to ensure that the application meets modern web standards and provides a smooth user experience.


Code Style & Guidelines

  • Adhere to the Angular Style Guide:
    Maintain uniformity by following Angular Style Guide recommendations for naming conventions, file and folder structure, and component patterns. This includes proper suffixes for components (e.g., .component.ts) and consistency in project structure.

  • TypeScript Best Practices:
    Utilize strict type checking to minimize runtime errors. Avoid using any unless absolutely necessary, and ensure every function, variable, and component has clear TypeScript types.

  • Separation of Concerns:
    Design components to be small, modular, and reusable. Keep business logic in services, use smart containers to manage state, and dumb components for presentation.

  • Proper Use of RxJS:
    Leverage RxJS observables effectively. Use operators like map, switchMap, and catchError to manage asynchronous data flows. Ensure subscriptions are properly managed to avoid memory leaks.

  • Code Linting and Formatting:
    Enforce code quality by using ESLint or similar linting tools alongside Prettier for consistent formatting. Integrate these tools into your development and pre-commit workflows for automatic code reviews.

  • Documentation within Code:
    Include descriptive comments for complex logic or non-obvious code segments. Use inline comments sparingly and favor clear, self-documenting code structures.


Documentation Guidelines

  • Comprehensive Project Documentation:
    Maintain an up-to-date README that covers project overview, setup instructions, build commands, testing procedures, deployment guidelines, and troubleshooting tips.

  • API and Component Documentation:
    Document public-facing APIs, components, services, directives, and pipes using TSDoc or JSDoc. Generate and host API documentation using tools like Compodoc to help onboard new contributors and assist in maintaining code quality.

  • Inline Code Comments:
    Write clear and concise inline comments for complex algorithms, design decisions, and unique implementations. Always ensure that comments add value and do not merely restate the code.

  • Change Logs and Versioning:
    Keep a changelog that records major and minor updates, architectural decisions, and notable feature additions. This serves as historical documentation for the project’s evolution.

  • Usage Examples and Best Practices:
    Include code examples demonstrating how to use custom directives, services, and components. Provide best practice guides that contextualize common Angular patterns and anti-patterns for current and future team members.