23.10.08~23.10.15

업무

1. 온보딩 요소 제어 로직 작성

사용자가 입력한 온보딩 관련 데이터를 생성 및 제어하는 기능을 개발했다.

 

1) 특정 요소 생성 모듈 작성

처음에는 각 컴포넌트 요소(툴팁 등)들을 builder 패턴을 사용해 작성했었다.

왜? → 해당 요소를 생성하기 위한 단계가 나뉘어 있었기 때문에(루트 element 생성, 스타일 적용, 이벤트 적용 등),

각 단계를 사용처에서 호출해 객체를 생성할 수 있도록 의도했기 때문!

→ 코드의 직관성을 높이고, 전체 데이터 인터페이스에 의존하는 게 아니라 각 단계에서 필요한 값을 주입받길 원했다.

 

그런데 점차 개발을 하다보니, 각 요소를 생성하는 시점은 크게 단계가 나뉠 이유가 없어 보였다.

+ 어차피 모든 단계에서 해당 데이터 인터페이스 전체가 필요해, 오히려 특정 값만 받는 것이 유지보수에 불리하다 판단!

→ 전역적으로 사용되는 DTO 인터페이스를 입력받은 후, 생성된 객체를 반환할 수 있도록 수정했다.

 

2) Facade 패턴을 통한 요소 생성 모듈 제공

개발이 진행되면서 중요한 건 각 컴포넌트 요소들이 어떻게 생성되는지가 아니라(변경 여지 적음),

해당 요소들을 생성할 수단을 어떻게 제공하느냐 란 생각이 들었다.

 

각 컴포넌트 요소 타입을 통해 해당 컴포넌트를 얻어올 수 있어야 하는데...

호출하는 쪽에서 각 요소의 구체적인 구현을 알 필요는 없다고 생각!

Facade패턴을 통해 요소 타입 구분자를 입력받아, 해당 요소를 반환하는 모듈을 작성했다.

(nest js에서는 이를 service란 개념으로 제공 중이었어서, 해당 prefix를 따랐다)

export class ComponentElementService implements ElementService {
  tooltipBuilder: ElementBuilder;
  modalBuilder: ElementBuilder;

  constructor(tooltipBuilder: ElementBuilder, modalBuilder: ElementBuilder) {
    this.tooltipBuilder = tooltipBuilder;
    this.modalBuilder = modalBuilder;
  }

  /**
   *
   * @param type element 종류 구분자
   * @param component Component 인터페이스
   * @returns type에 해당하는 HTMLElement
   */
  getElement(type: string, component: UserComponentDto): HTMLElement {
    switch (type) {
      case 'tool-tip':
        return this.tooltipBuilder.get(component);

      case 'modal':
        return this.modalBuilder.get(component);

      default:
        throw new Error('올바르지 않은 컴포넌트 타입');
    }
  }
}

이때 주입받는 builder와는 interface 통한 느슨한 결합이 이뤄질 수 있도록 작성했다.

 

3) action 제어 로직 및 모듈 작성

대망의...

모달 등에서 선택 액션을 통해 각기 다른 분기가 이뤄져야 하는 요구사항이 추가되었다.

기존 방식에서는 단순히 요소 배열을 통해 순서를 찾아갔는데... 이 방법이 불가능 한 상황.

 

끙끙거리며 DB 설계를 한 결과, 컴포넌트 별 action이라는 table을 만들어

각 컴포넌트들이 자신의 다음 컴포넌트가 누구인지 를 알 수 있도록 수정했다.

간만에 본 트리

각 컴포넌트 요소들을 tree의 node 개념으로 변경!

이전 action 제어는 사용자가 발생한 step의 변화에 따라 진행되었는데,

이를 각 node의 자식 node를 찾아가는 로직으로 변경하였다.

 

회고

개발하는 게 참 재미있다.

딱히 재미가 없거나 슬럼프가 찾아온 순간은 (아직은) 없었는데...

요즘은 특히 재미있다는 생각을 한다.

 

특히 퇴근 후 집에서 개인 프로젝트를 하고 있으면...

시간 가는 줄 모르고 빠져들 게 된다.

 

새로운 개념들과 지식들을 실제로 적용해 보려 많이 노력하는데

이 덕분에 매일 두근거리는 발견을 하는 듯한 기분.

 

당장 눈 앞에 겪은 문제가 해결됨과 동시에

'아..! 그 때 이랬으면 좋았을 텐데!' 하는 기분 좋은 아쉬움을 느끼고 있다.

 

결국 개발자는, 나아가지 않으면 안되나 보다.