[챌린지] 인프런 혼자 공부하는 바이브 코딩(5주차)

🚶기본 미션(필수)

• PROJECT 9. 냉장고를 부탁해 앱 만들고 캡처하기

Chapter6

 

# 프롬프트1
OpenRouter에서 받은 API 키를 .env 파일로 저장했어. 이 키를 안전하게 사용할 수 있도록 준비해 줘.

#프롬프트2
이제 준비된 API가 실제로 작동하는지 테스트해 줘.
이미지 인식은 google/gemma-3-27b-it:free 모델을 이용하고,
텍스트 인식은 deepseek/deepseek-chat -v3.1:free 모델을 이용할 거야.
API를 통한 텍스트와 이미지 인식을 각각 테스트해서 실행 결과를 알려줘.

# 프롬프트3
앞서 만든 OpenRouter API를 이용해서, 냉장고 사진에서 재료를 인식하고 레시피를 추천하는 웹 애플리케이션
을 만들고 싶어. 다음과 같이 3단계로 나누어서 PRD를 만들어 줘.
1단계는 이미지를 입력받고 google/gemma-3 -27b-it:free 모델을 사용해서 이미지를 인식해.
2단계는 1단계에서 얻은 정보와 deepseek/deepseek-chat-v3.1:free 모델을 사용해서 레시피를 생성해.
3단계는 사용자 프로필을 만들어서 레시피를 저장해.
각 단계를 PRD_step1.md, PRD_step2.md, PRD_step3.md로 나누어 저장해 줘

# 프롬프트4
PRD_step1.md를 실행해.
메인 애플리케이션을 실행해서 1단계의 결과를 테스트해 줘.

# 프롬프트5
PRD_step2.md를 실행해.
메인 애플리케이션을 실행해서 2단계의 결과를 테스트해 줘.

# 프롬프트6
PRD_step3.md를 실행해.
메인 애플리케이션을 실행해서 3단계의 결과를 테스트해 줘.

 

 

Chapter7

# 프롬프트1
코드 리뷰어: 코드를 읽고 버그는 없는지, 코딩 규칙에 따라 올바르게 작성되었는지를 점검하고 성능 최적화를 제안하는 전문 코드 품질 검토자.

# 프롬프트2
code-bug-analyzer에게 냉장고를 부탁해 어플리케이션 코드를 검토하게 해줘.

# 프롬프트3
최적화 전문가: 애플리케이션의 작동을 원활하게 개선하고 속도를 빠르게 만들며 병목 지점을 찾아서 해결하는 시스템 최적화 엔지니어.

# 프롬프트4
UX 디자이너: 사용자가 쉽고 편하게 이용할 수 있도록 화면 디자인, 버튼 배치, 에러 메시지를 개선하는 사용자 경험 전문가.

# 프롬프트5(다중 에이전트 협업)
code-bug-analyzer로 ‘냉장고를 부탁해’ 애플리케이션 코드 전체를 리뷰한 뒤, 발견한 문제를 performance-optimizer가 수정해서 성능 최적화한 다음, ux-design-advisor가 사용자 경험을 개선하게 해 줘

# 프롬프트6
개선된 앱을 실행해서 브라우저에서 확인할 수 있게 해 줘.
현재 상태를 백업해 줘
백업으로 복원해 줘.

 

 

프롬프트1
제품 기획 관리자: 전체 개발 일정을 관리하는 프로덕트 매니저로서 PRD를 작성하여 제품의 목표, 기능, 사용자 요구사항을 정의한다

프롬프트2
백엔드 개발자: 서버 아키텍처 설계, API 개발, 데이터 처리, 외부 서비스 통합, 보안 및 성능 최적화를 담당하는 서버 사이드 개발 전문가. 안정적이고 확장 가능한 백엔드 시스템 구축.

프롬프트3
프런트엔드 개발자: 사용자 인터페이스 설계 및 구현, 반응형 디자인, 웹 접근성, 성능 최적화를 담당하는 클라이언트 사이드 개발 전문가.

프롬프트4
품질 보증 엔지니어: 전체 시스템의 기능 테스트, 에러 처리 검증, 성능 최적화, 코드 리뷰를 수행하는 품질 관리 전문가. 버그 발견, 사용성 개선사항 제안.

프롬프트5
AI 통합 전문가: LLM 및 AI 서비스 통합, 프롬프트 최적화, 모델 파인튜닝, AI 파이프라인 구축을 담당하는 인공지능 전문가. 여기서는 OpenRouter API를 통해 DeepSeek 모델과 연동하여 텍스트 생성, 요약을 구현하는 LLM 활용 전문가

프롬프트6
AI 공감 다이어리를 만들어 줘. 오늘 있었던 일을 한 줄로 쓰면, AI가 감정을 분석하고 공감하며 위로해 주는 일기 애플리케이션이야.
backend-architect가 OpenRouter API를 연동해서 감정 분석과 공감 메시지를 생성하는 기능을 구현해 줘.
DeepSeek V3.1 무료 모델을 사용하고, API 키는 현재 폴더의 ‘.env’ 파일에 저장된 것을 사용해.
frontend-developer가 따뜻하고 편안한 느낌의 일기장 UI를 만든 다음, qa-engineer가 실제로 여러 상황에서 문제없이 작동하는지 테스트해 줘.
문제를 발견하면 완전히 해결할 때까지 수정하고, 최종 버전을 브라우저에서 바로 열 수 있는 ‘index.html’ 파일로 만들어 줘.

# 프롬프트7
PDF 문서를 업로드하면 AI가 요약해주는 웹 애플리케이션을 만들 거야.
먼저 product-manager-prd가 PDF 문서 요약 앱의 상세 PRD와 기능 명세를 작성하고,
backend-architect가 PDF 파일 업로드, 텍스트 추출 기능을 구현해.
ai-integration-specialist가 OpenRouter API를 연동해서 추출된 텍스트를 요약하는 기능을 구현해 줘.
DeepSeek V3.1 무료 모델을 사용하고, API 키는 현재 폴더의 ‘.env’ 파일에 저장된 것을 사용해.
frontend-developer가 드래그&드롭 파일 업로드 UI와 요약 결과를 깔끔하게 표시하는 한글 인터페이스를 구현한 다음,
qa-engineer가 실제로 여러 상황에서 문제없이 작동하는지 테스트해 줘. 문제를 발견하면 완전히 해결할 때까지 수정하고, 최종 버전을 브라우저에서 바로 열 수 있는 ‘index_pdf.html’ 파일로 만들어 줘.