Ch.9 바이브코더 용어집 — 웹 · 아키텍처 · 보안

웹은 식당과 같습니다. 손님이 주문하고, 주방이 요리합니다

AI 개발자에게 웹 지식이 왜 필요할까요? ChatGPT도, Claude도, 결국 웹을 통해 사용자와 만납니다. 여러분이 만든 AI 모델이 아무리 뛰어나도, 웹으로 전달하지 못하면 아무도 쓸 수 없습니다. 이번 섹션에서는 '주소창에 URL을 입력하고 엔터를 누르면 1초 안에 벌어지는 일'을 하나씩 풀어봅니다.

브라우저(손님)가 서버(주방)에 요청(주문)을 보내면, 서버가 응답(요리)을 돌려줍니다. 이 단순한 주고받기가 웹의 전부입니다.

API는 식당의 메뉴판입니다. 뭘 줄 수 있는지 알려줍니다

사실 여러분은 이미 API를 쓰고 있습니다. ChatGPT에 질문하면? OpenAI API를 호출한 것입니다. 날씨를 검색하면? 기상청 API입니다. AI 시대에 API를 모르면 아무것도 만들 수 없습니다. 이 섹션에서 배우는 REST API, JSON, Status Code는 Ch10에서 직접 LLM API를 호출할 때 그대로 쓰입니다.

API(Application Programming Interface) — 프로그램이 다른 프로그램에게 '이런 기능을 쓸 수 있어'라고 알려주는 규격입니다. 식당 메뉴판이 손님에게 '이런 음식 주문 가능합니다'라고 알려주듯이요.

식당의 홀과 주방처럼 웹도 앞과 뒤가 나뉩니다

지금 여러분이 보고 있는 이 학습 앱도 프론트엔드와 백엔드로 나뉘어 있습니다. 화면에 보이는 카드, 버튼, 애니메이션이 프론트엔드이고, 학습 진도를 저장하고 퀴즈 정답을 확인하는 로직이 백엔드입니다. AI 모델도 마찬가지입니다. ChatGPT의 대화창(프론트)과 GPT-4 엔진(백엔드)은 완전히 다른 세계입니다. 바이브코더로서 이 구분을 아는 것이 중요합니다.

사용자가 보고 클릭하는 부분이 프론트엔드, 데이터를 처리하고 저장하는 부분이 백엔드입니다. 둘 다 할 수 있으면 풀스택이라고 합니다.

데이터베이스는 디지털 세계의 창고입니다

AI는 데이터 없이는 아무것도 할 수 없습니다. Ch1에서 배웠듯이, LLM은 수조 개의 텍스트 데이터로 훈련되었습니다. 이 데이터를 어디에 저장하고, 어떻게 빠르게 꺼낼까요? 바이브코더가 앱을 만들면 사용자 정보, 대화 기록, 학습 진도 등을 반드시 저장해야 합니다. 데이터베이스는 프로그래밍의 필수 인프라입니다.

엑셀 시트를 떠올려보세요. 행과 열로 데이터를 정리하죠? 데이터베이스는 그것의 초대형·초고속 버전입니다.

보안은 공항 게이트와 같습니다. 여권 확인 → 탑승권 확인

바이브코더에게 보안 지식이 특히 중요한 이유가 있습니다. AI에게 코드를 작성하게 하면, AI는 '동작하는 코드'를 만들지만 보안 취약점까지 알아서 막아주지는 않습니다. API 키를 코드에 직접 넣어 GitHub에 올리면? 몇 분 만에 해커의 봇이 그 키를 탐지합니다. 이 섹션의 용어들은 '내 앱을 지키는 최소한의 방패'입니다.

공항에서 여권으로 신원을 확인하고(Authentication), 탑승권으로 좌석 권한을 확인합니다(Authorization). 웹 보안도 정확히 이 구조입니다.