지금까지 한 일

  • 지난달 말이 SSO 릴리즈였기 때문에 지난달에는 기능을 개발하고 에러를 잡는 데 거의 모든 시간을 썼다. 애초에 로그인에 관련된 것들을 다루는 프로젝트였던 만큼 스코프가 아주 크지 않았기 때문에, 내가 괜히 이유 없이 혼자 걱정하고 안절부절 못한 것과는 별개로 업무적으로 부담이 크진 않았다.
  • 프로젝트 성격상 시한부(...) 팀이었던 게 어느 정도 명확했던 만큼, 이후에 팀 배정은 어떻게 되며 이 프로젝트는 어떻게 되는지에 대해 얘기가 슬슬 나오기 시작했다.
  • 그러다 릴리즈를 열흘 정도 앞둔 시기에, 케이트님의 퇴사로 프론트엔드가 빠지게 되는 스토어싱크 팀에 가면 적당할 것 같다는 결론이 나왔다. 그리고 스토어싱크는 8월 말에 릴리즈 예정... 릴리즈 전문?
  • 그렇게 해서 SSO 릴리즈 주간에 살짝살짝 인수인계를 받으며 스토어싱크 쪽 업무에 발을 담그게 되었고, 이번주부터는 본격적으로 팀을 옮겨서 일을 시작하는 중이다.
  • 개인적으로 뷰티파이를 좋아하지 않아서 SSO가 Vue 3인 게 참 마음에 들었었는데, 스토어싱크로 와 보니 여긴 Vue 2라서 뷰티파이를 쓰고 있다. 간만에 보는 Vue 2+뷰티파이 조합의 코드라 눈에 잘 익지 않았는데, 엊그제는 세훈님과 6시간짜리 페어 프로그래밍 덕에 프로젝트 디렉토리 구조를 좀 익힐 수 있었다. 어제는 세훈님이 주신 태스크를 혼자서 삽질해 보면서 연습하는 시간을 가졌고, 오늘 드디어 pr을 날릴 수 있었다. 근데 여기는 리뷰를 영어로 달아주시네요 엉엉 세훈님 말씀처럼 릴리즈 이후에라도 조만간 전체적으로 리팩토링을 할 수밖에 없는 상황이라 일단은 동작하는 코드를 만드는 데 우선순위를 뒀다.
  • 지금까지 코드 읽는 것만으로도 삐걱대느라 시간이 걸렸지만 앞으로는 조금 더 속도가 붙지 않을까, 희망회로를 돌려본다.

오늘 한 일

  • 평소보다 일찍 일어나서 어제 다 마치지 못한 패스워드 리셋 페이지를 Vuetify 없이(Vue 3이므로...) 모달로 띄우는 작업을 마저 했다. 이것이 코어 타임의 효과인가? 쏟은 시간은 한 시간 반뿐이었는데 효율이 엄청 좋았다. 물론 후속 작업이 없다는 것은 아니고..
  • 아무튼 뿌듯한 마음으로 들어간 아침 스크럼에서, PO님이 SSO의 작업 속도가 requirement 생성되는 속도보다 빠르다고 말씀하셔서 갑자기 작업 텐션이 좀 느슨해졌다...!? 이때를 노려서 Vue 3와 Pinia를 부숴버려야겠다! 라고 생각했지만 하루아침에 부숴버리기에는 하루가 너무 짧았다😞  못다 한 공부는 주말을 노린다!
  • 오랜만에 생존 확인 차 다녀가신 승진님과의 장장 1시간에 걸친, 1시간이 지나가는지도 미처 눈치채지 못했던 즐거운 허들 타임! 오늘도 포인트는 많았지만 그 중에 몇 가지만 꼽아 보자면, 1. 언제든지 스스럼 없이 버리거나 방향을 전환하기에 자유로운 흥미 위주의 개인 사이드 프로젝트 도전, 2. 야근을 하는 대신 낮 근무 시간을 효율적으로 쓰면 좋겠는데, 3. 그 방법으로는 뽀모도로 타이머...? 하지만 효과는 없을 수 있다, 정도..?ㅋㅋㅋ아무튼 진짜 재밌었다.
  • 아니 누구 피셜, 깃헙 프로필에 쓴 스킬 중에서 자바스크립트는 남훈님 정도는 되어야 쓰는 거라는 말에 후다닥 지웠더니... 리액트랑 뷰는 넣어 놓고 자바스크립트는 왜 뺐냐고 하면... 나 귀 얇은데...

오늘 배운 것

  • 승진님이 알려주신, 짤줍하기 좋은 사이트 링크(https://xkcd.com/)
  • Vue 3 컴포넌트에서 선언한 data 영역의 변수들을 css에서 가져다 쓸 때는 color: v-bind(variable-name) 하는 식으로 쓸 수 있다는 것을 아래 링크에서 봤다.
 

Vue3 (3.2.x) — Vue variables in CSS (style section)

Using Vue3 variables inside of the <style> section

medium.com

오늘 한 일

  • 어제 하던 dialog 띄우는 작업을 계속 했다. 어제 설치한 vuetify로 가져온 v-dialog는 또 어느 컴포넌트에서 어떻게 불러올지 모르니 slot을 넣고 원하는 템플릿으로 사용할 수 있게 변형해 보았다.
  • dialog를 넣고 보니 원래 일률적인 사이즈로 사용하던 버튼의 크기가 좀 달라지게 되었다. 만들어 놓은 건 재활용해야 옳으니 width를 props로 넘길 수 있게 했다. 리액트로는 아무렇지 않게 했던 작업인데, 뷰에서 처음 하려니 자꾸 버벅댔다. 하여튼 뷰린이
  • 로그인 페이지에서 위의 버튼을 누르면 아무 기능 없이 껍데기뿐인 dialog가 일단 열리게는 하고 pr을 날렸다. 근데 지금 생각해보니 채널에 안 올림ㅋㅋ
  • 목요일마다 있는 테크세션 어쩔살롱은 오늘따라 유난히 재밌었다. 어쩔살롱에서 채팅창 안 켜면 손해..
  • vuex 공부 본격 시작! 근데 오늘은 시작만
  • 재밌는 일 잔뜩이었는데 기분이 별로다ㅠㅠ슬퍼

오늘 배운 것

  • 버튼에 props 넘길 때 나 같은 뷰린이가 참고하면 좋을 링크
 

Passing Variables to CSS on a Vue Component

Discover one of the not-so-common features of Vue.js, the injection of CSS variables from the component's script. Let's learn some Vue!

www.telerik.com

오늘 한 일

  • 오늘 하루 일과 시작과 함께 어제 밤늦게 날린 PR에 리뷰가 달렸다. 어차피 통신하는 서버 url은 고정이고, 거기에 withCredentials 설정도 기본으로 넣어놓는 게 좋겠다는 말씀이었다. axios는 http 통신을 처음 접했을 때부터 알았지만 이렇게 다시 공식문서를 보게 되니 한편으로는 반갑고 또 한편으로는 새로웠다.
  • 미로 챗에서 API 문서화 관련한 세훈님의 설명을 들었다. 나는 전후 상황은 잘 모르지만 단편적으로나마 들은 단어들 검색해서 찾아보기도 하고미로 보드에 있는 내용들을 살펴보기도 하고, 재밌는 시간이었다.
  • 언제부터였는지는 모르겠지만 얼마 전에 알아챈 거였는데, 이상하게 vscode에 깔아놓은 GitLens extension을 통해서 에디터 내에서 커밋 데이터를 띄우면 author의 프로필 사진으로 왠지 모르게 소름 끼치는 로봇이 나왔다. 다른 사람 로봇은 좀 괜찮은데 유독 나는 더욱 더... 꿈에 나오면 그게 바로 악몽... 며칠 전에도 구글링 하다 하다 포기했었는데 오늘 갑자기 너무 꼴보기가 싫어서 다시 찾아봤다. 다행히 금방 찾았다! vscode Settings에 들어가서 GitLens: Default Gravatars Style을 robohash(default)가 아닌 걸로 바꾸면 일단 그놈의 로봇은 안 나온다ㅠㅠfreedom...
  • 로봇을 처치하고 나니 또 욕심이 생겼다. 나는 왜 깃헙 프로필 사진이 안 나오지? 없는 것도 아닌데? 그래서 찾다가 무심코 눌러본 버튼이 곧 해결책이었다. GitLens 커밋 데이터가 나오는 창 하단의 Connect to Github(?한번 연결하고 나니 이 버튼이 다시 안 떠서 문구가 정확히 이건지는 모르겠다..) 버튼을 누르면 깃헙으로 연결되면서 정상적으로 모두의 프로필 사진을 볼 수 있다.
  • 로그인 페이지에서 특정 버튼을 누르면 dialog를 띄워야 해서 결국 vuetify를 깔았다. vue add vuetify 명령어를 입력하면 vue create와 비슷하게 설치 옵션을 선택할 수 있는데, 거기서 무심코 default(recommended)를 선택한 나는 App.vue를 비롯한 여러 파일들이 제멋대로 엎어지는 것을 목격했다. 이 파일 저 파일 열심히 수정하다가 차라리 예전으로 되돌아가서 다른 방법을 찾아보라는 상현님의 말에 힌트를 얻어 git stash를 해두고 다시 설치를 시도했다. configure(advanced)를 선택하면 될 일이었다. 허무

오늘 배운 것

  • 메인 브랜치 git pull은 브랜치 컬러가 초록색일 때 하자
  • 잊어버릴 때쯤 한 번씩 보게 되는 axios 공식문서
 

Config Defaults | Axios Docs

Config Defaults Config Defaults You can specify config defaults that will be applied to every request. Global axios defaults axios.defaults.baseURL = 'https://api.example.com'; axios.defaults.headers.common['Authorization'] = AUTH_TOKEN; axios.defaults.hea

axios-http.com

+ Recent posts