바이브 코딩 필수 IT 지식
AI(Claude·Cursor 등)에게 코딩을 시킬 때 막히지 않기 위한 전체 흐름과 용어. 관계도의 박스를 클릭하면 그 용어의 자세한 설명으로 이동합니다.
아이디어 → AI 코딩 → 소스/Git → 빌드 → 프론트+백엔드 → 배포(CI/CD) → 서버·클라우드·OS ↔ DB → 사용자.크게 보기 ↗
| 주차 | 모듈 | 학습 목표 | 자주 막히는 지점 | 바로가기 |
|---|---|---|---|---|
| 1주차 | 0 · 1 | AI 리터러시 · 프롬프트 · PRD | ⚠ 막연한 프롬프트로 엉뚱한 결과 | |
| 2주차 | 2 · 3 | IDE/CLI · Git 기초 | ⚠ 터미널 명령·설치, 코드 되돌리기 | |
| 3주차 | 4 | 프론트엔드(웹/앱) 구조 | ⚠ 화면은 되나 데이터 저장 불가 | |
| 4주차 | 5 · 6 | 백엔드 · API · HTTP | ⚠ localhost/포트, API 연결 오류 | |
| 5주차 | 7 | 데이터베이스 · SQL | ⚠ 데이터 저장·조회 실패 | |
| 6주차 | 8 | 빌드 · CI/CD · 배포 | ⚠ 라이브러리 충돌, 배포 실패 | |
| 7주차 | 9 | 클라우드 · 서버 · OS | ⚠ 환경변수, 인프라 설정 | |
| 8주차 | 10 | BaaS · MCP · 에이전트로 실서비스화 | ⚠ 외부 연동 · 확장 설계 |
- 프론트엔드 화면이 입력값(이메일·비번)을 받음프론트엔드(화면)
- API·HTTP로 백엔드에 "이 사용자 저장해줘" 요청(JSON)API
- 백엔드 서버가 요청을 받아 검증·처리백엔드(백엔드 서버)
- SQL로 데이터베이스에 사용자 정보 저장SQL
- 백엔드가 "성공" 응답을 API·HTTP로 프론트에 반환HTTP
- 프론트가 화면에 "가입 완료" 표시프론트엔드(화면)
- 이 모든 것은 클라우드 위 서버에서, Nginx를 거쳐, Linux OS 위에서 돌아감클라우드(Cloud)
- 코드는 Git으로 관리되고, CI/CD로 배포됨CI/CD
- 개발자는 이 코드를 AI 도구와 IDE로 작성·수정함IDE(통합개발환경)
방대한 텍스트로 학습해 사람의 말을 이해하고 문장·코드를 생성하는 AI 모델.
OpenAI가 만든 대화형 LLM 서비스.
Anthropic이 만든 LLM 및 그 기반 도구군(대화·Artifacts·Claude Code 등).
Google이 만든 LLM.
AI에게 주는 입력(명령·질문·맥락)을 설계하는 것.
AI가 답을 만들 때 참고하는 배경 정보(이전 대화·코드베이스·파일 등).
AI 출력이 실제로 잘 도는지 검증하고 안전하게 감싸는 장치(테스트·가드레일).
코드 작성·실행·디버깅·배포를 한곳에서 하는 통합 소프트웨어.
마이크로소프트의 가볍고 확장성 높은 무료 코드 편집기/IDE.
VS Code를 기반으로 AI를 깊게 내장한 AI 코드 에디터.
그래픽 버튼 대신 텍스트 명령어로 컴퓨터·프로그램을 다루는 방식(터미널).
터미널에서 명령어로 Gemini와 대화·작업하는 도구.
요구사항을 실제 코드로 구현하는 행위.
사용자가 눈으로 보고 직접 조작하는 영역(화면·버튼·입력창).
웹 페이지의 구조/뼈대를 정의하는 마크업 언어.
HTML 요소의 디자인/스타일(색·크기·배치)을 지정하는 언어.
웹 페이지에 동작/상호작용을 부여하는 프로그래밍 언어.
복잡한 웹 화면(UI)을 효율적으로 만드는 JavaScript 라이브러리/프레임워크.
하나의 코드로 여러 플랫폼(웹·앱)을 만드는 구글의 UI 프레임워크.
사용자의 브라우저 요청을 받아 웹 화면(HTML/CSS/JS)을 전달하는 서버 소프트웨어.
React 문법으로 iOS·안드로이드 앱을 만드는 프레임워크.
각각 구글·애플의 모바일 운영체제(OS).
각각 애플·구글의 앱 배포/설치 장터.
앱을 사용자 기기에 내려받아 실행 가능한 상태로 두는 것.
화면 뒤에서 데이터와 비즈니스 로직을 처리하는 영역.
백엔드 로직을 실제로 실행하는 프로그램.
Java 기반의 대표적인 백엔드 프레임워크.
JavaScript로 서버를 만들 수 있게 해주는 실행 환경.
Python 기반의 빠르고 가벼운 백엔드 프레임워크.
'내 컴퓨터 자신'을 가리키는 주소(127.0.0.1).
한 컴퓨터 안에서 여러 프로그램을 구분하는 '문 번호'(예: 3000, 8080).
흩어진 소스 코드를 실행 가능한 하나의 결과물로 압축·조립하는 과정.
빌드 결과로 만들어진 배포용 묶음(또는 재사용 코드 묶음인 라이브러리).
남이 미리 만든 재사용 코드 묶음(라이브러리)과, 내 프로젝트가 그것에 의존하는 관계(의존성).
코드 변경을 자동으로 통합·검사(CI)하고 자동으로 배포(CD)하는 흐름.
완성된 결과물을 실제 사용자가 쓸 수 있는 환경(서버·마켓)에 올리는 것.
프론트엔드·웹 서비스를 손쉽게 배포·호스팅해 주는 플랫폼.
사용자의 요청을 받아 처리·응답하는 컴퓨터(또는 프로그램).
물리 서버를 직접 사지 않고 인터넷으로 빌려 쓰는 컴퓨팅 자원.
아마존의 세계 1위 클라우드 서비스.
마이크로소프트의 클라우드 서비스.
대표적인 고성능 웹서버/리버스 프록시 소프트웨어.
하드웨어를 관리하고 프로그램이 돌 수 있게 하는 기반 소프트웨어.
마이크로소프트의 데스크톱·서버 운영체제.
오픈소스 운영체제. 서버 세계의 사실상 표준.
설치 없이 인터넷으로 구독해 쓰는 완성형 소프트웨어 서비스.
DB·인증·저장소 같은 백엔드 기능을 미리 만들어 제공하는 서비스. Supabase가 대표.
AI 모델이 외부 도구·데이터에 표준 방식으로 연결되도록 하는 프로토콜.
스스로 도구를 쓰고 여러 단계를 수행하는 AI. Claude Code는 코딩용 에이전트 도구.
코드 밖에 따로 두는 설정값(비밀키·DB주소·API키 등).