컴포넌트 설계방법 정리

글의 목적

컴포넌트의 내부 코드 작성 순서와 컴포넌트를 어느 수준까지 추상화를 해야 하는 지 고민했던 사항을 작성한다. 컴포넌트를 개발할때도 인터페이스가 중요하다.

순서

• 컴포넌트 개발 순서
• 컴포넌트 내부 코드 정렬
• 컴포넌트 추상화 레벨링

컴포넌트 내부 코드 정렬

• Decorator
• Property
• Lifecycle
• method

컴포넌트 개발 순서

• 인터페이스 설계

<select-box
  disabled="false"
  placeholder="선택해주세요."
  options="['서비스 변경', '정책 고지', '시스템 장애', '프론트 장애']"
  @on-change="onChangeSelect($event)"
>
</select-box>

• 개발
• 테스트