JavaScript

Class

객체를 생성하여 그 안에 생성과 소멸시점까지 정의한다.

• static으로 선언된 구문은 외부에서 접근이 가능하다.
• mount DOM에 올릴 때 사용한다.

---

Web Component

HTML 요소를 사용자가 정의하여 사용할 수 있다.

customElements.define(custom요소이름, class이름)

👉 custom요소이름은 Kebab Case로 한다.

• HTMLElement를 extends하여 class를 정의한다.
  👉 constructor에 super()를 실행하여 부모의 constructor를 1회 호출한다.
  👉 constructor에 innerHTML로 표준 HTML 요소를 삽입한다.

---

React

Component

마크업 코드를 return한다.

선언된 Component 내부에 다른 Component가 선언되면 안 된다.
👉 Component를 파일별로 구분하여 최상위 수준에 작성한다.

export | import

• 이름으로 내보내기

export 함수

👉 불러오기

import { 이름 } from '경로'

• 기본 내보내기

export default 함수

👉 불러오기

import 이름 from '경로'

• 일반적으로 내보낼 Component가 하나인 경우에 기본 내보내기를 사용한다.
• 이름으로 내보내기와 기본 내보내기는 { } 사용 여부의 차이가 있다.