CLAUDE.md Template: Angular Material + Litestar Python API

Overview

CLAUDE.md template for the Angular Material + Litestar Python API stack explains how to structure a Claude Code guided project that combines a modern Angular Material frontend with a Litestar based backend API. It uses a copyable CLAUDE.md template to bootstrap your project and enforce architecture, testing, and security rules. Direct answer: this is a concrete CLAUDE.md template you can paste into your project to start coding with Claude Code for this stack.

When to Use This CLAUDE.md Template

- Kickstart a full-stack project with Angular Material UI and a Litestar API backend
- Provide Claude Code with exact project rules for architecture, tests, and security
- Share a repeatable blueprint for onboarding new team members
Copyable CLAUDE.md Template

Copy the block below into a CLAUDE.md file at the project root. It is tailored for Angular Material + Litestar Python API with Claude Code.

# CLAUDE.md
Project role: Full-stack engineer for Angular Material frontend and Litestar Python API backend
Architecture rules:
- Separate frontend and backend into a clean mono-repo layout
- Use Angular Material components for UI and a Litestar backend exposing OpenAPI docs
- Define clear interfaces between frontend and backend using strict typing
File structure rules:
- frontend/ contains the Angular app with Material components
- backend/ contains the Litestar app with routers and models
- common/ contains shared pydantic/schemas
Authentication rules:
- Implement JWT based authentication with access and refresh tokens
- Store tokens in httpOnly cookies where possible and refresh on the server
- Frontend must attach tokens to outgoing requests via an HTTP interceptor
Database rules:
- Use PostgreSQL with SQLAlchemy 2.0 or SQLModel for models
- Apply Alembic migrations for schema evolution
- Enforce least privilege for DB users and separate read/write roles
Validation rules:
- Validate all inputs using pydantic models
- Enforce strict type checking in TypeScript and Python
Security rules:
- Enforce HTTPS in production
- Enable CSRF protection for state-changing requests
- Do not expose raw database errors in API responses
Testing rules:
- Frontend unit tests with Jasmine/Karma
- Backend unit tests with pytest and httpx
- Integration tests cover key API paths and frontend-backend flows
Deployment rules:
- Dockerize frontend and backend separately
- Use docker-compose for local development
- Provide a minimal CI pipeline that runs tests
Things Claude must not do:
- Do not bypass server side validation
- Do not use unsafe eval or dynamic code loading
- Do not rely on client side only authentication
- Do not ignore API contract in OpenAPI specsRecommended Project Structure

project-root/
  frontend/
    angular-material/
      src/
        app/
          components/
          pages/
          app.module.ts
      angular.json
      package.json
      tsconfig.json
  backend/
    litestar/
      app/
        routers/
        models/
        schemas/
        main.py
      requirements.txt
  tests/Core Engineering Principles

- Clear separation of concerns between frontend and backend
- Strict typing and API contracts via OpenAPI
- Test driven development and robust CI
- Security by default and least privilege
- Observability and simple debugging
Code Construction Rules

- Frontend must use Angular Material components with responsive layouts
- Backend must expose a Litestar API with typed handlers and Pydantic models
- Shared models between frontend and backend via a common schema
- Environment variables must be used for secrets
- Use OpenAPI for API contracts and client generation where possible
Security and Production Rules

- Use HTTPS in production and secure cookies for auth
- Store DB credentials in environment variables and use least privilege users
- Enable rate limiting and proper logging
Testing Checklist

- Frontend unit tests with Jasmine/Karma; End-to-end tests with Cypress
- Backend unit tests with pytest; Integration tests for API endpoints
- CI pipeline that runs tests on push
Common Mistakes to Avoid

- Not validating inputs at the API boundary
- Relying on client side validation only
- Omitting test coverage for critical paths
- Ignoring OpenAPI contracts
FAQ


  
    Q: What is the purpose of this template?


    A: It provides a copyable CLAUDE.md template for Angular Material + Litestar Python API with Claude Code guidance.


  
  
    Q: How do I start using Claude Code with this template?


    A: Copy the CLAUDE.md block into your project root CLAUDE.md and follow the rules above.


  
  
    Q: Can I adapt this for other backends?


    A: Yes, but ensure you update the architecture and security rules accordingly.


  
  
    Q: What should I test?


    A: Unit tests for frontend and backend, and integration tests for API paths.


  
  
    Q: How do I handle secrets?


    A: Use environment variables and secret management in your deployment.