🎯
11:20-12:00 (40분) · 오전 3세션

Plan 모드 체험

함께 만드는 첫 번째 앱

💡 "AI가 계획을 세우고, 우리는 검토하고 승인합니다"

📋 세션 개요

이론은 충분합니다! 이제 직접 Plan 모드로 앱을 만들어봅니다.강사와 함께 "부서 연락처 검색 앱"을 처음부터 완성까지 만들어보며, Plan 모드의 실제 워크플로우를 체험합니다.

이 세션의 목표: 오후에 여러분이 직접 프로젝트를 진행할 때 "이렇게 하면 되는구나!"라는 자신감을 갖는 것입니다. 따라하면서 전체 흐름을 익히세요.

🎯 학습 목표

1
Plan 모드 실제 사용: Plan 모드를 직접 사용해보며 익숙해집니다
2
계획 검토 및 승인: AI가 제시한 계획을 검토하고 승인하는 과정을 경험합니다
3
결과물 확인 및 개선: 완성된 앱을 확인하고 대화로 개선하는 방법을 배웁니다
4
자신감 획득: "나도 할 수 있다!"는 자신감을 갖습니다

📱 만들어볼 앱: 부서 연락처 검색

✨ 주요 기능

  • 직원 이름으로 검색
  • 부서별 필터링
  • 연락처 정보 카드 형태로 표시
  • 깔끔하고 사용하기 쉬운 UI

🎨 예상 결과물

미리보기
🔍 검색창
📁 부서 필터
👤 홍길동 | 기획처 | 02-3399-3001

👨‍💻 실습: 함께 따라하기

1프로젝트 폴더 준비 (2분)

📁 폴더 만들기

  1. 1. 바탕화면에 contact-search 폴더 생성
  2. 2. Cursor 실행
  3. 3. File → Open Folder → 방금 만든 폴더 선택

2Plan 모드로 요청하기 (5분)

🎯 Plan 모드 활성화

Cursor 하단의 모드 선택에서 "Plan"을 선택합니다.

💬 요청 메시지

"부서 연락처 검색 앱을 만들고 싶어요.

기능:
- 직원 이름으로 검색
- 부서별 필터링 (기획처, 교무처, 학생처, 총무처)
- 연락처 정보를 카드 형태로 표시

테스트용 직원 데이터 10명 정도 포함해주세요.
HTML 파일 하나로 만들어주세요."

💡 복사해서 그대로 사용해도 됩니다!

3계획 검토하기 (5분)

📋 AI가 제시하는 계획 확인

AI가 구현 계획을 보여줍니다. 다음 항목들을 확인하세요:

  • • 어떤 파일을 만들 것인지
  • • 어떤 기능을 구현할 것인지
  • • 대략적인 구조가 어떻게 되는지

✅ 계획이 마음에 들면

"좋아요, 진행해주세요" 또는 승인 버튼을 클릭합니다.

🔄 수정이 필요하면

"부서에 '정보전산팀'도 추가해주세요" 처럼 피드백을 줍니다.

4실행 및 결과 확인 (10분)

⚡ AI가 코드 작성

승인하면 AI가 계획대로 코드를 작성합니다. 진행 상황을 지켜보세요.

🌐 브라우저에서 확인

  1. 1. 생성된 index.html 파일을 찾습니다
  2. 2. 파일을 더블클릭하거나 브라우저로 드래그합니다
  3. 3. 앱이 잘 작동하는지 확인합니다!

5대화로 개선하기 (15분)

💬 개선 요청 예시

"검색창을 더 크게 만들어주세요"

"카드에 이메일 정보도 추가해주세요"

"전화번호를 클릭하면 전화 앱이 열리게 해주세요"

"배경색을 더 밝게 해주세요"

🔄 반복하며 완성도 높이기

결과를 확인하고 → 개선 요청하고 → 다시 확인하는 과정을 반복합니다. 이것이 AI 코딩의 핵심 워크플로우입니다!

✅ 완성 체크리스트

❓ 자주 발생하는 문제

Q: Plan 모드가 안 보여요

A: Cursor 하단의 모드 선택 버튼을 확인하세요. 최신 버전으로 업데이트가 필요할 수 있습니다.

Q: 계획이 너무 복잡해 보여요

A: 괜찮습니다! 세부 내용을 다 이해할 필요 없어요. "이런 것들을 만들겠구나" 정도만 파악하면 됩니다.

Q: 결과물이 예상과 다르게 나왔어요

A: 정상입니다! "이 부분을 이렇게 바꿔줘"라고 대화로 수정 요청하세요.

Q: 에러가 발생했어요

A: 에러 메시지를 그대로 AI에게 보여주고 "이 에러 해결해줘"라고 요청하세요.

💎 이 세션에서 배운 핵심

1️⃣

목표만 명확히 전달하면 된다

세부 구현은 AI가 알아서 계획하고 실행합니다

2️⃣

계획을 검토하고 승인하는 것이 내 역할

코드를 직접 작성하는 게 아니라 AI의 계획을 검토합니다

3️⃣

대화로 계속 개선할 수 있다

한 번에 완벽할 필요 없어요. 대화하며 발전시킵니다

🍽️

점심 시간 (12:00 - 13:00)

맛있는 점심 드시고 오세요! 오후에는 여러분만의 프로젝트를 만들어봅니다.

💡 점심 시간 동안 생각해보세요: "내 업무에서 효율화하고 싶은 게 뭐가 있을까?"

🚀 오후 세션 예고

💡 Session 4: 나만의 프로젝트 기획

오후에는 여러분의 업무에 실제로 필요한 앱을 직접 기획하고 만들어봅니다. 오전에 배운 Plan 모드를 활용해서 처음부터 끝까지 완성해봅니다!

미리 생각해보기:설문조사? 일정 관리? 데이터 정리? 어떤 앱을 만들면 좋을까요?

👨‍🏫 강사 노트

⏰ 시간 배분: 폴더 준비 2분, 요청 5분, 계획 검토 5분, 실행 10분, 개선 15분, 정리 3분

🎯 핵심 목표: 참가자들이 "나도 할 수 있겠다!"는 자신감을 갖게 하기

💬 진행 방식: 강사가 먼저 시연 → 참가자들 따라하기 → 개별 질문 대응

⚠️ 주의: 너무 빨리 진행하지 않기, 뒤처지는 분 있는지 수시로 확인

🔧 트러블슈팅: Plan 모드 안 보이면 버전 확인, 에러 발생 시 AI에게 물어보도록 안내

🎉 마무리: "오후에 직접 만들어볼 거예요!" 기대감 조성