AI-First Engineering 과정으로 돌아가기
3주차

AI 중심 워크플로우 & Production 배포

AI가 일하고, 우리는 관리한다 - 실전 워크플로우부터 프로덕션 배포까지

"AI가 일하고, 우리는 관리한다"

학습 목표

  • Mission-Context-Work 프레임워크 실전 적용
    슈퍼워크의 3요소를 실제 프로젝트에 적용하여 AI에게 효과적으로 작업을 배정하고 관리하는 방법을 습득합니다.
  • 2시간 스프린트와 10시-2시 싱크업
    AI 시대의 새로운 개발 주기: 2주 스프린트가 아닌 2시간 스프린트. 모든 매니저가 미션에 alignment를 맞추기 위한 정기 싱크업 프로세스를 완성합니다.
  • 15분 만에 완성하는 Production CI/CD
    GitHub Actions를 활용하여 자동 테스트, 자동 배포 파이프라인을 구축하고 프로덕션 레벨의 개발 환경을 완성합니다.
  • 실시간 모니터링 & 에러 추적 시스템
    Sentry와 Firebase Performance Monitoring을 통합하여 서비스 상태를 실시간으로 파악하고 문제를 즉시 해결합니다.

개발 워크플로우 비교: 기존 vs AI-First

🔧 기존 개발 워크플로우

개발자가 모든 것을 직접 작성

1
요구사항 분석
문서 읽고 이해하는데 30분
2
기술 스택 조사
Stack Overflow, 블로그 검색 1시간
3
보일러플레이트 작성
프로젝트 구조, 설정 파일 1시간
4
기능 구현
코드 작성, 디버깅 반복 4시간
5
테스트 & 문서화
테스트 코드, README 작성 2시간
6
배포 설정
CI/CD 파이프라인 구축 2시간
총 소요시간: 10-12시간
개발자 직접 작업 비율: 100%

🤖 AI-First 워크플로우

AI가 일하고, 매니저들은 alignment를 맞춘다

1
Mission 정의 (오전 10시)
팀 전체가 목표에 alignment 맞추기 10분
2
Context 제공
CLAUDE.md로 프로젝트 컨텍스트 전달 5분
3
AI가 Work 실행 + 자동 커밋
AI가 구현 및 구현마다 커밋 메시지 자동 작성 (2시간)
4
오후 2시 싱크업
커밋 히스토리로 progress 자동 확인 & alignment 재조정 15분
5
다음 2시간 스프린트
조정된 방향으로 다음 사이클 진행
2시간 스프린트 사이클
매니저 싱크업 시간: 25분
AI 자동화 작업: 2시간
하루 3-4개 스프린트 가능

💡 핵심 차이점

⚡
스프린트 혁명
2주 스프린트 → 2시간 스프린트, 하루 3-4회 사이클
🎯
모두가 매니저
코딩이 아닌 AI 매니징, 전략과 alignment에 집중
📝
자동 Progress Tracking
AI가 작업마다 커밋 메시지 자동 작성. 미팅 전 커밋 히스토리로 진행상황 한눈에 파악
🔄
싱크업의 중요성
속도가 빠를수록 alignment가 중요. 배가 산으로 가지 않도록 10시-2시 정기 싱크업
📈
생산성 극대화
AI가 2시간 일하는 동안 매니저는 전략 수립, 다음 스프린트 준비

Part 1: Mission-Context-Work 프레임워크 (60분)

슈퍼워크의 3요소 실전 적용
🎯
Mission (목표)
명확한 목표 설정으로 AI가 달성해야 할 결과를 정의합니다.
예시:
"크리에이터 수익 분배 시스템을 구축하여 유튜브 API로 조회수를 가져오고, Firestore에 저장한 뒤 분배 비율에 따라 자동 계산하는 기능을 완성하라"
📚
Context (맥락)
충분한 맥락을 제공하여 AI가 올바른 방향으로 작업할 수 있게 합니다.
예시:
"현재 프로젝트는 Next.js 15 기반이며, Firebase Functions v2를 사용합니다. 유저 인증은 Firebase Auth로 구현되어 있고, 데이터베이스 스키마는 /docs/schema.md를 참고하세요"
⚙️
Work (작업)
구체적인 작업을 단계별로 정의하여 실행 가능한 계획을 제시합니다.
예시:
"1. YouTube Data API 연동 함수 작성
2. Firestore 데이터 모델 설계
3. 분배 로직 구현
4. 단위 테스트 작성
5. API 엔드포인트 완성"
💼 실제 케이스: 크리에이터 수익 분배 자동화 시스템
배경: 여러 크리에이터가 협업하는 유튜브 채널에서 조회수에 따른 수익을 자동으로 분배해야 합니다.
Mission: 유튜브 조회수 데이터를 자동으로 가져와서 미리 정의된 분배 비율에 따라 각 크리에이터의 수익을 계산하고 기록하는 시스템 구축
Context:
  • YouTube Data API v3 사용
  • Firebase Functions로 스케줄링 (매일 자정 실행)
  • Firestore에 creators, videos, revenues 컬렉션 구조
  • React 대시보드로 결과 시각화
Work:
  1. YouTube API 연동 및 조회수 수집 함수 작성
  2. Firestore 데이터 구조 설계 및 보안 규칙 업데이트
  3. 수익 분배 알고리즘 구현 (비율 계산 로직)
  4. Firebase Functions 스케줄러 설정
  5. 대시보드 UI 컴포넌트 개발
  6. 통합 테스트 및 에러 핸들링

10시-2시-5시 미팅 시스템

AI와의 효과적인 협업을 위한 체계적인 체크포인트 시스템입니다. 하루를 3번의 주요 미팅으로 나누어 AI의 작업을 관리합니다.

10:00
🌅 오전 미팅 - 작업 배정 & 킥오프
목표: 오늘 할 작업을 AI에게 명확히 전달
활동:
  • Mission-Context-Work 프롬프트 작성
  • 우선순위와 예상 소요시간 설정
  • 필요한 리소스 및 문서 링크 제공
  • AI 작업 시작 확인
예상 시간: 15-20분
14:00
☀️ 오후 미팅 - 진행상황 체크 & 조정
목표: 작업 진행상황 파악 및 필요시 방향 조정
활동:
  • 완료된 작업 코드 리뷰
  • 진행 중인 작업의 중간 결과 확인
  • 막힌 부분이나 추가 맥락 제공
  • 필요시 작업 우선순위 재조정
예상 시간: 20-30분
17:00
🌆 저녁 미팅 - 마무리 & 다음 계획
목표: 오늘 완료된 작업 검토 및 내일 준비
활동:
  • 완성된 기능 테스트 및 최종 검증
  • PR 생성 및 코드 리뷰 요청
  • 문서화 및 주석 업데이트 확인
  • 내일 작업을 위한 준비사항 정리
  • 오늘의 학습 내용 기록
예상 시간: 20-25분
💡 워크플로우 핵심 팁
  • 각 미팅은 정해진 시간에 규칙적으로 진행하세요
  • 미팅 전에 AI의 작업 로그를 먼저 읽어보세요
  • 진행상황을 문서로 기록하여 패턴을 파악하세요
  • AI가 자주 막히는 부분은 Context를 보강하세요
  • 성공적인 프롬프트는 템플릿으로 저장하세요

Part 2: Production 배포의 모든 것 (60분)

15분 만에 완성하는 프로덕션 레벨 CI/CD 파이프라인. 자동 테스트부터 배포, 모니터링까지 한 번에 설정합니다.

GitHub Actions로 CI/CD 구축

1단계: 자동 테스트 파이프라인 (5분)

# .github/workflows/test.yml name: Run Tests on: pull_request: branches: [ main, develop ] push: branches: [ main, develop ] jobs: test: runs-on: ubuntu-latest steps: - uses: actions/checkout@v4 - name: Setup Node.js uses: actions/setup-node@v4 with: node-version: '20' cache: 'yarn' - name: Install dependencies run: yarn install --frozen-lockfile - name: Run linting run: yarn lint - name: Run tests run: yarn test --coverage - name: Build project run: yarn build

2단계: 자동 배포 파이프라인 (5분)

# .github/workflows/deploy.yml name: Deploy to Production on: push: branches: [ main ] jobs: deploy: runs-on: ubuntu-latest steps: - uses: actions/checkout@v4 - name: Setup Node.js uses: actions/setup-node@v4 with: node-version: '20' cache: 'yarn' - name: Install dependencies run: yarn install --frozen-lockfile - name: Build run: yarn build env: NEXT_PUBLIC_API_URL: ${{ secrets.PRODUCTION_API_URL }} - name: Deploy to Firebase uses: FirebaseExtended/action-hosting-deploy@v0 with: repoToken: ${{ secrets.GITHUB_TOKEN }} firebaseServiceAccount: ${{ secrets.FIREBASE_SERVICE_ACCOUNT }} channelId: live projectId: your-project-id

3단계: PR 자동 리뷰 & 미리보기 (5분)

# .github/workflows/pr-preview.yml name: PR Preview Deploy on: pull_request: branches: [ main ] jobs: preview: runs-on: ubuntu-latest steps: - uses: actions/checkout@v4 - name: Setup Node.js uses: actions/setup-node@v4 with: node-version: '20' cache: 'yarn' - name: Install and Build run: | yarn install --frozen-lockfile yarn build - name: Deploy Preview uses: FirebaseExtended/action-hosting-deploy@v0 with: repoToken: ${{ secrets.GITHUB_TOKEN }} firebaseServiceAccount: ${{ secrets.FIREBASE_SERVICE_ACCOUNT }} projectId: your-project-id # 자동으로 PR에 미리보기 URL 코멘트 expires: 7d
⚡ 15분 완성 체크리스트
  1. 3개의 workflow 파일을 .github/workflows/ 디렉토리에 생성 (5분)
  2. GitHub Repository Secrets에 환경변수 설정 (3분)
  3. Firebase 프로젝트 설정 및 서비스 계정 키 발급 (5분)
  4. 테스트 PR 생성하여 자동화 검증 (2분)

모니터링 & 에러 추적 시스템

복잡한 모니터링 도구 대신, 실용적이고 간단한 방법으로 시작하세요. Firebase Extension 하나면 충분합니다.

💡 AI에게 이렇게 말하면 끝
"에러나면 이메일로 보내줘"
Firebase Extension으로 이메일 알림 설정 완료. 복잡한 Sentry, Slack 연동 필요없이 바로 프로덕션 준비 완료.

Firebase Extension으로 1분 설정

Firebase Console → Extensions → "Trigger Email" 설치 → 환경변수 설정 → 끝!

// Firebase Functions에서 자동으로 에러 감지 시 이메일 발송 import { onRequest } from 'firebase-functions/v2/https'; export const myFunction = onRequest(async (req, res) => { try { // Your code here } catch (error) { // Firebase Extension이 자동으로 에러 이메일 전송 console.error('Error:', error); throw error; } });

테스트 & Production Ready Checklist

AI에게 "Production Ready Checklist 만들어줘"라고 하면 프로젝트에 맞는 완벽한 체크리스트를 생성합니다. 유닛 테스트, E2E 테스트까지 자동화.

유닛 테스트 (Jest + React Testing Library)

// AI에게: "이 컴포넌트 유닛 테스트 작성해줘" import { render, screen, fireEvent } from '@testing-library/react'; import { LoginForm } from './LoginForm'; describe('LoginForm', () => { it('이메일과 비밀번호 입력 후 로그인 버튼 클릭 시 제출', async () => { const handleSubmit = jest.fn(); render(); fireEvent.change(screen.getByLabelText('이메일'), { target: { value: 'test@example.com' } }); fireEvent.change(screen.getByLabelText('비밀번호'), { target: { value: 'password123' } }); fireEvent.click(screen.getByRole('button', { name: '로그인' })); expect(handleSubmit).toHaveBeenCalledWith({ email: 'test@example.com', password: 'password123' }); }); });

E2E 테스트 (Playwright)

// AI에게: "로그인부터 대시보드까지 E2E 테스트 작성해줘" import { test, expect } from '@playwright/test'; test('사용자 로그인 플로우', async ({ page }) => { // 로그인 페이지 접속 await page.goto('https://example.com/login'); // 이메일 입력 await page.fill('input[name="email"]', 'test@example.com'); // 비밀번호 입력 await page.fill('input[name="password"]', 'password123'); // 로그인 버튼 클릭 await page.click('button[type="submit"]'); // 대시보드로 리다이렉트 확인 await expect(page).toHaveURL('https://example.com/dashboard'); // 환영 메시지 확인 await expect(page.locator('h1')).toContainText('환영합니다'); });
🤖 AI에게 Production Ready Checklist 만들라고 시키기
프롬프트 예시:
"이 프로젝트를 프로덕션에 배포하기 전에 확인해야 할 체크리스트를 만들어줘. 보안, 성능, 테스트, 모니터링, SEO 등 모든 측면을 포함해서."

AI가 프로젝트 구조를 분석하여 맞춤형 체크리스트를 생성합니다.

AI가 생성한 Production Ready Checklist 예시

✅ 보안

  • 환경변수 모두 .env.local에서 관리 (절대 커밋하지 않기)
  • Firebase Security Rules 업데이트 및 테스트
  • CORS 설정 확인
  • API 키 Rate Limiting 설정

⚡ 성능

  • 이미지 최적화 (next/image 사용)
  • 번들 크기 확인 (yarn build 후 분석)
  • Lighthouse 점수 90점 이상
  • Core Web Vitals 기준 충족

🧪 테스트

  • 유닛 테스트 커버리지 80% 이상
  • 주요 사용자 플로우 E2E 테스트
  • CI/CD 파이프라인에서 자동 테스트
  • 모바일 반응형 테스트

📊 모니터링

  • 에러 알림 설정 (Firebase Extension)
  • Analytics 통합 (Google Analytics 4)
  • Uptime 모니터링
  • 로그 수집 및 분석 체계

🔍 SEO

  • 메타 태그 (title, description, OG tags)
  • sitemap.xml 생성
  • robots.txt 설정
  • Structured Data (JSON-LD)

📋 실습 과제

나만의 프로젝트에 프로덕션 파이프라인 구축하기

이번 주에 배운 내용을 활용하여 자신의 프로젝트에 완전한 CI/CD 파이프라인과 모니터링 시스템을 구축해보세요.

필수 구현 사항:

  1. GitHub Actions를 활용한 자동 테스트 파이프라인
  2. main 브랜치 머지 시 자동 배포
  3. PR 생성 시 미리보기 환경 자동 생성
  4. Sentry 통합 및 에러 트래킹
  5. Firebase Performance Monitoring 설정
  6. Slack 또는 이메일 알림 연동

Mission-Context-Work 프롬프트 작성 연습

실제 업무 시나리오를 선택하여 AI에게 작업을 배정하는 완벽한 프롬프트를 작성해보세요.

연습 시나리오 (하나 선택):

  • 사용자 인증 시스템 구축 (이메일/비밀번호 + 소셜 로그인)
  • 실시간 채팅 기능 구현 (WebSocket + Firestore)
  • 결제 시스템 통합 (Stripe 또는 Toss Payments)
  • 이미지 업로드 및 최적화 파이프라인
  • 검색 기능 구현 (Algolia 또는 Elasticsearch)

🔮 다음 주차 예고

Week 4: 레거시 코드 현대화 & 팀 확산 전략

실전에서 가장 많이 마주하는 과제인 레거시 코드를 AI의 도움으로 안전하게 리팩토링하는 방법과, 팀 전체에 AI-First 개발 문화를 확산시키는 전략을 배웁니다.

  • 테스트 기반 리팩토링으로 레거시 코드 안전하게 개선하기
  • 팀원들과 AI 활용 노하우 공유하는 체계 구축
  • AI-First 개발 문화 정착을 위한 실전 전략
  • 최종 프로젝트 발표 및 피드백