오늘 한 일

  • 본격적으로 다시 패스워드 리셋 페이지(라고 쓰고 모달을 띄운다) 작업에 착수했다. 사실 모달 자체는 다 만들어 놨었는데 이걸 띄우고 닫는 컨트롤을 스토어에서 관리했으면 하는 데서부터 Vue 3, Vuex, Pinia 공부가 시작되었던 것이었다... 대하소설급
  • 하는 김에 아주 큰 기능을 건드린 건 아니었지만 그러니까 리팩토링이지! 내가 보기 편한 형태로 리팩토링을 좀 하고, 다시 보면서 과거의 내가 왜 이런 식으로 코드를 넣었을까 싶은 부분은 다듬었다.
  • 피그마에 따르면 현재 모달은 로그인 페이지에서만 띄운다. 물론, 이것도 아직 SSO 기준으로 그루핑된 내용은 아니고 그냥 내가 디자인 정해진 게 없어서 다른 피그마 페이지에서 이거겠거니 하고 가져다 쓰는 거긴 한데, 아무튼 지금은 그렇다. 하지만 나중에는 회원가입 페이지에서도 모달을 띄울 수도 있고, 어쩌면 또 다른 페이지에서 띄울 수도 있는 노릇이다. 그래서 모달 컴포넌트를 아예 별도로 독립시켜서 로그인 페이지 바깥에 뜨게 만들었다.
  • 그리고 이 모달 컴포넌트와 이걸 띄우는 함수는 스토어에서 관리하게 했다. 아직 고칠 부분이 많이 보이는 아쉬운 상태에서 일단 pr을 날리고 리뷰를 받았다. 창현님께는 특별히 리뷰 재촉 드림ㅋㅋㅋ
  • 리뷰 받은 내용만 좀 더 반영하면 되겠다, 싶을 때쯤 지라 카드를 보러 들어갔는데 며칠 전에 이미 해결했다고 생각했던 이슈가 아직 남아 있는 것을 보았다. 그래서 카드를 처음 만든 Irfan님에게 댓글로 여쭤봤더니 여전히 해당 기능이 작동하지 않는다고 동영상까지(!) 첨부해서 보여주셨다. 어어 그럴 리가 없는데요...
  • 사건의 전말: 승진님께 Argo CD로 deploy 리스타트 하는 법을 배웠지만 나라는 사람은 그 방법만 알았을 뿐 메인에 새로운 기능을 머지한 후 리스타트 할 생각은 전혀 하지 않고 있었던 것이었다ㅋㅋ후... 내가 생각해도 나는 바보다. 그 탓에 QA 팀에서는 코드에 기능이 추가된 후 8일간이나 이걸 확인하지 못하고 있었던 것이었던......

오늘 배운 것

  • 모달을 띄울 때 뒷 배경을 dimmed 하게 만드는데 모달이 켜진 상태에서 그 배경을 클릭했을 때에도 모달이 꺼지도록 해야 한다. 하지만 일반적인 @click을 적용하면 모달 자체를 눌렀을 때에도 배경이 눌린 것마냥 꺼져 버린다. 이럴 때에는 @click.self를 적용하면 자식 컴포넌트가 아닌, 해당하는 컴포넌트 자체를 클릭했을 때에만 핸들러가 동작한다.
 

Event Handling | Vue.js

 

vuejs.org

오늘까지 한 일

  • 어제 드디어 딱 이번 베타 테스트 때 내놓을 만큼의 디자인 변경안이 나왔다. 소연님이 스코프를 많이 잘라 주셔서 사실상 로그인 페이지 딱 하나뿐이라 손이 아주 많이 가지는 않을 것 같았다. 틀만 잡고 세부사항은 차차 적용할 생각으로 일단 로그인 페이지 UI 변경 작업을 했다.
  • 디자인이 복잡하지 않아서 컴포넌트를 어떻게 구성하면 되겠다, 하는 건 금방 보였는데 문제는, 새로 만드는 게 아니라 이미 있는 걸 바꾼다는 점 그 자체였다. 아무것도 없는 상태에서 아예 다시 만드는 거였다면 차라리 편했을 텐데 파일이 많지 않을지라도 기존에 뭐가 있는 상태에서 변경하거나 수정하는 건 다소 까다롭다. 아예 필요 없는 파일 하나 지웠다가 빌드가 안 되고 막... pr 올린 후 실제로 그랬음 주의
  • 어제 저녁 7시 퇴근할 때까지 본가에 있다가 거기서 저녁까지 먹고 집에 올라왔다. 출근 생활 중이었다면 편도 2시간 여 걸리는 거리를 평일에 오갈 생각을 못했을 것이다. 재택이 좋은 이유! 그러나 집에 와서 운동하고 뭐 좀 하다가 정신 차려 보니 이미 3시였다. TIL 생략하고 그냥 잠
  • 3시에 자기 전에 pr을 올렸었는데, 일단 리뷰어로 우리 팀 개발자 세 분을 다 넣었다. 팀 배정 후 첫 pr이었다. 차마 pr 날린 직후에 링크를 공유할 순 없어서 아침 스크럼 도중에 올렸다. 그리고 빌드 안되는 거 걸림
  • pr merge 이후에 승진님이 argo CD로 dev 환경에 배포하는 방법을 알려주셨다. argo CD는 보기도 좋고 쓰기도 좋고 아무튼 너무 좋아 보인다. 문어(?) 너무 귀엽고..
  • 세부사항이 조금씩 변경되더라도 어쨌든 UI 변경안이 나왔으므로 나에게도 첫 Jira 카드가 배정되었다. 나도 이제 브랜치명 카드 넘버로 딸 수 있다! 카드가 배정되니 뭔가 진짜 잘 해야 될 것 같고, 귀찮게 할 사람이 출근을 이틀이나 안 한 통에 잠깐 무료할 뻔도 했지만 카드도 어차피 아직 한 개밖에 없는 거 하루종일 이것만 잡고 있게 됐다...!?앗 깃훅 어떡해!?

오늘 배운 것

  • 지금 사용하고 있는 건 Vue 2인데, 이건 올해 2.7 버전 출시 후 18개월 간의 LTS를 유지하고, 그 기간이 끝난 후에는 핵심적인 보안 관련을 제외하고는 모든 패치를 중단한다고 한다. 그렇다면 Vue 3로 넘어가는 것은 지금 당장이 아니더라도 어차피 불가피한 일인 것 같은데, Vue 3와 함께 사용할 수 있는 Vite(엄청 빨라서 그 이름도 vite, 불어 주의)라는 번들러 이름을 오늘 처음 주워듣게 되어서 뭔지 좀 찾아봤다.
 

Vite부터 시작하는 Vue 3 생활

한국시각 기준 19일 Vue의 최신 버전인 Vue 3가 공개되었다. 저장소링크 Vue 3는 이번에 용량 개선과 성능 향상을 위해 처음부터 다시 설계한 구조와, 트리 쉐이킹(라이브러리의 필요한 부분만 가져

ake.kr

+ Recent posts