CLAUDE.md Template — Angular Material + Django MongoDB Starter

Overview

This CLAUDE.md Template is designed for a stack consisting of Angular Material on the frontend, Django REST Framework on the backend, and MongoDB as the data store. It provides a complete, copyable CLAUDE.md block that guides Claude Code through generating end-to-end scaffolding, including architecture, authentication, data validation, and deployment considerations. The template is written to support rapid iteration while enforcing stack-specific constraints for Angular Material + Django MongoDB projects. It also includes a direct answer style summary for quick reference.

When to Use This CLAUDE.md Template

• You are starting a new admin or dashboard UI using Angular Material with a Django REST API.
• You want a single CLAUDE.md starter that enforces MongoDB usage via Djongo and JWT-based auth for API calls.
• You need a consistent, copyable CLAUDE.md block that you can paste into Claude Code to scaffold code and configurations for this stack.
• You require stack-specific guidance on file structure, validation, and deployment for a Django + Angular + MongoDB project.

Copyable CLAUDE.md Template

# CLAUDE.md
Project role: Frontend Engineer + Backend API Integrator for an Angular Material + Django + MongoDB stack
Architecture rules:
- Expose REST API endpoints with Django REST Framework; frontend consumes via HttpClient.
- Use MongoDB as the primary datastore via Djongo; avoid direct raw Mongo calls from the frontend.
- Maintain a clear API contract; version endpoints and document request/response shapes.
- Use environment-based configs; keep secrets out of source control.
File structure rules:
- frontend/ (Angular Material app)
- backend/ (Django project)
- config/ (envs, docker-compose, k8s manifests)
- scripts/ (build, deploy, migrate helpers)
Authentication rules:
- Use JWT-based authentication for API access; Django REST Framework simplejwt or equivalent.
- Store tokens securely; refresh tokens with rotation; protect endpoints with proper permissions.
Database rules:
- MongoDB via Djongo; define serializers and models in Django, not in the frontend.
- Enable basic field validation on the backend; enforce data shapes in serializers.
Validation rules:
- Use DRF serializers with required fields and validators; Angular forms should mirror backend rules with client-side validation.
Security rules:
- Enforce HTTPS in all environments; configure CORS to only allow known origins.
- Use secret management for keys; disable debug in production; set ALLOWED_HOSTS properly.
Testing rules:
- Backend: unit tests for serializers, views, and authentication; integration tests for API endpoints.
- Frontend: unit tests for components/services; e2e tests for critical flows (login, data listing).
Deployment rules:
- Use Docker Compose for local development; deploy with containerized Django and Angular apps; ensure MongoDB service is secured.
Things Claude must not do:
- Do not generate direct SQL migrations or relational schemas for MongoDB.
- Do not introduce Mongoose, Prisma, or Express-based code in backend.
- Do not implement frontend state management with non-Angular Material patterns unless explicitly requested.

Recommended Project Structure

angular-material-django-mongo/
  frontend/
    angular.json
    package.json
    src/
      app/
        components/
        services/
        app.module.ts
        main.ts
  backend/
    manage.py
    requirements.txt
    django_project/
      settings.py
      urls.py
    apps/
      core/
        models.py
        serializers.py
        views.py
  config/
    docker-compose.yml
  scripts/
    docker_build.sh

Core Engineering Principles

• Separation of concerns between frontend and backend with a stable API contract.
• Explicit, stack-aware data flow: Angular Material UI, Django REST API, MongoDB storage.
• Idempotent API operations and stateless frontend rendering where possible.
• Environment promotion: dev → staging → production with same CLAUDE.md template constraints.
• Defensive validation and strict type contracts across frontend and backend.

Code Construction Rules

• Frontend must be Angular Material components with Angular services consuming a Django REST API.
• Backend must use Django REST Framework with serializers for all data inputs.
• Mongodb store accessed via Djongo in Django models; avoid raw Mongo queries in views.
• All API endpoints should return consistent JSON envelopes; include error shapes with status codes.
• Validation performed on backend; reflect errors in API responses and form validations on frontend.
• Authentication is JWT-based; protect endpoints with appropriate permissions.
• Do not rely on deprecated Django or Angular APIs; upgrade paths must be documented in the CLAUDE.md template.
• Do not include hard-coded secrets; use environment variables and secret managers.

Security and Production Rules

• Enable HTTPS; configure SSL in deployment and reverse proxy layers.
• Set CORS to trusted origins only; CSRF protection for state-changing requests where appropriate.
• Store secrets in environment variables or secret stores; never commit to repo.
• Rotate JWT signing keys and implement token refresh with rotation.
• Limit MongoDB user privileges; use separate read/write users with least privileges.
• Log sensitive events; monitor for injection attempts and enforce input sanitization.

Testing Checklist

• Backend: unit tests for serializers, validators, and API endpoints; test auth flows.
• Frontend: unit tests for components/services; validation checks for forms.
• Integration: end-to-end tests for login, data fetch, and create/update flows.
• Deployment: smoke tests in staging; verify environment parity and secrets loading.

Common Mistakes to Avoid

• Using non-Angular Material components that introduce inconsistent styling.
• Exposing raw database endpoints or bypassing API contracts.
• Ignoring MongoDB indexing needs or failing to model data with serializers.
• Storing secrets in code or committing environment files.
• Assuming relational migrations apply to MongoDB or Djongo without adaptation.

FAQ

• What is this CLAUDE.md Template for? It provides a ready-to-copy CLAUDE.md template for an Angular Material + Django + MongoDB stack to guide Claude Code in generation tasks.
• Which stack does this template cover? Angular Material as the frontend, Django REST Framework as the API layer, and MongoDB as the datastore (via Djongo).
• How do I customize for production? Replace env-based configs, secure JWT secrets, set proper ALLOWED_HOSTS, enable HTTPS, and adjust MongoDB user privileges for production.
• How do I test the stack? Run Django tests for serializers/views, Angular unit tests, and end-to-end tests with Cypress or similar tools.
• What should I avoid when using Claude Code here? Do not generate Mongoose/Prisma code for the Django backend, avoid SQL migrations for MongoDB, and do not generate insecure defaults or hard-coded secrets.