react ( Udemy강의 ) - 6. Building Custom Hooks & Form

Custom Hooks

     - 정규함수에서는 Hooks 사용x -> 사용자 정의  훅 사용

     - hooks - use-counter.js

     - use로 시작할 것

EX01)

import { useState, useEffect } from "react";

const useCounter = (forwards = true) => {
  const [counter, setCounter] = useState(0);

  useEffect(() => {
    const interval = setInterval(() => {
      if (forwards) {
        setCounter((prevCounter) => prevCounter + 1);
      } else {
        setCounter((prevCounter) => prevCounter - 1);
      }
    }, 1000);

    return () => clearInterval(interval);
  }, [forwards]);

  return counter;
};

export default useCounter;

const counter = useCounter();
// or
const counter = useCounter(false);

---

Formik 

- 써드 파티 라이브러리

- 폼 랜더링 및 상태를 관리하는 로직을 덜 만들어도 괜찮다.