React-Native [5. React의 필수 개념 : 컴포넌트, 속성, 상태, useEffect]

컴포넌트(Component)

화면의 조각조각. 작은 컴포넌트들이 하나의 큰 컴포넌트를 구성한다.

속성(Props)

컴포넌트에 데이터를 전달하는 기능!

규칙

1. Key & Value (content={content}) 형태로 전달
2. 컴포넌트 반복문 실행시, map에서 나오는 인덱스(i)를 key = {i} 속성 전달 형태로 꼭 넣을것!

{tip.map((content, i) => {
          return <Card content={content} key={i}/>;
})}

상태(State, useState)

컴포넌트에서 보유/관리되는 데이터!

UI = component(state)

UI는 컴포넌트의 상태에 따라 다르게 표현된다.
따라서 리액트는 state가 변경되면 해당 UI가 바뀐다.

useEffect

화면이 그려진 다음 가장 먼저 실행되는 함수!

useEffect(()=>{

	화면이 그려진 다음 가장 먼저 실행되야 할 코드

},[])

화면이 그려진다 -> useEffect가 데이터를 준비한다 -> 상태 데이터가 업데이트 되었으니 화면이 다시 그려진다