Conditional Rendering

조건을 JSX에 놓는 위치로 패턴을 고릅니다

조건이 복잡하면 return 밖에서 분기하고, 화면 일부만 바꾸면 JSX 안에서 짧게 표현합니다.

if

완전히 다른 화면

조건식이 길 때

변수에 JSX 저장

? :

둘 중 하나 선택

참과 거짓 모두 필요

짧은 JSX에 적합

&&

참일 때만 표시

배너, 버튼, 알림

거짓이면 숨김

null

컴포넌트 출력 차단

자체 렌더링 중단

부모 구조는 유지