학습 경로 가이드

학습 경로 개요

Vibe Coding은 단순히 도구를 배우는 것이 아니라, AI와 협업하는 새로운 사고방식을 익히는 과정입니다. 이 가이드는 여러분이 효과적으로 학습할 수 있도록 검증된 경로를 제시합니다.

시간 투자 가이드

초급 (1-2주) ⭐

Vibe Coding의 기본을 다지는 단계입니다. 하나의 CLI 도구에 집중하고, 간단한 프로젝트 3개를 완성하는 것이 목표입니다.

Week 1: 개념 이해 및 첫 프로젝트

Day 1-2: 기초 학습 (3-4시간)

1. Vibe Coding이란? 완독 (30분)
2. AI CLI 도구 생태계 읽고 도구 선택 (30분)
3. Claude CLI 시작 또는 Ollama 시작 (1시간)
4. 첫 번째 프로젝트: Hello World (1시간)

Day 3-4: 프롬프트 기본 (2-3시간)

1. 프롬프트 기본 학습 (1시간)
2. 두 번째 프로젝트: 계산기 앱 (2시간)

Day 5-7: TODO 앱 완성 (3-4시간)

1. 세 번째 프로젝트: TODO 앱 (3시간)
2. 코드 리뷰 및 이해 (1시간)

const form = document.querySelector("#todo-form");
const input = document.querySelector("#todo-input");
const list = document.querySelector("#todo-list");

form.addEventListener("submit", (e) => {
  e.preventDefault();
  const text = input.value.trim();
  if (!text) return;
  const li = document.createElement("li");
  li.textContent = text;
  list.appendChild(li);
  input.value = "";
});

초급 체크리스트

초급 추천 자료

• Vibe Coding이란?
• Claude CLI 5분 시작
• Ollama 로컬 시작
• 프롬프트 기본
• Claude CLI 가이드

중급 (2-4주) ⭐⭐

다양한 도구와 기술을 익히고, 복잡한 프로젝트를 완성하는 단계입니다. 최소 2개 이상의 CLI 도구를 사용하고, 5-10개 프로젝트를 완성합니다.

Week 3-4: 도구 다양화 및 로컬 LLM

Day 1-3: 다른 CLI 도구 배우기 (4-5시간)

1. CLI 도구 비교 읽고 2번째 도구 선택 (1시간)
2. Ollama 설치 및 로컬 LLM 실행 (1시간)
3. Aider 또는 Continue.dev 학습 (2시간)

Day 4-7: API 연동 프로젝트 (6-8시간)

1. 날씨 앱 (OpenWeather API 연동)
2. 영화 검색 앱 (TMDB API 연동)
3. GitHub 프로필 뷰어 (GitHub API 연동)

Week 5-6: 복잡한 프로젝트 및 프롬프트 최적화

Day 1-3: React/Vue 프로젝트 (5-6시간)

1. React TODO 앱 (상태 관리 with useState/useEffect)
2. Vue.js 블로그 (컴포넌트 구조)

Day 4-7: 백엔드 프로젝트 (6-8시간)

1. Express.js REST API (CRUD 기능)
2. 데이터베이스 연동 (MongoDB 또는 PostgreSQL)
3. 인증 시스템 (JWT)

import express from "express";

const app = express();
app.use(express.json());

app.post("/posts", async (req, res) => {
  const { title, body } = req.body;
  if (!title || !body) return res.status(400).json({ error: "invalid payload" });
  // DB 저장 로직 자리
  res.status(201).json({ id: 1, title });
});

중급 체크리스트

중급 추천 자료

• CLI 도구 비교
• Ollama란?
• Ollama 연동
• 코딩용 프롬프트
• 프롬프트 최적화
• API 키 관리

고급 (4주+) ⭐⭐⭐

MCP 통합, 다중 LLM 전환, CI/CD 자동화 등 고급 주제를 다룹니다. 상용 수준의 복잡한 프로젝트를 완성하고, 커스텀 도구를 만들 수 있습니다.

고급 주제

1. MCP (Model Context Protocol) 통합

• MCP 개념 이해
• MCP 서버 개발 (Python/TypeScript)
• MCP 실전 예제 (파일 시스템, DB, API)
• 커스텀 MCP 서버로 외부 도구 통합

import { McpServer } from "@modelcontextprotocol/sdk/server/mcp.js";
import { z } from "zod";

const server = new McpServer({ name: "team-tools", version: "1.0.0" });

server.registerTool("create_jira_issue", {
  title: "Create Jira Issue",
  inputSchema: { summary: z.string() }
}, async ({ summary }) => ({
  content: [{ type: "text", text: `created: ${summary}` }]
}));

2. 다중 LLM 전환 전략

• LLM 생태계 개요
• 다중 LLM 전환
• LiteLLM, Portkey 사용
• 비용 최적화: 간단한 작업 → Haiku, 복잡한 작업 → Opus

3. CI/CD 및 자동화

• CI/CD와 LLM 통합
• GitHub Actions으로 자동 코드 리뷰
• 테스트 자동 생성 및 실행
• 문서 자동 생성

4. 커스텀 도구 개발

• 회사/팀 전용 CLI 도구 개발
• 프로젝트 템플릿 자동 생성
• 코드 스타일 가이드 자동 적용

고급 프로젝트 예시

고급 체크리스트

고급 추천 자료

• MCP (Model Context Protocol)
• 다중 LLM 전환
• CI/CD & LLM
• Vibe Coding 디자인 패턴
• 비용 모니터링
• Ollama 고급 활용

효과적인 학습 방법론

학습 팁 10가지

1. 프로젝트 기반 학습: 이론만 보지 말고 실제 프로젝트를 만들어보세요
2. 점진적 난이도: 쉬운 것부터 시작해서 점점 어려운 것으로
3. 코드 이해: AI가 생성한 코드를 반드시 읽고 이해하세요
4. 변형 실습: 같은 프로젝트를 다른 방식으로 다시 만들어보세요
5. 에러 경험: 의도적으로 에러를 만들고 AI와 함께 디버깅하세요
6. 커뮤니티 활용: Discord, Reddit에서 질문하고 답변하세요
7. 블로그 작성: 배운 내용을 블로그에 정리하세요
8. 오픈소스 기여: GitHub에서 작은 버그 수정부터 시작하세요
9. 페어 프로그래밍: 다른 사람과 함께 AI를 활용해보세요
10. 주기적 복습: 1주일마다 지난 프로젝트를 다시 보세요

피해야 할 실수

동기 유지 전략

• 작은 승리 축하: 작은 기능 하나 완성해도 축하하세요
• 진행 상황 기록: 매일 무엇을 배웠는지 기록하세요
• 목표 시각화: 만들고 싶은 앱의 목록을 적어두세요
• 학습 동료: 함께 배우는 친구를 찾으세요
• 휴식 중요: 막히면 잠시 쉬고 돌아오세요

다음 단계

학습 경로를 이해했다면, 이제 실제로 시작할 차례입니다!

핵심 정리

• 학습 경로 가이드의 핵심 개념과 흐름을 정리합니다.
• 학습 경로 개요를 단계별로 이해합니다.
• 실전 적용 시 기준과 주의점을 확인합니다.