오늘 한 일

  • 지난주가 인도네시아 휴일이었기 때문에 vms UI에 대한 QA 피드백은 오늘 받을 수 있었다. 내가 고쳐야 하는 버그는 총 3가지였는데, 첫 번째부터 조금 난감했다.
  • 사용자가 비밀번호를 잊어서 리셋할 수 있는 링크를 휴대폰으로 받겠다고 하면, 그걸 왓츠앱이나 문자 중 선택해서 보내도록 하는 버튼이 있다. 기존 vms에는 이 버튼이 하나로 합쳐져 있는데, 아무래도 이번 작업은 UI 변경 작업이다 보니 기존에 붙어 있던 함수를 그대로 가져다 썼고 결국 같은 함수가 두 번 붙은 셈(...이건 전적으로 내 잘못)이었다.
  • 혹시나 프론트에서 특정 뭔가를 인수로 넘기면 왓츠앱과 문자를 분기할 수 있는 로직이 백엔드 쪽에 있나 봤는데 golang이라 살짝 난처했지만 없는 것 같았다. 그래도 혹시 모르니 창현님께 여쭤봤고, 백엔드 디버깅이 필요하다 하더라도 이건 할당된 UI 변경 카드로 해결할 문제가 아니라 별도의 카드로 해야 한다는 답변을 들을 수 있었다. 영어로 내가 앞뒤 정황을 다 설명할 자신이 없어서 소연님께 이러이러한 문제로 당장 로직 변경은 어려울 것 같다 말씀드리니 바로 이해하시고 버튼을 원래대로 합칠 수 있게 해 주셨다. 🥳
  • 나머지 버그도 삽질이 없잖아 있었으나 translation에 변수 넣기, 클립보드 복사 기능 넣기 등 첫 번째에 비하면 그래도 비교적 간단히 해결할 수 있는 것들이었다.
  • sso 관련해서는 승진님과 프론트 작업 현황을 공유하는 시간을 가졌다. 허들이 시작되자마자 깨달은 사실: pr 올려놓고 슬랙에 링크를 안 올렸다. 내 기억력 무슨 일이야? 비밀번호 리셋하는 페이지는 우연찮게도 내가 마음대로 만들었으나 결과적으로는 피그마와 디자인이 상당히 일치하므로 세부적인 부분만 간단히 확인하고 넘어갈 예정이었다. 비밀번호 변경 페이지는 아직 급하지 않으므로 뒤로 미루고, 베타 테스트 때 숨겨 놓았던 그렇기 때문에 손볼 데가 많을 회원가입 페이지부터 우선 작업하기로 했다.
  • 승인된 pr의 브랜치를 머지한 기념으로 손대지 않고 있었던 sso 카드를 정리했다. 승진님이 할당해 주신 카드를 내 멋대로 잘게 나눈 것들이 있는데, 제목만 봐서는 그게 그거 같아 보이는 함정이 있어서 이해를 돕기 위해 짧게나마 설명을 덧붙였다. 그러다 보니 뭔가 이상하다는 것을 깨달았다. 방금 이미 dev 브랜치에 머지까지 끝낸 pr 브랜치명을, 유사한 다른 카드 넘버로 잘못 딴 것이었다. 나중에 찾기 쉽도록 pr 제목과 내용만 바꿔주고 넘어갈 수 있었지만 잠깐 온몸에 소름이 돋았다. 그러게 누가 카드 그렇게 나누래

오늘 배운 것

  • 지난번에 상현님에게 테이블플러스 사용법을 배웠었다. 근데 그게 회사에 두고 온 맥북에 있다ㅠㅠ DB를 오늘도 봐야 했는데 테이블플러스를 잃은 나는 다시 선생님께 도움 요청해서 워크벤치를 깔았는데, 충격과 공포의 연속이었다. ? 얘 왜 이렇게 생겼어..가독성 무슨 일이야..주황색 코끼리 돌려줘..
 

MySQL :: Download MySQL Workbench

Select Operating System: Select Operating System… Microsoft Windows Ubuntu Linux Red Hat Enterprise Linux / Oracle Linux Fedora macOS Source Code Select OS Version: All Windows (x86, 64-bit) Recommended Download: Other Downloads: Windows (x86, 64-bit), M

dev.mysql.com

오늘 한 일

  • 최근까지 vms UI 작업을 하느라 뒷전으로 밀렸었던 sso UI 적용에 약간의 부채감을 안고 있었는데, 비록 그 과정에서 파생된 또 다른 부채들이 리스트로 남았지만 그래도 오늘은 조금 해소했다.
  • 회사에서 지급한 맥북을 지난주에 회사에 두고 퇴근했고 오늘은 집에서 개인 맥북으로 일을 했는데, 한 번도 golang으로 작성된 sso 서버를 안 돌려봤었는지 서버 구동하려니 에러가 터지기 시작했다. 이게 문제인가 저게 문제인가 이것저것 만져보다가 결국 go 설치부터 다시 시도. path 관련으로 고통 받았던 지난날의 기억이 갑자기 주마등처럼 스쳐 지나가면서 사실 좀 무서웠다. 나 오늘 왜 재택하기로 한 거지?
  • 하지만 반복된 에러가 면역력을 키워준 걸까. 구글링을 다시 한 건 똑같았지만 타고 들어갈 때마다 어쩐지 익숙한 링크들ㅋㅋ 이미 지난 삽질들을 통해 한 번씩은 봤던 내용들이어서 그랬나 보다. 몇 번 시도해 보니 생각보다 금방 해결되었다. 왠지 다음 번에는 더 잘 할 수 있을 거라는 자신감이 생겼다. 하지만 과연?
  • sso는 사실 어떤 걸 언제까지 해야 하는지는 확실하지 않지만 어쨌든 해야 하는데 안 되어 있는 건 맞고 지난주에 승진님과 확인했던 피그마의 디자인에 맞게 로그인 페이지를 고쳤다. 운명의 장난처럼 매우 공교롭게도 이번 작업 역시 주로 다이얼로그였다. 기본 포맷이 될 거라고 예상했던 디자인을 벗어난 다이얼로그는 css를 다시 손보고, 이메일을 보낸 후에 타이머를 작동시켜서 60초 카운트다운이 완료되면 재전송이 가능하도록 기능을 추가했다. vuetify 하나 빠졌다고 이렇게 수월할 수가...내가 잘 못 다루는 게 맞겠지만 없는 게 마음은 편-안
  • 오늘은 신나는 월요일이니 지완님과의 원온원이 있었다. 항상 이렇게 가볍고 시시콜콜한 얘기로 시작하는 게 좋다. 입도 트이는 기분, 이건 마치 준비운동. 컴퓨터 전공이 아닌 심지어 문과 출신 나로서는 하드웨어 쪽 지식이 전혀 없는 게 가끔 너무 장벽처럼 느껴져서 어떻게 공부를 하면 좋은지 여쭤봤더니 Rust, C, C++ 같은 low-level 언어를 공부하는 것을 추천해 주셨다. 하드웨어 자체에 대한 지식보다는 하드웨어와 소프트웨어가 어떻게 연결되는지, 소프트웨어가 하드웨어를 어떻게 이용하는지 그런 방식들을 이해하는 게 더 필요하고, low-level 언어를 공부하면 자연스럽게 그런 부분을 알 수 있을 거라고 하셨다. 공부할 거 원래 많았지만 더 늘었어!

오늘 배운 것

  • sso의 로그인 페이지 다이얼로그에 사용자가 이메일을 입력하고 제출했을 때 이메일 주소에 대한 유효성 검사를 하는데, 피그마에 따르면 검사 결과 에러 메시지를 띄운 후에는 전송 버튼을 비활성화 해야 한다. 이 전송 버튼은 사용자가 다시 이메일을 수정하면 활성화 되는데 이때 사용자의 입력 값을 watch로 보고자 했다. reactive object의 한 속성만 따로 watch에 넘길 수는 없고, getter function을 사용해야 한다.
 

Watchers | Vue.js

 

vuejs.org

  • 그런데 기존의 이메일과 새로운 이메일의 값을 비교해서 쓸 일이 전혀 없기 때문에 watchEffect를 써도 무방할 것 같은데 이건 내일 한 번 해봐야겠다.
 

[Vue.js] watch와 watchEffect의 차이

watch : 특정 데이터가 변경되었을 때 실행, 새로운 데이터와 이전의 데이터를 가져옴 (lazy)watchEffect : 의존성이 있는 데이터에 대해서 즉각적으로 실행 (immediately)특정 반응 속성을 보고 싶거나, old

velog.io

 

오늘 한 일

  • 오늘은 지난 주에 이어 Go를 더 봤다.
  • 별 문제 없이 잘 흘러가고 있다 싶을 때, 슬라이스를 만났고.. 처음에는 이해가 좀 된다 싶었다. 이 링크를 만나기 전까지는.
  • (이건 나 혼자만 이해할 수 있는 끄적임..ㅠㅠ) 슬라이스의 length와 capacity가 어떻게 다른지, 무슨 차이가 있는지도 알겠고, append 할 때 append 하려는 요소의 개수가 슬라이스의 capacity를 초과하는 경우 capacity가 기존의 2배로 늘어난다는 것도 알겠다. 그런데 length = 0, capacity = 0 인 슬라이스에 0, 1, 2, 3, 4를 append 하면 왜 갑자기 length = 5, capacity = 6이 되냐고.. 0, 1, 2, 3을 append 할 때까지는 length와 capacity가 같은데. 마침 허들을 걸어주신 Kei님께 여쭤봤더니, 메모리 단편화를 지양하고 메모리 최적화를 달성하기 위한 Go만의 방법이 작용한 결과일 것이라는 답변을 받았다. 그리고 지금 당장 깊게 파고들어야 하는 문제도 아닌 것. 그래서 여기다 keep 하고 넘어간다 ㅠ.ㅠ 날코딩이긴 한데 미래의 나에게 맡긴다 흑흑.. 애초에 궁금했던 건 아래 코드 중 2번 케이스에 해당한다(capacity가 1 -> 2 -> 3 -> 4 -> 6 -> 8 순서로 늘어난다). 1번은 2번처럼 날코딩이 아닌 방식으로 해보려고 배열의 배열을 생성해서 시작했더니 capacity가 1 -> 2 -> 4 -> 8 순서로 늘어난다. 미래의 내가 다시 돌아왔을 때 '얘는 뭐 이런 쉬운 걸 고민해ㅋㅋ'라고 했으면 좋겠다. 제발
// https://go-tour-ko.appspot.com/moretypes/15
// https://go.dev/play/p/OKtCFskbp2t

package main

import "fmt"

func main() {

	fmt.Println("##### 1번 케이스 #####")

	var array [8][]int
	for i := 0; i < 8; i++ {
		for j := 0; j <= i; j++ {
			array[i] = append(array[i], j)
		}
		printSlice(array[i])
	}

	/*
	len=1 cap=1 [0]
	len=2 cap=2 [0 1]
	len=3 cap=4 [0 1 2]
	len=4 cap=4 [0 1 2 3]
	len=5 cap=8 [0 1 2 3 4]
	len=6 cap=8 [0 1 2 3 4 5]
	len=7 cap=8 [0 1 2 3 4 5 6]
	len=8 cap=8 [0 1 2 3 4 5 6 7]
	*/

	fmt.Println("##### 2번 케이스 #####")
	var a, b, c, d, e, f, g, h []int

	a = append(a, 0)
	printSlice(a)
	
	b = append(b, 0, 1)
	printSlice(b)

	c = append(c, 0, 1, 2)
	printSlice(c)

	d = append(d, 0, 1, 2, 3)
	printSlice(d)

	e = append(e, 0, 1, 2, 3, 4)
	printSlice(e)

	f = append(f, 0, 1, 2, 3, 4, 5)
	printSlice(f)

	g = append(g, 0, 1, 2, 3, 4, 5, 6)
	printSlice(g)

	h = append(h, 0, 1, 2, 3, 4, 5, 6, 7)
	printSlice(h)

	/*
	len=1 cap=1 [0]
	len=2 cap=2 [0 1]
	len=3 cap=3 [0 1 2]
	len=4 cap=4 [0 1 2 3]
	len=5 cap=6 [0 1 2 3 4]
	len=6 cap=6 [0 1 2 3 4 5]
	len=7 cap=8 [0 1 2 3 4 5 6]
	len=8 cap=8 [0 1 2 3 4 5 6 7]
	*/
}

func printSlice(s []int) {
	fmt.Printf("len=%d cap=%d %v\n", len(s), cap(s), s)
}
  • Kei님의 제안으로 태초마을 주민이 되었다. 나도 이제 포켓몬 트레이너...!? 이것과 관련해서 내일 미팅부터 시작해서 뭔가 펼쳐질 것 같은데 재밌을 것 같아 기대도 되고, 내가 뭐라도 할 수 있을까 싶어 걱정도 된다.
  • 전화영어 신청했다! 영어 공부도 할 거야, 이제.. 나만 영어 못할 수 없어ㅠㅠ

오늘 배운 것

  • 궁금한 게 있으면 바로 질문하고, 이걸 지금 계속 고민할 필요가 있는 것인지 짚고 넘어가도록 하자.

오늘 한 일

  • 오늘 아침은 어제 업무 설명을 들은 팀의 스크럼에 참여했다. 줌이나 구글밋이 아닌 미로에서 스크럼 보드를 보면서 바로 진행하는 방식이었는데, 접속부터가 잘 안 돼서 애를 먹었다. 결국 크롬을 버리고 사파리로 갈아탔더니 극적으로 2분 늦게 들어갈 수 있었다.
  • 미로는 스크럼 보드도 보고 때로는 작성도 하면서 미팅도 하고, 이걸 한 번에 다 할 수 있다는 장점이 있었지만 한 가지 불편한 건 줌에서처럼 말하고 있는 사람의 카메라에 포커스 되는 기능이 없었다는 점이었다. 아직 어느 분이 어떤 목소리를 가졌는지 파악하지 못한 나로서는 입을 움직이고 있는 주인공을 찾아다니느라 스크럼 내내 혼자 바빴다. 뉴비의 고충
  • 어제 뷰 공부하다가 남겨둔 한 챕터를 마저 봤다. 부모 컴포넌트에서 자식 컴포넌트로는 데이터를 props로 넘기고, 자식이 부모의 데이터를 변경하려면 emit을 사용하면 된다. 하지만 만약 자식이 부모를 거치지 않고 더욱 상위의 조상 컴포넌트가 가진 데이터를 건드리려고 한다면? 자식에게서 발생한 이벤트를 eventBus에 태우고, 조상 컴포넌트가 eventBus로부터 해당 이벤트를 감지하여 꺼내오면 된다.
  • 그리고 좀 더 심화 자료를 찾아볼까 생각하던 찰나, 세훈님이 앞으로 공부하면 좋을 키워드들을 던져주셨다. 어차피 한 번쯤 만져봐야 하는 것들이라면 이번 기회에 조금씩이라도 봐 놓는 게 좋을 것 같아서 패기 넘치게 바로 Go로 넘어갔다. 패기가 과해
  • Go를 설치한 후 구글링해 가면서 환경변수도 적당히 설정했다. 연습용 프로젝트 파일을 생성한 후 vscode 터미널에서 go run main.go 명령어로 실행하려니 자꾸 GOPATH, 또는 GOPATH와 GOROOT 관련한 에러가 떴다. 그런데 특이한 건 맥 터미널에서 같은 경로로 들어가 똑같은 명령어를 입력하면 내가 원하는 결과가 문제없이 출력되었다. vscode extension도 건드려보고, 환경변수도 다시 이리저리 바꿔보고, .mod 파일을 만들었다 없앴다 디렉토리를 바꿔봤다가 별 짓을 다 해봐도 계속 똑같았다. 맥 터미널에서는 돌아가는데 vscode 터미널에서는 돌아가지 않았다.
  • 하다하다 지쳐서 처음부터 다시 해보기로 했다. 프로젝트 디렉토리와 ~/go 디렉토리를 전부 삭제해버렸다. 상현님이 노마드 코더 강의 영상이 잘 되어 있다고 해서 원래는 영상 내용을 볼 생각으로 들어갔다가 거기 달린 코멘트 하나를 보고 무심코 따라했는데 성공해버렸다. vscode에서 설치하라는 extension들을 안 깔아서 그랬던 건지 아직 정확히는 원인을 파악하지 못했다.
  • Go를 심폐소생하기 전에, 시니어 분들이 진행하시는 테크 세션에 참석했다가 또 다른, 셀러들이 쉽고 직관적으로 서비스를 이용할 수 있도록 전체적인 프로세스를 관리하는 팀의 업무 설명을 들었고, 그러다 보니 나의 죽어가던 Go를 겨우 살려냈을 때는 이미 오후 6시였다..
  • 남은 한 시간 동안 공식문서를 들여다 봤는데, 자바스크립트랑은 문법이 비슷하면서도 다른 면이 있어서 오히려 신기하고 재밌었다.

오늘 배운 것

  • 아래 링크 코멘트의 2번까지는 이미 잘 되었으므로 나는 3번부터 순서대로 시도했다. 2번에서 go env를 입력하면 나오는 GOPATH는 '/Users/[username]/go', GOROOT는 '/usr/local/go'였다.
 

All Courses – 노마드 코더 Nomad Coders

초급부터 고급까지! 니꼬쌤과 함께 풀스택으로 성장하세요!

nomadcoders.co

+ Recent posts