2강: AI 시대의 기본 용어
문법은 몰라도 개념은 알아야 해요
왜 용어를 알아야 하나요?
1강에서 바이브 코딩은 "AI에게 방향을 알려주는 것"이라고 했어요. 그런데 방향을 알려주려면, 방향을 표현할 단어가 있어야 해요.
비유를 하나 들어볼게요.
여러분이 인테리어 업체에 전화해서 "거실 예쁘게 해주세요"라고 하면, 결과물이 마음에 들 확률이 낮아요. 그런데 "거실 벽은 무광 화이트로, 조명은 간접등으로, 바닥은 원목 느낌 타일로 해주세요"라고 하면? 훨씬 정확하게 나오겠죠.
여기서 "무광", "간접등", "원목 타일" 같은 단어를 아는 게 중요한 거예요. 인테리어를 직접 할 줄 몰라도, 업체에 정확히 주문하려면 최소한의 용어는 알아야 하잖아요.
바이브 코딩도 마찬가지예요. 코드를 짤 줄 몰라도 괜찮아요. 하지만 AI에게 "프론트엔드는 이렇게, API는 저렇게" 하고 지시하려면, 오늘 배울 용어들이 꼭 필요해요.
걱정 마세요. 외울 필요 없어요. "아, 이런 뜻이구나" 정도만 감 잡으면 돼요. 나중에 실전에서 계속 만나면 자연스럽게 몸에 배거든요.
AI와 대화할 때 쓰는 3대 핵심 용어
바이브 코딩에서 가장 먼저 만나는 단어 세 가지예요. 이것만 알아도 AI 관련 글이 갑자기 읽히기 시작해요.
프롬프트 (Prompt) — AI에게 주는 주문서
카페에 가면 주문서에 "아이스 아메리카노, 연하게, 얼음 많이"라고 적잖아요. 프롬프트는 AI에게 주는 주문서예요. 여러분이 AI 대화창에 타이핑하는 모든 문장이 프롬프트예요.
자기소개 웹페이지 만들어줘.
- 3개 섹션: 인사말, 경력, 연락처
- 다크 배경에 시안 포인트
위 문장 전체가 하나의 프롬프트예요. 1강에서 배웠듯이, 이 주문서를 구체적으로 쓸수록 결과물이 좋아져요.
토큰 (Token) — AI가 글을 읽는 단위
우리가 문장을 읽을 때는 "단어" 단위로 읽잖아요. AI는 조금 다르게, 토큰이라는 단위로 읽어요.
편의점 계산대를 생각해 보세요. 상품을 하나씩 바코드로 찍잖아요. AI도 문장을 받으면 작은 조각으로 쪼개서 하나씩 처리해요. 그 조각 하나가 토큰이에요.
- 영어는 대략 단어 하나가 토큰 하나예요. "Hello"는 1토큰.
- 한글은 조금 더 잘게 쪼개져요. "안녕하세요"가 2~3토큰 정도.
왜 이걸 알아야 하냐면, AI 서비스의 가격이 토큰 수로 매겨지기 때문이에요. 토큰을 많이 쓸수록 비용이 올라가요. 지금 당장 비용을 걱정할 필요는 없지만, "토큰"이라는 단어가 나오면 "아, AI가 처리하는 글자 조각이구나" 정도로 알고 계시면 돼요.
모델 (Model) — AI의 두뇌 버전
"모델"이라고 하면 패션 모델이 떠오를 수 있는데, 여기서는 AI의 두뇌 버전을 뜻해요.
스마트폰에 비유하면 이해가 쉬워요.
- 갤럭시 S24, S25, S26... 숫자가 올라갈수록 성능이 좋아지죠?
- AI 모델도 마찬가지예요. Claude Sonnet, Claude Opus 같은 이름이 붙고, 버전이 올라갈수록 더 똑똑해져요.
현재 우리가 주로 쓰는 건 Claude(클로드)라는 AI의 모델이에요. Anthropic(앤스로픽)이라는 회사가 만들었어요. 다른 유명한 모델로는 OpenAI의 GPT, Google의 Gemini(제미나이)가 있어요.
어떤 모델을 쓰느냐에 따라 같은 프롬프트에도 결과가 달라질 수 있어요. 마치 같은 레시피를 줘도 초보 요리사와 베테랑 요리사의 결과가 다르듯이요.
프론트엔드 vs 백엔드 — 유튜브로 이해하기
개발 세계에서 가장 자주 듣는 두 단어예요. 어렵게 생각할 필요 없어요. 유튜브를 떠올리시면 바로 이해돼요.
프론트엔드 (Frontend) — 눈에 보이는 모든 것
지금 유튜브를 열어보세요. 화면에 보이는 것들이 있죠?
- 빨간 재생 버튼
- 동영상 썸네일(미리보기 이미지)
- 구독 버튼
- 댓글 입력창
- 좋아요/싫어요 아이콘
이런 눈에 보이고, 클릭하고, 스크롤할 수 있는 모든 것이 프론트엔드예요. "앞쪽(front)"에서 사용자와 만나는 부분이라서 프론트엔드라고 불러요.
백엔드 (Backend) — 뒤에서 일어나는 모든 것
재생 버튼을 누르면 동영상이 나오잖아요. 그런데 그 동영상은 어디에 저장되어 있을까요? 여러분 컴퓨터에는 없어요. 구글의 거대한 서버(server, 데이터를 저장하고 처리하는 컴퓨터)에 있다가, 재생 버튼을 누르는 순간 여러분에게 전달되는 거예요.
이렇게 눈에 안 보이지만 뒤에서 일어나는 일들이 백엔드예요.
- 동영상 파일을 저장하고 있기
- "재생" 요청이 오면 영상 데이터를 보내주기
- 누가 좋아요를 눌렀는지 기록하기
- 댓글을 저장하고 불러오기
- 구독자 수를 세기
한 줄 정리
| 프론트엔드 | 백엔드 | |
|---|---|---|
| 위치 | 사용자 눈앞 (브라우저 화면) | 뒤편 (서버) |
| 하는 일 | 보여주고, 입력 받기 | 저장하고, 계산하고, 보내주기 |
| 유튜브 비유 | 재생 버튼, 썸네일, 댓글창 | 영상 저장소, 조회수 계산, 추천 알고리즘(취향에 맞는 영상을 골라주는 규칙) |
| 레스토랑 비유 | 매장 인테리어, 메뉴판, 서빙 | 주방, 냉장고, 요리사 |
바이브 코딩을 할 때 AI에게 "프론트엔드 먼저 만들어줘" 또는 "백엔드는 나중에 붙이자"라고 지시할 수 있으려면, 이 구분을 알고 있어야 해요.
API — 프로그램끼리 대화하는 통로
API(Application Programming Interface, 프로그램 간 대화 규약)는 처음 들으면 어려워 보이지만, 알고 보면 아주 친숙한 개념이에요.
![API — 프로그램끼리 대화하는 창구 (패스트푸드점 카운터 비유)]
식당 주문 창구 비유
패스트푸드점을 떠올려 보세요.
- 여러분이 카운터에 가서 "치즈버거 세트 하나요" 하고 주문해요.
- 카운터 직원이 주방에 주문을 전달해요.
- 주방에서 음식을 만들어요.
- 카운터 직원이 완성된 음식을 여러분에게 건네줘요.
여기서 카운터가 바로 API예요. 여러분(프론트엔드)은 주방(백엔드)에 직접 들어가지 않아요. 카운터(API)를 통해 주문하고, 카운터를 통해 결과물을 받아요.
실제로는 이런 식이에요
[여러분의 브라우저] → "서울 날씨 알려줘" → [기상청 API] → [기상청 서버]
← "맑음, 22도" ← ←
기상청이 날씨 데이터를 가지고 있어요. 그런데 기상청 서버에 직접 접속할 수는 없잖아요. 대신 기상청이 API라는 창구를 열어뒀어요. 그 창구로 "서울 날씨 알려줘"라고 요청(request, 데이터를 달라는 신호)하면, "맑음, 22도"라는 응답(response, 돌려주는 데이터)이 돌아와요.
바이브 코딩에서 API를 직접 만들 일은 드물어요. 하지만 "날씨 API 붙여줘", "카카오 로그인 API 연동해줘" 같은 지시는 자주 하게 돼요. 그때 "아, API는 데이터를 주고받는 창구구나" 라는 감이 있으면 AI와의 대화가 훨씬 수월해져요.
데이터 저장소 3종 — 메모리, localStorage, DB
"데이터를 어디에 저장하느냐"에 따라 동작이 완전히 달라져요. 세 가지를 칠판, 포스트잇, 서류 캐비닛에 비유해서 설명해 드릴게요.
메모리 (Memory) — 칠판
칠판에 뭔가를 적었다고 해 볼게요. 수업이 끝나고 누가 칠판을 지우면? 사라지죠. 메모리가 딱 이거예요. 프로그램이 돌아가는 동안만 존재하고, 새로고침하거나 창을 닫으면 깨끗하게 사라져요.
예: 유튜브에서 영상 을 잠깐 멈추면, "1분 23초까지 봤다"는 정보가 메모리에 있어요. 하지만 탭을 닫으면 그 정보는 사라져요.
localStorage (로컬스토리지) — 포스트잇
모니터에 포스트잇을 붙여놨다고 해 볼게요. 컴퓨터를 껐다 켜도 포스트잇은 여전히 거기 붙어있죠. localStorage는 내 브라우저 안에 저장되는 작은 저장소예요. 새로고침해도, 브라우저를 닫았다 열어도 살아있어요.
예: "다크 모드" 설정을 켜놓으면 다음에 사이트에 들어와도 다크 모드가 유지되는 것, 그게 localStorage 덕분이에요.
단, 내 컴퓨터에만 저장되니까 다른 기기에서는 안 보여요. 회사 컴퓨터에서 켠 다크 모드가 집 컴퓨터에서는 안 켜져 있는 이유예요.
DB (Database, 데이터베이스) — 서류 캐비닛
사무실의 거대한 서류 캐비닛을 떠올려 보세요. 모든 고객 정보, 주문 내역, 계약서가 체계적으로 정리되어 있어요. 누가 와도 찾을 수 있고, 사무실이 아닌 다른 지점에서도 접근할 수 있어요. DB가 바로 이 서류 캐비닛이에요.
- 어떤 기기에서든 접근 가능 (서버에 저장되니까)
- 여러 사람이 동시에 사용 가능
- 체계적으로 정리되어 있어서 검색이 빠름
예: 유튜브에 로그인하면 구독 목록이 뜨잖아요. 집 컴퓨터에서도, 회사 컴퓨터에서도, 폰에서도 같은 구독 목록이 보여요. 구독 정보가 DB에 저장되어 있기 때문이에요.
세 줄 정리
| 저장소 | 비유 | 사라지는 시점 | 다른 기기에서 접근 |
|---|---|---|---|
| 메모리 | 칠판 | 새로고침하면 사라짐 | 불가능 |
| localStorage | 포스트잇 | 직접 지우기 전까진 유지 | 불가능 (내 브라우저만) |
| DB | 서류 캐비닛 | 직접 삭제하기 전까진 유지 | 가능 (서버에 있으니까) |
바이브 코딩에서 AI에게 "이 데이터는 DB에 저장해줘" 또는 "이건 localStorage에 넣어도 돼"라고 지시할 수 있으면, 훨씬 정확한 결과물이 나와요.
웹 vs 앱 vs 자동화 봇 — "어디서 돌아가느냐"
"무언가를 만든다"고 할 때, 그게 어디서 돌아가는지에 따라 종류가 나뉘어요.
웹 (Web) — 브라우저에서 돌아가는 것
크롬, 사파리, 엣지 같은 브라우저를 열어서 사용하는 게 웹이에요. 주소창에 URL(인터넷 주소)을 입력하면 열리죠.
- 예: 네이버, 유튜브, 지금 보고 계신 AI//STUDY 사이트
- 장점: 설치할 게 없어요. 링크만 클릭하면 바로 사용 가능
- 바이브 코딩에서: 가장 먼저 배우는 형태예요. 결과를 바로 눈으로 확인할 수 있어서 입문에 딱이에요.
앱 (App) — 스마트폰에 설치해서 쓰는 것
앱스토어나 플레이스토어에서 다운받아 설치하는 것들이에요.
- 예: 카카오톡, 배달의민족, 인스타그램
- 장점: 푸시 알림을 보낼 수 있고, 카메라/GPS 같은 폰 기능을 쓸 수 있어요
- 바이브 코딩에서: 바로 앱을 만들기보다는, 웹을 먼저 만들고 나중에 PWA(Progressive Web App, 웹인데 앱처럼 설치할 수 있는 기술)로 앱 느낌을 줄 수 있어요. 19강에서 자세히 다뤄요.
자동화 봇 (Bot) — 화면 없이 뒤에서 일하는 것
화면이 아예 없는 프로그램도 있어요. 정해진 시간에 정해진 일을 반복하는 로봇이에요.
- 예: 매일 아침 8시에 뉴스를 모아서 슬랙에 보내주는 봇, 매주 월요일에 주간 보고서를 만들어주는 봇
- 장점: 한번 만들어두면 사람이 안 건드려도 알아서 돌아가요
- 바이브 코딩에서: "반복적인 일을 AI에게 시켜서 자동화하기"가 바이브 코딩의 큰 매력 중 하나예요. 18강에서 다뤄요.
한 줄 정리
| 종류 | 어디서 돌아가나 | 사용자가 보는 화면 | 예시 |
|---|---|---|---|
| 웹 | 브라우저 | 있음 | 네이버, AI//STUDY |
| 앱 | 스마트폰 | 있음 | 카카오톡, 배민 |
| 자동화 봇 | 서버 | 없음 (뒤에서 실행) | 뉴스 수집 봇, 리포트 봇 |
실습: 유튜브에서 프론트와 백엔드 찾아보기
오늘 배운 용어들을 직접 적용해 볼 시간이에요. 유튜브를 열고 아래 질문에 답해 보세요.
도전 1: 프론트엔드 찾기
유튜브 화면을 보면서, 눈에 보이는 것 5개를 적어보세요.
예시 답안:
- 유튜브 로고 (좌측 상단)
- 검색창
- 동영상 썸네일 목록
- 재생 버튼
- 좋아요/싫어요 버튼
이것들이 전부 프론트엔드예요.
도전 2: 백엔드 추측하기
이번에는 눈에 안 보이지만 뒤에서 일어나고 있을 일 3가지를 추측해 보세요.
예시 답안:
- 검색어를 입력하면, 백엔드가 수십억 개의 동영상 중에서 관련 있는 걸 골라줘요
- 재생 버튼을 누르면, 백엔드가 동영상 파일을 서버에서 꺼내 보내줘요
- 좋아요를 누르면, 백엔드가 "이 사람이 이 영상에 좋아요를 눌렀다"고 DB에 기록해요
도전 3: API 찾기
검색창에 "고양이"를 타이핑하면, 글자를 칠 때마다 아래에 추천 검색어가 뜨죠? 이게 바로 API가 작동하는 거예요.
여러분의 브라우저(프론트엔드)가 "사용자가 '고양'까지 쳤어요"라고 유튜브 서버(백엔드)의 검색 추천 API에 요청을 보내요. 그러면 서버가 "고양이", "고양이 영상", "고양이 먹방" 같은 추천어를 응답으로 보내주는 거예요.
도전 4: 데이터 저장소 구분하기
유튜브에서 일어나는 일들이 어떤 저장소에 해당하는지 맞춰보세요.
| 상황 | 어떤 저장소? |
|---|---|
| 영상을 1분 30초까지 보다가 새로고침하면 처음부터 재생됨 | 메모리 (칠판 — 새로고침하면 사라짐) |
| "자동재생 끄기" 설정이 다음에도 유지됨 | localStorage (포스트잇 — 내 브라우저에 저장) |
| 다른 기기에서 로그인해도 구독 목록이 같음 | DB (서류 캐비닛 — 서버에 저장) |
어때요? 유튜브 하나만 봐도 오늘 배운 용어가 전부 등장하죠. 실제 서비스 하나를 이 눈으로 뜯어보면, 용어가 훨씬 빠르게 체화돼요.
이번 강에서 기억할 것
핵심만 정리해 볼게요.
-
프롬프트는 AI에게 주는 주문서예요. 구체적으로 쓸수록 결과가 좋아져요.
-
토큰은 AI가 글을 읽는 단위예요. 편의점 바코드처럼, AI가 문장을 잘게 쪼개서 처리하는 조각이에요. 비용도 토큰 수로 계산돼요.
-
모델은 AI의 두뇌 버전이에요. Claude, GPT, Gemini 같은 이름이 붙어요. 버전이 높을수록 더 똑똑해요.
-
프론트엔드는 눈에 보이는 것, 백엔드는 뒤에서 일어나는 것이에요. 유튜브의 재생 버튼은 프론트엔드, 영상을 찾아서 보내주는 건 백엔드예요.
-
API는 프로그램끼리 대화하는 창구예요. 패스트푸드점 카운터처럼, 주문(요청)하면 결과(응답)가 돌아와요.
-
데이터 저장소는 3종류예요. 메모리(칠판, 곧 사라짐) / localStorage(포스트잇, 내 브라우저만) / DB(서류 캐비닛, 어디서든 접근).
-
만드는 것의 종류는 세 가지예요. 웹(브라우저) / 앱(스마트폰) / 자동화 봇(화면 없이 뒤에서).
오늘 배운 단어들은 앞으로 매 강마다 계속 등장해요. 한 번에 외우려 하지 마시고, "어디서 본 단어인데?" 하는 느낌만 남겨두면 돼요. 실전에서 반복해서 만나다 보면 자연스럽게 체득될 거예요.
다음 강에서는 개발 환경 세팅을 다뤄요. Claude Code를 설치하고, 터미널(컴퓨터에 글자로 명령을 내리는 창)이라는 도구를 처음 열어보는 시간이에요. 걱정 마세요. 딱 30분이면 끝나요.
이런 분께 추천해요
이번 강은 "AI 용어가 왜 이렇게 많아?" 하고 막막했던 분을 위한 시간이에요.
- AI 뉴스를 읽을 때 모르는 단어가 너무 많은 분 -- 프롬프트, 토큰, 모델 같은 기본 단어를 알면 기사가 갑자기 읽히기 시작해요.
- 1강을 듣고 "바이브 코딩 해보고 싶다"고 느꼈지만 용어가 걸리는 분 -- 프론트엔드, 백엔드, API를 비유로 이해하고 나면 AI에게 훨씬 구체적으로 지시할 수 있어요.
- 비개발자인데 개발팀과 소통해야 하는 기획자/대표 -- "DB에 저장해주세요" vs "어딘가에 저장해주세요"의 차이를 아는 것만으로 소통이 달라져요.
참고 링크
- Claude AI (무료 체험): claude.ai
- Anthropic 공식 사이트: anthropic.com
- 프롬프트 엔지니어링 가이드 (Anthropic): 프롬프트 엔지니어링 개요
- 바이브 코딩 스터디 1강: AI//STUDY — 바이브 코딩이 뭔가요?
▸개정 이력1건
- v12026-04-12초판
이 글이 도움이 되었나요?