Tagged template literals component
* 관련 기술 스택이 없습니다
• Tagged template literals를 사용하여 컴포넌트를 만드는 방법을 소개하였다. 이를 통해 styled-component와 같이 템플릿 리터럴 내부에 변수로 컴포넌트를 넣어 사용할 수 있다.
• 상태값을 생성하거나 전역 상태로 사용할 수 있도록 singleton 패턴을 적용하였으며, 의존성을 가진 컴포넌트를 setDependents 함수를 통해 받아와 값이 변할 때마다 render되도록 구현하였다.
• 페이지 컴포넌트 사용법은 각 컴포넌트를 불러와서 해당 위치에 넣어주는 것이며, 컴포넌트에 컴포넌트를 중첩하거나 원하는 문자를 넣어줄 수 있다. 상태값은 PageData에서 관리하며, 상태값이 바뀔 때 render될 수 있는 컴포넌트들을 넣어준다.
• 개선할 점으로는 컴포넌트 별로 스타일 추가, 차후에 shadowDOM과 함께 적용, 보일러 플레이트 줄이는 방향으로 개선 필요, 컴포넌트, 비즈니스 로직, 상태값 상호 의존 해결 등이 있다.
북마크
공유하기
신고하기