상태 나열
화면이 가질 수 있는 상태를 boolean 하나로 뭉개지 않고 이름 붙인다.
우선순위
권한 없음, 로딩, 오류, 빈 값, 성공 중 먼저 보여야 할 분기를 정한다.
JSX 배치
삼항식, early return, 작은 컴포넌트 분리 중 가독성이 높은 방식을 고른다.
전환 확인
상태가 바뀔 때 이전 화면 조각이 남거나 깜박이지 않는지 본다.
loading
결과 미확정
skeleton, spinner, disabled action으로 표현
빈 값과 구분
empty
성공했지만 데이터 없음
다음 행동이나 검색 조건 변경 안내
오류가 아님
error
회복 가능한 실패
재시도, 로그인 이동, 입력 수정 안내
개발자 stack 노출 금지
ready
정상 화면
데이터와 상호작용이 준비된 상태
필수 값 존재 보장