[code-review] 1


1)条件文は可能な限りpostive
// 🌱 기존 내 코드

useEffect(() => {
    if (isLiveStreamActive == false) {
      // 영상 송출 중이 아닐 때
    }
    else {
      // 영상 송출 중일 때
    }
});



// 💡 코드 리뷰 후

useEffect(() => {
    if(isLiveStreamActive) {
       // 영상 송출 중일 때
    }
    else {
       // 영상 송출 중이 아닐 때 
    }
}
2)不要な状態を作成しない
// 🌱 기존 내 코드

const [isAlertText, setIsAlertText] = useState(false); 
// 경고문구의 상태를 보여주는 state 생성 --- ❗️ 불필요

useEffect(() => {
    if (isLiveStreamActive) {
      setIsAlertText(false);  // 영상 송출 중이면 경고문구 false(off)
    } else {
      setIsAlertText(true);  // 영상 송출 중이 아니면 경고문구 true(on)
    }
  }, [isLiveStreamActive]);

{isRehearsal && (
  <>
    {isAlertText 
      ? ( <WarningText>
             <p>{t('서버에서 받아온 다국어 처리')}</p>
          </WarningText> ) 
      : null}
   </>
)};
// 리허설 모드(true)에서, isAlertText가 true면(영상 송출중이 아니라는 뜻) 경고문구 보여주고 
// 아니면 null

{!isRehearsal && (
  <>
    {isAlertText 
      ? ( <WarningText>
             <p>{t('서버에서 받아온 다국어 처리')}</p>
          </WarningText> ) 
    : null}
  </>
)};
// 방송 모드(false)에서, isAlertText가 true면(영상 송출중이 아니라는 뜻) 경고문구 보여주고 
// 아니면 null



// 💡 코드 리뷰 후

{isRehearsal && (
  <>
    {!isLiveStreamActive && ( 
	  <WarningText>
             <p> {t('서버에서 받아온 다국어 처리')} </p>
          </WarningText> )}
   </>
)};
// 리허설 모드(true)에서 영상 송출중이 아니면(!isLiveStreamActive) && 뒤를 실행

{!isRehearsal && (
  <>
    {!isLiveStreamActive && ( 
	  <WarningText>
             <p> {t('서버에서 받아온 다국어 처리')} </p>
          </WarningText> )}
   </>
)};
// 방송 모드(false)에서 영상 송출중이 아니면(!isLiveStreamActive) && 뒤를 실행

// isLiveStreamActive(=boolean) 이 존재하므로 굳이 isAlertText를 만들 필요가 없다
// 즉, isLiveStreamActive 값으로 대신 사용할 수 있다
📌 3つの演算子を使用する場合、true(?)ファセット、または(:)nullを実行します.
nullを書く必要はありません.したがって、조건 && 실행코드に簡単に作成することができる.
// 예시
{ thisIsTrue ? <p>true</p> : null }
{ thisIsTrue && <p>true</p> }
📌 不要な状態を作成する必要はありません(注意!)
const [isAlertText, setIsAlertText] = useState(false); 
// isAlertText의 상태를 만들어 준 뒤

useEffect(() => {
    if (isLiveStreamActive) {
      setIsAlertText(false);  // 영상 송출 중이면 경고문구 false(off)
    } else {
      setIsAlertText(true);  // 영상 송출 중이 아니면 경고문구 true(on)
    }
  }, [isLiveStreamActive]);
// isLiveStreamActive 와 true/false가 정반대로 되게 설정하여

{isAlertText ? <WarningText /> : null}
// boolean값에 따라 삼항연산자

>> 차라리 처음부터 isLiveStreamActive의 boolean 값으로 적용하면 간단 
from mentor Joseph🧐