Component란?
전체의 부분.
하나의 덩어리라면?
- 높은 의존성을 가진다
- 재사용성이 낮다
- 규모가 큰 설계에 적용하기 어렵다.
프론트엔드에서 컴포넌트란?
Ajax 이후로 사용자와 인터렉션 증가 -> 웹의 복잡도 증가 -> 복잡한 웹을 작게 나누기시작함. -> 웹을 효율적으로 설계할 수 있게 됨.
컴포넌트란?
엘리먼트 그룹을 반환하는 자바스크립트 함수
컴포넌트의 분리.
Atomic Design 이란?
원자 : 유저 인터페이스를 구성하는 최소 단위의 블록. (ex. 버튼, 인풋, 폼같은 HTML태그들)
분자 : 원자가 모여 기능을 구현
유기체 : 원자, 분자, 유기체들의 조합(헤더영역) 하나 이상의 책임을 가짐.
템플릿 : 컴포넌트들을 배치하는 레이아웃.
단점 : 분리하는 기준이 모호. 원자 하나가 끼치는 사이드 이펙트가 커짐.
계층이 5단계이기 때문에 시간소요가 큼. 또 탬플릿 같은 경우 재사용성도 떨어짐.
디자인 시스템? MS?
컴포넌트와 스타일을 관리하는 시스템.