TIL/WID: What I Did

2월 22일, 23일 WID : 1px 잡기, 문서작업

반응형

느낀 점

  • 일에 집중하고 일에 리듬을 타는 법이 다시 돌아온 것 같다. 자신감도 붙고, 집중도가 높아지니까 일이 재밌어지기 시작했다.
  • 코딩에 재미가 붙기 시작한 타이밍에 매뉴얼을 작성하는게 너무 싫었는데 문서작업을 하면서 코드를 파악할 수 있었다.
  • 계획보다 빨리 문서작업 후루룩 해버리고 얼른 하려던 거 하러 가야지~ 라고 생각했다. 이렇게 생각하니까 문서작업도 더 할 맛이 난다.

1px 잡기

  • 탭 메뉴를 선택할 때마다 탭 목록 하단 border가 1px 두꺼워졌다가 메뉴에서 포커스아웃하면 다시 1px 얇아지는 현상이 있었다. 사실 기능상으로나 레이아웃상으로 크게 문제가 될 부분은 아니었지만 최근 업무 집중도가 높아지면서 기획할 때의 '검수 모드'가 장착되니까 너무 거슬려서 잡아내기로 마음을 먹었다.
  • TabPanel 컴포넌트를 사용했기 때문에 이 border는 탭 리스트 랩퍼의 하단 또는 패널의 상단 중 하나가 영향을 미치는 것일 거고, '탭 메뉴를 선택할 때' 달라지니까 탭 메뉴에 focused된 상태와 연관이 있을 것으로 예상하였다.
  • 어느 부분에서 문제가 발생하는지 찾아내는데 시간이 오래 걸렸는데, 이것은 포커스를 했을 때 실제로 border값이 변화하는 .dx-multiview-wrapper 클래스를 가진 div가 개발자 도구 상에서 리렌더링되지 않았기(반짝이지 않았음) 때문이다. 리렌더링 되는 엘리먼트 위주로 추적하다 보니 변경사항에 해당하는 것이 없었고, 결국 모든 DOM 엘리먼트를 하나씩 선택해보며 추적하게 되었다.
  • 해당하는 클래스에 border-top: none; 옵션을 주니까 깔끔~ 개운~

문서작업

  • 코딩에 재미를 좀 붙이고 있는데 하필이면 매뉴얼 업데이트 작업이 주어졌다. 그래도 달리 할 사람이 없기도 하고... 내가 아무래도 다른 개발자들보다는 문서작업에 익숙할테니까. 처음에는 너무너무 하기 싫었는데 하다 보니까 내 영역이 아니었던 제품에 대해 공부하게 되고 이해도가 높아지게 되는 느낌이 들었다. 언젠가 동료의 빈 자리가 생겼을 때, 급하게 지원이 필요할 때 더 빠르게 그 자리를 메꿀 수 있는 사람이 될 수 있겠다.
728x90
반응형