useEffect - 컴포넌트가 화면에 첫 렌더링, 다시렌더링, 화면에서 사라질때 특정작업을 실행 시캘떄 사용됨. 기본구문 - useEffect는 괄호안에 두가지 인자를 가진다 첫번째 인자는 함수를 가지고 두번째 인자는 배열을가진다. import react, { useEffect } from "react" useEffect(()=>{작업내용} 인자로 콜백함수를 전달 받는다. 콜백함수:다른 함수의 인자로 전달된 함수 useEffect 형태1 - useEffect의 인자로 하나의 콜백함수만 전달받는 형태 useEffect(())=>{ 작업내용 }); useEffect 형태2 - useEffect의 첫번째인자로 콜백함수를 전달받고 두번째 인자로 배열을 전달받는경우 useEffect (())=>{ 작업내용 },..
useState - 컴포넌트가 가지는 상태 기본구문 const [state, setState] = useState(); state: 상태 값을 저장하는 변수 setState: 상태값을 갱신하는 함수 useState: 상태 초기의 값 useState("괄호안에 숫자나 문자로 초기값을 지정 할 수있다.") 예제1) const [time, setTime] = useState(8) useStatef로 time의 초기값을 3로 설정 setTime함수를 이용해 변수time의 값을 지정해 변경 timeUp 함수를 선언하고 버튼timeup에 onClick이벤트로 timeUp 함수지정 버튼을 누를때마다 time + 1 timeDown 함수를 선언하고 버튼timedown에 onClick이벤트로 timeDownn 함수지정 ..
리액트 찍어먹기 - 리액트는 현재 프론트엔트 기술중 가장 사용성이 높은 자바스크립트 프레임워크이다. 리액트 컴포넌트(Component) 앱을 이루는 최소한의 단위이다. 컴포넌트의 이름은 대문자로 시작한다 ex) , 컴포넌트는 재사용성이 높다. 컴포넌트의 종류 함수형 컴포넌트 정의하기 - 데이터는 가진 하나의 props 객체인자를 받은후 엘리먼트를 반환한다. function Welcome(props) { return Hello, {props.name}; } 클래스형 컴포넌트 정의하기 class Welcome extends React.Component { render() { return Hello, {this.props.name}; } } 컴포넌트 렌더링 function Welcome(props) { ret..
