오픈빌더 응답형식 리펙토링 - ChoDragon9/posts GitHub Wiki

리펙토링 목적

응답형식에서는 출력플랫폼에 따라 카카오톡과 카카오미니가 있고, 카카오톡은 응답하는 방법에 따라 이미지, 텍스트, 리스트, 커머스, 카드, 뮤직이 있다. 이러한 역할 많은 역할을 응답형식 컴포넌트에서 많이 담당을 하고 있었다.

한 컴포넌트에서 많은 역할을 담당하게 되면 코드의 볼륨은 커지고 많은 정보를 알고 있어야 한다. 역할과 책임을 분리하여 이해하기 쉬운 코드와 수정이 용이하게 하기위해 리펙토링을 진행했다.

컴포넌트 리펙토링

응답형식 컴포넌트의 개선 포인트는 4가지가 있다.

첫번째는 응답형식의 모델을 응답형식 컴포넌트에서 모두 구체적으로 기술이 되었다. 구체적으로 기술하기에는 역할이 많아짐으로 카카오미니와 카카오톡 컴포넌트 두개로 분리했다.

두번째는 응답형식은 최대 3개의 그룹으로 관리되는 데, 그룹 내부의 정보를 모두 기술하는 책임을 가지면 역할이 많아짐으로 카카오톡 컴포넌트에서 응답그룹을 컴포넌트화했다.

세번째는 응답그룹을 담당하는 컴포넌트에서 이미지, 텍스트, 리스트, 커머스, 카드, 뮤직과 같은 응답카드에 대한 역할을 담당할 필요 없으므로 응답카드를 담당하는 컴포넌트로 분리했다.

마지막으로 컴포넌트 네이밍을 수정했다. 컴포넌트 네이밍 컨벤션이 위배되는 부분과 의미를 명확히 알 수 없는 컴포넌트의 네이밍을 변경했다.

AS IS

ResponseComponent-AS IS

TO BE

ResponseComponent-TO BE

폴더 리펙토링

컴포넌트 리펙토링을 하게 되면 역할과 책임이 분리된다. 폴더 구조도 컴포넌트와 동일한 구조를 가질 수 있도록 수정했다.

폴더-리펙토링

참고자료