useEffect

useEffct는 실행되며 렌더링해주는 함수이고 이벤트 핸들러라고도 한다.

여기 보는것처럼 이렇게

useEffct(()=> {} ,[]);

뒤에 의존성 배열이 있는데 의존성 배열없이도 사용한다고한다.
여기서 + - 카운터 예제를 적어보면

const App = () => {
	const [count,setCount] = useState(0);
    useEffect(() => {}, []);
    return (
     <div className="bg-purple-400 text-center">
      <button> onClick={() => SetCount(count-1) }> - </button>
      <span className="mx-4">{count}</span>
      <button> onClick={() => SetCount(count+1) }> + </button>
     </div>
    );
   };
 export default App;

잘안보일수도 있겠지만 ..
useEffect를 사용하기전에 useState를 사용해
count 값과 setCount 함수를 초기값 0 으로 해주고
버튼 onClick 이벤트에서 setCount 함수에 초기값 0인 count를 각 -1과 +1을 넣어줬다

그결과 - 와 +를 눌러주면 각각 숫자가 바뀌며 잘 동작된다
데브툴즈를 확인하면 + 와 -를 눌러주면 계속 해서 랜더링되는데
랜더링은 말그대로 화면에 뿌려주는것이라고한다.
유즈이펙트 뒤에 [ ] 안에 count 값을 넣어주면 로그에 찍히진 않지만 계속해서 렌더링은
계속 된다고한다 .
말그대로 useEffect 란 hook 은 렌더링되는 이벤트 핸들러이다.