Lesson 4 of 5·10 min read

Project Workflows

Editing individual files with AI is the entry point. True productivity emerges when AI takes over entire workflows — multi-file edits, codebase-wide refactoring, and AI-assisted code review.

Multi-File Edits

The Composer Workflow

Cursor's Composer (Cmd/Ctrl + I) is the tool for changes across multiple files:

Scenario: New "User Notifications" Feature

Prompt to Composer:

"Implement a notification system: 1) Supabase table 'notifications' with id, user_id, title, message, read, created_at. 2) Server action for creating and marking as read. 3) React component NotificationBell with badge count. 4) API route for real-time updates with SSE. Use existing patterns from @folder:src/app/actions and @folder:src/components/ui."

What Composer does:

  1. Creates the migration SQL file
  2. Creates types in src/types/notifications.ts
  3. Creates server actions in src/app/actions/notifications.ts
  4. Creates the UI component in src/components/notifications/NotificationBell.tsx
  5. Creates the API route in src/app/api/notifications/route.ts
  6. Updates the layout to include NotificationBell

Best Practices for Multi-File Edits

  • Limit scope: Maximum 5–8 files per Composer session
  • Review every file: Don't accept blindly — check every generated file
  • Incremental: Three small Composer sessions rather than one huge one
  • Git commits: Commit after every successful Composer session

Codebase-Wide Refactoring

Migration: JavaScript → TypeScript

"Migrate @file:src/lib/legacy/helpers.js to TypeScript. Infer types from usage (look in @folder:src/components how the functions are called). Create @file:src/types/helpers.ts for the types. Update all imports."

API Version Migration

"Migrate all calls from /api/v1/ to /api/v2/ across the entire project. The v2 API uses camelCase instead of snake_case for response fields. Update all types and access patterns. Show me which files are affected first."

Dependency Update

"Update all imports from 'date-fns' v2 to v3. Key breaking changes: format() now uses a different token system, parseISO is now parse. Show me the changes before applying them."

Code Review with AI

AI as First Reviewer

Before creating a pull request — have AI review your code:

"Review the changes in @git:staged. Check for: 1) TypeScript errors and type safety 2) Potential security issues 3) Performance problems 4) Missing error handling 5) Inconsistencies with existing code style. Format as a Markdown checklist."

Review Checklist from AI

AI identifies typical problems:

  • Type safety: any types, missing null checks, unsafe type assertions
  • Error handling: Try/catch without specific error handling, unhandled promise rejections
  • Security: SQL injection possibilities, XSS in dangerouslySetInnerHTML, missing input validation
  • Performance: N+1 queries, missing useMemo/useCallback, unnecessary re-renders
  • Conventions: Inconsistent naming, missing comments, deviating patterns

Pair Programming Patterns

AI as Pair Partner

Navigator pattern: You write the code, AI observes and comments:

"I'm now implementing the payment logic. Watch my code in @file:src/lib/billing/checkout.ts and point out problems as soon as you see them."

Driver pattern: AI writes the code, you steer the direction:

"Implement the next function processRefund. Stop after each function and wait for my feedback before continuing."

Ping-pong pattern: Alternating code and tests:

  1. You: "Write the function calculateDiscount"
  2. AI writes the function
  3. You: "Write tests for edge cases"
  4. AI writes tests — some fail
  5. You: "Fix the function based on the failed tests"
  6. AI corrects — all tests green

Insight: AI pair programming works best when you dictate the architecture and AI handles the implementation. The reverse (AI decides architecture) often leads to generic solutions.