교차 출처 리소스 공유
브라우저가 한 출처의 웹 페이지에서 다른 출처의 API를 호출할 때 적용하는 보안 규칙이다. 프론트엔드와 백엔드 도메인이 다르면 서버가 어떤 출처를 허용하는지 응답 헤더로 알려줘야 한다. 바이브 코딩 초보자가 '브라우저에서는 막히는데 터미널 curl은 된다'는 상황을 만날 때 CORS가 원인인 경우가 많다.
예시
localhost:3000 프론트엔드가 api.example.com을 호출하려면 API 서버가 해당 출처를 허용하는 CORS 헤더를 내려줘야 한다.
카테고리
보안·인증
난이도
basic
태그
CORS · 브라우저보안
함께 읽기
연관 용어
보안·인증
쿠키
웹사이트가 브라우저에 저장해 두는 작은 데이터 조각이다. 로그인 상태 유지, 장바구니, 언어 설정처럼 다음 방문에도 기억해야 하는 정보를 담을 때 쓰인다. 편리하지만 인증 쿠키를 잘못 다루면 계정 탈취 위험이 생기므로 httpOnly, secure, sameSite 같은 보안 옵션을 함께 이해해야 한다.
보안·인증
세션
사용자가 사이트에 접속해 있는 동안 서버가 유지하는 상태 정보이다. 보통 브라우저에는 세션 ID만 쿠키로 저장하고, 실제 로그인 사용자 정보와 권한은 서버나 데이터베이스에 둔다. 바이브 코딩에서 로그인 기능을 만들 때 세션과 쿠키의 차이를 이해하면 민감한 사용자 정보를 브라우저에 과도하게 저장하는 실수를 줄일 수 있다.
백엔드·인프라
API
소프트웨어 애플리케이션 간 상호작용 방식을 정의하는 프로토콜과 규약의 집합으로, AI 코딩 도구 통합과 현대 소프트웨어 아키텍처의 핵심이다. 비유하면, 레스토랑의 메뉴가 손님(클라이언트)과 주방(서버) 사이의 '인터페이스'인 것처럼, API는 소프트웨어 간의 '메뉴'이다. 바이브 코딩에서 API는 두 가지 맥락으로 사용된다: 첫째, AI 모델 API — Claude API, OpenAI API 등 AI 모델을 호출하는 인터페이스로, 모든 AI 코딩 도구의 내부에서 이 API를 통해 모델과 통신한다. 둘째, 앱 API — AI가 생성하는 백엔드 코드의 핵심으로, REST API, GraphQL API 등의 형태로 프론트엔드와 백엔드를 연결한다. AI에게 '사용자 CRUD API를 REST로 만들어줘'라고 하면 Express.js, FastAPI, Next.js API Routes 등을 사용한 엔드포인트 세트를 생성한다. MCP도 본질적으로 'AI 에이전트가 외부 도구를 호출하는 API의 표준화'이다.