📚
🎧
💻
✏️
🚀

바이브 코딩 4주 집중 과정

PM을 위한 AI 도구 활용 웹 개발 실무 과정

주차별 커리큘럼

  • AI 없이, Replit의 기본 기능만으로 웹 앱 개발의 전체 사이클(기획-개발-배포)을 빠르게 경험하고 이해하기
  • Replit 환경에서 웹 앱 프로젝트를 생성하고 기본 구조를 이해할 수 있다
  • Replit의 원클릭 배포 기능으로 내가 만든 결과물을 인터넷에 공개할 수 있다
실습 프로젝트
'나만의 TODO 리스트' 웹 앱 데모
실습 과제
나만의 서비스 PRD(제품 요구사항 정의서) 작성하기 - 2주차부터 본격적으로 만들고 싶은 자신만의 웹 서비스에 대한 PRD를 작성
  • Cursor AI를 활용하여 기획서를 실제 웹사이트로 구현하기
  • 복잡한 설정이 필요한 Next.js와 Firebase를 AI의 도움으로 다루는 경험
  • Cursor AI를 개발 환경으로 설정하고, AI와 협업하는 방식을 익힐 수 있다
  • Next.js와 Firebase를 연동하여 프로젝트의 기본 뼈대를 구성할 수 있다
  • Firebase의 DB(Firestore)와 인증(Authentication) 기능을 활용해 데이터 저장 및 로그인 기능을 구현할 수 있다
실습 프로젝트
1주차 과제(PRD)를 바탕으로 '나만의 TODO 앱' 프로젝트 시작
실습 과제
PRD를 실제 웹으로 구현하기 - 1주차에 작성했던 PRD의 핵심 기능들을 Cursor AI를 활용하여 Next.js와 Firebase 기반의 웹사이트로 직접 구현
  • 터미널 기초 - Windows와 Mac에서 터미널 열기, cd 명령어 등 필수 기능 마스터하기
  • GitHub 계정 생성부터 Repository 관리까지 완전 초보자 가이드
  • Firebase App Hosting으로 GitHub 연동 자동 배포 파이프라인 구축하기
  • Firebase AI Logic과 Authentication을 활용한 완전한 웹 애플리케이션 개발
실습 프로젝트
'AI 감정 일기장' 또는 'AI가 응援해주는 TODO 앱'
실습 과제
GitHub Repository에 프로젝트 업로드, Firebase App Hosting 배포, AI 기능 연동, 사용자 인증 시스템 구현으로 개인화된 서비스 완성하기
  • Claude Code 설치 및 환경 설정 - 터미널부터 완전 정복하기
  • GitHub 홈페이지에서 Repository 생성, 브랜치 관리, 협업 기능 완전 마스터
  • Next.js 프로젝트 셋업 및 모던 React 개발 환경 구축
  • Firebase 완전 정복 - Firestore 데이터베이스, Authentication, App Hosting까지
  • 마음 일기장 만들기 - AI가 공감해주고 응원해주는 감정 일기 서비스 개발
실습 프로젝트
'AI 마음 일기장' - 감정을 분석하고 공감해주는 개인화된 일기 서비스
실습 과제
마음 일기장 완성하기 - Claude Code를 활용하여 AI 감정 분석, 사용자 인증, 실시간 데이터베이스가 포함된 완전한 웹 애플리케이션을 개발하고 배포하기