리액트 훅 , 생명주기

import { useState } from "react";


function App() {

  const [count, setCount] = useState(0);

  return (
    <div>
      <button onClick={()=>setCount(count+1)}>증가</button>
      <h1>{count}</h1>
      <button onClick={()=>setCount(count-1)}>감소</button>
    </div>
  );
}

export default App;

 

 

간단한 프로그램이다.

증가를 누르면 가운데 숫자가 1씩 증가하고, 감소를 누르면 1씩 감소한다.

 

2019년 2월 이전에는 Hook이 없었다.

Class 방식에서는 생명주기가 따로 있었고 클래스형에서는 setState 방식으로 사용했다.

 

클래스방식 함수에 대응되는 use... 함수들이 존재하므로 염두해두고 공부하고자 기록해논다.