JudithHopps JudithHopps

useState 함수형 컴포넌트 const [value, setValue] = useState(''); const [name,setName] = useState(''); return ( setValue(value+1) } {value} setName(e.target.value)) /> {name} ) useEffect 렌더링 될때마다 특정 작업 수행 useEffect(()=> { console.log() }, [] : 마운트 [name] : 특정 값 업데이트 } useReducer useState보다 더 다양한 컴포넌트 상황에 따라 다른 값으로 업데이트 function reducer(state,action) { return { ...state, [action.name] : action.value } } ..

컴포넌트 리액트로 만들어진 앱을 이루는 최소한의 단위 컴포넌트를 통해 UI를 재사용 가능한 개별적인 여러 조각으로 나누고, 각 조각을 개별적으로 살펴볼 수 있습니다. 예시 ) App.js import TodoTemplate from "./TodoTemplate"; 클래스형 컴포넌트 class Welcome extends React.Component { render() { return Hello, {this.props.name}; } } 함수형 컴포넌트 const Welcome = ({props}) => { return Hello, {props.name}; }) 클래스형 컴포넌트와 함수형 컴포넌트 차이 클래스형 컴포넌트 함수형 컴포넌트 render 함수 필요하고 JSX 반환 return문으로 실행 후 사라..