[2024.06.19] 상세페이지 모달 UI구성 + 공통 컴포넌트에 대한 고민

와이어 프레임

 

공통 컴포넌트 BigModal, Modal 제작

공통 컴포넌트를 만드는 도중 크기와 용도가 다른 모달을 하나로 합쳐야 하나 아니면 분리를 해야 하나 고민이 많았다. 괜히 하나의 주제로 여러 개를 만들면 괜한 리소스가 낭비되는 게 아닌가 싶었기 때문인데, 많은 구글링 끝에 이 글을 보고 분리하기로 결정했다.

더 가치 있는 공통 컴포넌트 만들기: KAKAO 기술 블로그
URL: https://fe-developers.kakaoent.com/2024/240116-common-component/

!!!

'공통'이라는 말의 선입견 때문에 반드시 하나를 재사용성 높게 구현해야 한다고 생각했는데, 오히려 그 생각이 독이 된 케이스였다. 해당 공통 컴포넌트에서 지향하는 방향과 확장성에 대해 더 고민해 볼 수 있던 기회였고, 결과적으로 backdrop을 눌러서 닫는 큰 크기의 BigModal과 확인/취소 버튼으로 닫는 일반적인 Modal로 구성하였다.

 

프로젝트에서 공통 컴포넌트에 얼마만한 확장성과 자유도를 부여해야 할지 아직 명확하게 이해가 된 건 아니지만, 차츰 다른 문서도 보고 영상도 보면서 점점 더 보완해 나가야겠다~