Athena — mahmoud-consultancy/archive/sessions/NEXT_SESSION_PROMPT_NOV1.md

Next Session - Frontend E2E Testing & Deployment Prep

Date: November 1, 2025 Branch: main Prerequisites: All 281 backend tests passing ✅


Quick Status Check

Verify Services

# Check backend
lsof -ti:8090 && echo "Backend: ✅" || echo "Backend: ❌"

# Check frontend
lsof -ti:4200 && echo "Frontend: ✅" || echo "Frontend: ❌"

Start Services (if needed)

# Backend (Terminal 1)
cd /Users/sarkout/projects/prive/mahmoud-consultancy/backend
./mvnw spring-boot:run

# Frontend (Terminal 2)
cd /Users/sarkout/projects/prive/mahmoud-consultancy/frontend/recruitment-portal
npm start

Session Objectives (90-120 min)

🔴 Priority 1: Frontend E2E Testing (45-60 min)

Goal: Verify complete user journey through browser

Test Flow:

  1. User Registration

    • Navigate to http://localhost:4200
    • Click "Register" / "Sign Up"
    • Fill registration form with valid data
    • Submit and verify success
  2. User Login

    • Login with registered credentials
    • Verify JWT token storage
    • Verify redirect to dashboard/home
  3. CV Builder - Complete Flow

    • Navigate to CV Builder
    • Step 1: Personal Information
      • Fill: firstName, lastName, email, phone
      • Fill: title, city, region, country
      • Fill: summary
    • Step 2: Work Experience
      • Add at least 1 experience entry
      • Fill: company, position, start date, end date, description
    • Step 3: Education
      • Add at least 1 education entry
      • Fill: institution, degree, field, start date, end date
    • Step 4: Skills
      • Add at least 3 skills
      • Set proficiency levels
    • Step 5: Review & Generate
      • Review all entered data
      • Click "Generate PDF"
      • Verify PDF downloads
      • Open PDF and verify content

Success Criteria:

  • ✅ Registration successful
  • ✅ Login successful with JWT
  • ✅ All CV sections save correctly
  • ✅ PDF generates without errors
  • ✅ PDF contains all entered data
  • ✅ PDF formatting is correct

Testing Tools:

  • Manual browser testing (primary)
  • Browser DevTools for network inspection
  • Check console for errors

🟡 Priority 2: TypeScript Model Generation (20-30 min)

Goal: Generate type-safe models from OpenAPI spec

Steps:

  1. Install OpenAPI Generator

    cd frontend/recruitment-portal
    npm install --save-dev @openapitools/openapi-generator-cli
    
  2. Generate TypeScript Models

    # Option 1: Generate Angular services (full)
    npx openapi-generator-cli generate \
      -i http://localhost:8090/v3/api-docs \
      -g typescript-angular \
      -o src/app/generated-api
    
    # Option 2: Generate types only (lighter)
    npx openapi-typescript http://localhost:8090/v3/api-docs \
      --output src/app/models/api-types.ts
    
  3. Update Services

    • Replace manual DTOs with generated types
    • Update imports in services
    • Test that everything compiles
  4. Add npm script

    // package.json
    "scripts": {
      "generate:api": "openapi-typescript http://localhost:8090/v3/api-docs -o src/app/models/api-types.ts"
    }
    

Success Criteria:

  • ✅ Types generated successfully
  • ✅ No TypeScript compilation errors
  • ✅ Frontend builds successfully
  • ✅ All API calls still work

🟢 Priority 3: Production Deployment Prep (30-45 min)

Goal: Prepare application for production deployment

3.1 Backend Configuration

Create Production Profile:

# backend/src/main/resources/application-prod.yml
spring:
  datasource:
    url: ${DATABASE_URL}
    username: ${DATABASE_USERNAME}
    password: ${DATABASE_PASSWORD}
    driver-class-name: org.postgresql.Driver

  jpa:
    hibernate:
      ddl-auto: validate
    properties:
      hibernate:
        dialect: org.hibernate.dialect.PostgreSQLDialect

  redis:
    host: ${REDIS_HOST:localhost}
    port: ${REDIS_PORT:6379}

  mail:
    host: ${SMTP_HOST}
    port: ${SMTP_PORT:587}
    username: ${SMTP_USERNAME}
    password: ${SMTP_PASSWORD}
    properties:
      mail:
        smtp:
          auth: true
          starttls:
            enable: true

server:
  port: 8090

security:
  jwt:
    secret: ${JWT_SECRET}
    expiration: 86400000  # 24 hours
  cors:
    allowed-origins: ${CORS_ALLOWED_ORIGINS}

Environment Variables Template:

# Create .env.example
DATABASE_URL=postgresql://localhost:5432/glorylabs
DATABASE_USERNAME=glorylabs
DATABASE_PASSWORD=change-me
JWT_SECRET=change-this-to-a-secure-random-string-at-least-256-bits
CORS_ALLOWED_ORIGINS=https://glorylabs.nl,https://www.glorylabs.nl
SMTP_HOST=smtp.gmail.com
SMTP_PORT=587
SMTP_USERNAME=noreply@glorylabs.nl
SMTP_PASSWORD=change-me
REDIS_HOST=localhost
REDIS_PORT=6379

3.2 Frontend Configuration

Create Production Environment:

// frontend/recruitment-portal/src/environments/environment.prod.ts
export const environment = {
  production: true,
  apiUrl: 'https://api.glorylabs.nl/api',
  tokenKey: 'glorylabs_access_token',
  refreshTokenKey: 'glorylabs_refresh_token',
  tokenExpiryBuffer: 60000
};

Build for Production:

cd frontend/recruitment-portal
ng build --configuration production

3.3 Database Migration

Create Liquibase Changelog (if not exists):

cd backend
./mvnw liquibase:generateChangeLog

Verify Migration:

# Test against PostgreSQL
./mvnw liquibase:update -Dspring.profiles.active=prod

3.4 Docker Configuration (Optional)

Create Dockerfile for Backend:

FROM eclipse-temurin:21-jre-alpine
WORKDIR /app
COPY target/*.jar app.jar
EXPOSE 8090
ENTRYPOINT ["java", "-jar", "app.jar"]

Create Dockerfile for Frontend:

FROM node:20-alpine AS build
WORKDIR /app
COPY package*.json ./
RUN npm ci
COPY . .
RUN npm run build --configuration production

FROM nginx:alpine
COPY --from=build /app/dist/recruitment-portal /usr/share/nginx/html
EXPOSE 80

Create docker-compose.yml:

version: '3.8'

services:
  postgres:
    image: postgres:15-alpine
    environment:
      POSTGRES_DB: glorylabs
      POSTGRES_USER: glorylabs
      POSTGRES_PASSWORD: ${DATABASE_PASSWORD}
    volumes:
      - postgres_data:/var/lib/postgresql/data
    ports:
      - "5432:5432"

  redis:
    image: redis:7-alpine
    ports:
      - "6379:6379"
    volumes:
      - redis_data:/data

  backend:
    build: ./backend
    environment:
      SPRING_PROFILES_ACTIVE: prod
      DATABASE_URL: jdbc:postgresql://postgres:5432/glorylabs
      DATABASE_USERNAME: glorylabs
      DATABASE_PASSWORD: ${DATABASE_PASSWORD}
      JWT_SECRET: ${JWT_SECRET}
      REDIS_HOST: redis
    ports:
      - "8090:8090"
    depends_on:
      - postgres
      - redis

  frontend:
    build: ./frontend/recruitment-portal
    ports:
      - "80:80"
    depends_on:
      - backend

volumes:
  postgres_data:
  redis_data:

🔵 Priority 4: Documentation Updates (15-20 min)

Update Files:

  1. README.md

    • Add production deployment instructions
    • Update environment setup
    • Add troubleshooting section
  2. API Documentation

    • Verify Swagger/OpenAPI spec is complete
    • Add authentication examples
    • Document error codes
  3. Deployment Guide

    • Create DEPLOYMENT.md
    • Document environment variables
    • Add database migration steps
    • Include Docker instructions

Success Criteria

Must Complete

  • [ ] E2E browser test completed successfully
  • [ ] PDF generation verified through UI
  • [ ] All form validations working
  • [ ] No console errors during E2E flow

Should Complete

  • [ ] TypeScript models generated
  • [ ] Production configuration files created
  • [ ] Environment variables documented
  • [ ] Build for production successful

Nice to Have

  • [ ] Docker configuration complete
  • [ ] Database migration tested
  • [ ] Load testing performed
  • [ ] Deployment documentation complete

Testing Checklist

Before Starting

  • [ ] Backend running on port 8090
  • [ ] Frontend running on port 4200
  • [ ] No console errors in either service
  • [ ] Database is accessible
  • [ ] Swagger UI accessible

During E2E Testing

  • [ ] Take screenshots of each step
  • [ ] Document any errors encountered
  • [ ] Test with valid and invalid data
  • [ ] Verify error messages are user-friendly
  • [ ] Check network tab for failed requests

After E2E Testing

  • [ ] Download and open generated PDF
  • [ ] Verify PDF content matches entered data
  • [ ] Test with multiple CV profiles
  • [ ] Test PDF generation with minimal data
  • [ ] Test PDF generation with complete data

Known Issues to Verify

Backend

  1. Email Service - SMTP not configured

    • Expected: Warning in logs
    • Impact: Email verification not working
    • TODO: Configure production SMTP
  2. Redis - May not be running

    • Expected: Health check shows DOWN
    • Impact: No caching (non-blocking)
    • TODO: Start Redis for production

Frontend

  1. Form Validation - Some fields may need refinement

    • Verify all required fields marked
    • Check validation error messages
    • Test edge cases (very long text, special characters)
  2. Error Handling - May need user-friendly messages

    • Check 401 redirects to login
    • Check 403 shows access denied
    • Check 500 shows generic error

Performance Benchmarks

Target Metrics

  • Page Load: < 2 seconds
  • API Response: < 500ms average
  • PDF Generation: < 3 seconds
  • Form Submission: < 1 second

Tools

# Backend load testing
ab -n 1000 -c 10 http://localhost:8090/api/jobs

# Frontend build size
ng build --configuration production --stats-json
npx webpack-bundle-analyzer dist/recruitment-portal/stats.json

Post-Session Checklist

  • [ ] All E2E tests documented
  • [ ] Screenshots saved (if issues found)
  • [ ] Production config files committed
  • [ ] Environment variables documented
  • [ ] DEPLOYMENT.md created
  • [ ] Session report written
  • [ ] Changes committed to git
  • [ ] Changes pushed to remote

Emergency Contacts / Resources

Documentation

  • Spring Boot: https://spring.io/projects/spring-boot
  • Angular: https://angular.io/docs
  • OpenAPI Generator: https://openapi-generator.tech/

Troubleshooting

# Clear browser cache and reload
# Hard refresh: Cmd+Shift+R (Mac) or Ctrl+Shift+R (Windows)

# Backend logs
./mvnw spring-boot:run | tee backend.log

# Frontend build issues
rm -rf node_modules package-lock.json
npm install
npm start

# Database reset (development only!)
# H2 database automatically resets on backend restart

Next Session After This

Focus: Production Deployment

Tasks:

  1. Deploy to staging environment
  2. Configure production database
  3. Set up CI/CD pipeline
  4. Configure monitoring and logging
  5. Performance testing
  6. Security audit
  7. Final user acceptance testing

Estimated Time: 90-120 minutes Difficulty: Medium Prerequisites: All backend tests passing, services running

Status: Ready to start ✅


Prepared: October 31, 2025 For: November 1, 2025 session Current Project Completion: ~90%

Reacties

Nog geen reacties