빌드 환경값
VITE_API_URL
client bundle의 string
ImportMetaEnv로 키를 선언하고 API 기준 주소를 만든다.
환경값·API·상태 소유자를 한 방향으로 연결한다
화면이 직접 환경값과 fetch를 흩어 쓰지 않도록, 외부 경계에서 검증한 값을 각 상태 소유자에게 전달한다.
API 런타임 경계
response: unknown
schema.parse → UserDto
검증 후 타입 부여
서버 응답은 TypeScript 선언만 믿지 않고 한곳에서 확인한다.
상태 소유자 분리
server/form · URL/UI
한 값은 한 원본
같은 응답을 여러 local state에 복사해 동기화하지 않는다.
Route 화면 상태
loading | empty
error | success
복구 가능한 UI
페이지가 데이터 상태별 화면과 다음 행동을 선택한다.
원격 데이터
캐시·재요청·동기화 정책
제출 전 draft
입력값과 검증 오류
공유 가능한 상태
route param·검색 조건
일시적 상호작용
modal·선택·hover
보안·타입 경계
VITE_* 값은 클라이언트 번들에 포함되므로 비밀을 넣지 않는다. API 타입도 런타임 검증을 대신하지 않는다.