TOOLS · BACKEND & DEPLOY

저장, 로그인, 배포.
AI에게 정확한 말로 부탁하세요

화면 다음에 막히는 곳은 눈에 보이지 않는 부분이에요. 웹앱 지도에서 어디에 무엇이 있는지 보고, 직접 눌러 보고, 담은 용어로 요청문을 만드세요.

/ 용어 검색+ 담기 → 아래 요청문 조립대

웹앱 지도

상자를 누르면 그 자리에 사는 용어만 모아 보여 드려요.

직접 눌러 보기 7

백엔드는 눈에 안 보여서 어렵게 느껴져요. 흐름과 결과를 직접 움직여 보면 용어가 손에 잡혀요.

요청과 응답이 오가는 길

API · 요청과 응답 · JSON

브라우저가 주문서(요청)를 보내면 서버가 JSON으로 답해요.

브라우저버튼을 눌러 요청을 보내 보세요

서버대기 중

요청 출발
서버가 처리
응답 도착

// 응답이 여기에 보여요

메서드로 표 다루기

HTTP 메서드 · CRUD · 테이블 · 기본키 · 쿼리

메서드를 골라 요청하면 같은 일을 하는 SQL 쿼리와 결과가 함께 보여요.

id (기본키)	title	done	user_id

상태 코드별로 사용자가 보는 화면

상태 코드

출입증과 열쇠

인증 · 인가 · 역할

인증은 "누구인가", 인가는 "이 방에 들어가도 되는가"예요.

RLS 스위치

RLS · 행과 열

같은 posts 테이블을 누가 보느냐, RLS가 켜졌느냐에 따라 보이는 행이 달라져요.

RLS 켜기

id	user_id	content

비밀 키는 어디에 둘까

공개 키와 비밀 키 · 환경변수 · API 키

결제 비밀 키를 어디에 두느냐에 따라 사용자 브라우저에서 보이는지가 갈려요.

사용자 브라우저 · 페이지 소스 보기

내 컴퓨터에선 되는데 배포하면 안 될 때

환경변수 · 로컬·운영 환경 · 빌드 · 배포

배포 서비스에도 환경변수를 등록하고, 등록한 뒤에는 다시 배포해야 반영돼요.

환경변수	.env.local	배포 설정

빌드배포완료

localhost:3000

my-app.vercel.app

용어 60

카드마다 비유와 AI에게 할 말이 있어요. + 담기를 누르면 아래 요청문 조립대에 들어가요.

/

요청문 조립

[기능] + [데이터] + [권한] + [연동] + [환경·배포]. 담은 용어가 알맞은 칸에 들어가고, 칸마다 내 말을 덧붙일 수 있어요.

만들 기능

이렇게 바꿔 말하기

뭉뚱그린 부탁을 저장 위치, 권한, 조건이 들어간 말로 바꿔요.

실전 사전

요청문에 넣을 때 자주 찾게 되는 값들이에요.

AHTTP 메서드 5

메서드	하는 일	예시
GET	조회	`GET /api/posts`
POST	생성	`POST /api/posts`
PUT	전체 교체	`PUT /api/posts/3`
PATCH	일부 수정	`PATCH /api/posts/3`
DELETE	삭제	`DELETE /api/posts/3`

B상태 코드 8

코드	뜻	언제 쓰나

C데이터 타입 7

타입	이럴 때	예시 열
text	글자	`title`, `memo`
int	정수	`rating`, `stock`
numeric	정확한 소수(돈)	`price`
boolean	예/아니오	`done`, `is_public`
timestamp	날짜와 시각	`created_at`
uuid	겹치지 않는 고유 번호	`id`, `user_id`
json	모양이 자유로운 묶음	`settings`

D환경변수 이름 규칙

프레임워크	브라우저에 노출되는 접두사
Next.js	`NEXT_PUBLIC_`
Vite	`VITE_`

이 접두사가 붙은 값은 누구나 볼 수 있어요. 비밀 키에는 절대 붙이지 마세요. 접두사가 없는 값은 서버 코드에서만 읽혀요.

E테이블 설계 예시 3

할 일 앱 todos: id uuid PK · user_id uuid → users · title text · done boolean · created_at timestamp

블로그 posts: id · user_id → users · title · content · is_public boolean comments: id · post_id → posts · user_id → users · body · created_at

예약 앱 slots: id · starts_at timestamp · capacity int bookings: id · slot_id → slots · user_id → users · status text(pending/confirmed/cancelled)

F배포 전 보안 점검 6

요청 전 체크리스트

기능을 요청하기 전에 이것만 정해 두면 AI가 되묻거나 엉뚱하게 만드는 일이 줄어요.

AI에게 정확히 말하는 법 시리즈 · 3편. 1편은 바이브 코딩 UI 필수 용어 75, 에러가 나면 2편 에러 → 디버깅 프롬프트를 쓰세요.

담은 용어 0 요청문 보기

저장, 로그인, 배포.AI에게 정확한 말로 부탁하세요