React | Component

컴포넌트란?

긴 html을 한 단어로 깔끔하게 치환해서 넣을 수 있는 문법

1. function 함수를 만든다
2. return () 안에 원하는 html을 담는다

function Modal() {
  return (
    <div className='modal'>
          <h4>제목</h4>
          <p>날짜</p>
          <p>상세내용</p>
      </div>
  )
}

특징

1. 첫 글자는 영어 대문자로 작명
2. return() 안에 html 태그가 평행하게 여러개 들어갈 수 없음
3. function App() {} 안에 만들면 안 됨 (컴포넌트 안에 컴포넌트 안 됨)

• 반복해서 출현하는 html 덩어리
  
• 내용이 자주 변경될 것 같은 html 부분
  
• 다른페이지를 만들고 싶을 때
  
• 다른 팀원과 협업 시, 작업을 분배할 때

컴포넌트화 할 수 있다