플래그 값 이란? - 프로그래밍에서 주로 특정 조건 혹은 제어를 위한 조건을 불리언으로 나타내는 값 을 의미 합니다.

react 에서 로그인 관리를 할때 보통 클라이언트 상태로 관리하는 경우가 있을겁니다.

function Login() {
	const [isLogin, setIsLogin] = useState(false);

	useEffect(() => {
		if(hasToken) {
			setIsLogin(true);
		}
		
		if(hasCookie) {
			setIsLogin(true);
		}

	},[hasToken, hasCookie]);

	return <div>{isLogin && "로그인 되었습니다!"}</div>;
}

위와 같은 코드 형태로 로그인을 체크할수 있습니다.

하지만 react를 사용하면서 불필요한 상태는 최대한 줄이는게 좋습니다.

상태가 많아지면 관리도 어려워지고 코드가 복잡해지게 됩니다.

따라서 위와같은 로그인 체크를 상태가 아닌 단순 상수값으로 빼서 사용할수도 있을거 같습니다.

function Login() {
	const isLogin = hasToken && hasCookie;

	return <div>{isLogin && "로그인 되었습니다!"}</div>;
}

위 코드처럼 “isLogin” 이라는 상수를 만들어서 로그인 유무를 체크할수 있습니다.

상태도 사용 안할수 있으며, 추가 요구조건이 들어온다해도 사용가능하게 됩니다.

요약 : useState 대신에 컴포넌트 내부에서 플래그 상수로 상태를 정의할수 있다.