본문으로 건너뛰기

20개 문서가 "바이브코딩스터디" 태그에 분류되었습니다

모든 태그 보기

10강: 수직 슬라이싱

한 번에 전부 만들지 말고, 기능 하나씩 완성하고 커밋하는 수직 슬라이싱 기법을 배웁니다. 10분 안에 확인 못 하면 너무 큰 겁니다.

11강: 프론트엔드 기초

HTML+CSS에서 한 단계 올라가, Next.js 프레임워크로 진짜 서비스의 화면을 만들어봅니다. 컴포넌트는 레고 블록, Tailwind CSS는 색칠 스티커예요.

12강: 백엔드 기초

새로고침해도 안 사라지는 데이터를 만들려면 데이터베이스가 필요해요. Supabase로 테이블을 만들고 CRUD(만들기/읽기/수정/삭제)를 실습합니다.

13강: API 연동

혼자 다 만들 필요 없어요. 날씨, 지도, AI 같은 남의 서비스를 내 앱에 가져다 쓰는 방법을 배웁니다. API라는 주문 창구를 통해서요.

14강: 인증

누가 쓰는지 알아야 '내 데이터'를 보여줄 수 있어요. Supabase Auth로 이메일 로그인과 소셜 로그인을 만들고, RLS로 내 데이터를 보호하는 법을 배웁니다.

15강: 디버깅

에러 메시지를 읽을 줄 몰라도 괜찮아요. 복사해서 AI에게 붙여넣기만 하면 됩니다. 바이브 코딩에서 에러를 대하는 완벽한 자세와 디버깅 방법을 알아봅니다.

16강: 배포

Vercel을 이용해 내 프로젝트를 인터넷에 공개하는 전 과정을 안내합니다. 환경 변수 설정, 자동 배포, 커스텀 도메인 연결까지 클릭 몇 번이면 충분해요.

17강: 피드백과 개선

배포 후 사용자 피드백을 수집하고 지속적으로 앱을 개선하는 사이클을 배웁니다.

18강: 디자인 레벨업

스타일 이름을 알면 AI에게 정확한 주문이 가능해요. /frontend-design 스킬로 프로 수준의 UI를 만드는 법을 알아봐요.

19강: 자동화

매일 반복하는 작업이 있다면 한 번만 만들어두면 끝이에요. 크론과 웹훅의 개념부터 GitHub Actions 실전까지 안내합니다.

20강: 모바일 앱

웹사이트인데 앱처럼 쓸 수 있어요. PWA로 홈 화면 설치, 오프라인 동작까지 가능한 모바일 앱을 만드는 법을 알아봐요.

2강: AI 시대의 기본 용어

프롬프트, 토큰, 프론트엔드, 백엔드, API, 데이터베이스... AI에게 올바른 지시를 하려면 알아야 할 핵심 용어를 생활 속 비유로 풀어드려요.

3강: 개발 환경 세팅

GitHub 가입부터 Claude Code 설치, 에디터 선택, 터미널 기초까지. 이 30분이 수백 시간을 좌우해요.

5강: Git

바이브 코더를 위한 Git과 GitHub의 기초 개념을 게임 세이브 비유로 쉽고 재미있게 배웁니다.

7강: 좋은 프롬프트의 기술

같은 AI인데 결과가 10배 달라지는 비밀. 프롬프트 3요소와 나쁜/좋은 프롬프트 비교 5쌍, 레퍼런스 활용법까지 실전으로 배웁니다.

8강: 첫 프로젝트

7강에서 배운 프롬프트 기술을 총동원해서, HTML+CSS로 개인 웹페이지를 만들고 GitHub Pages로 무료 배포합니다. 오늘 끝나면 내 이름이 적힌 URL이 생겨요.

9강: CLAUDE.md

CLAUDE.md에 프로젝트 규칙을 한 번 적어두면, AI가 매번 알아서 따릅니다. context7 설치, settings.json 설정, 메모리 시스템까지 한 번에 세팅하세요.