간단한 블로그

얼마 전 회사에서 공유했던 문서 중 하나를 가져와 블로그에도 적어둔다. 다른 글과 다르게 회사에 공유했던 주요 내용만 요약한 글이지만, 제대로 확인된 내용이 아니기도 하고 평소에 어떤 식으로 이야기를 풀어 공유 해왔는지를 남겨두는데 의미를 둔다. 개요신규 프로젝트 런칭 이후 성능 개선 작업 도중 문득 이상한 것을 발견했다. HTTP2를 지원하는 스테이지 서버임에도 때때로 굉장히 "느리게" 페이지의 JS가 실행되는 것이었다. 혹시나 하여 청크 개수 제한을 걸고 배포해보니 불규칙적인 로드 완료 지연이 크게 줄어든 것을 느꼈다. 이것을 제대로 확인해보진 않았지만 분명하게 빨라진 것을 느꼈고, 다른 성능 개선 작업에 더해(서비스에 아무런 영향이 없으니) 청크 제한을 건 상태로 라이브 배포를 진행했다. 다른 작업..

최근 여기저기에서 gRPC에 대한 이야기가 들린다. 회사에서 gRPC를 쓰겠다는 말이 있기도 했지만 이런 통신 계열에 재미있는 것이 자주 나와 관심을 가져봤다. 책을 읽고 이런저런 테스트를 해보니 당장 쓰진 않을 것 같지만, 관련 시스템을 한번쯤 만질 일은 있을 것 같다는 생각이 들어 이 글을 남겨둔다. 최소한 순식간에 없어질 정도는 아닐 것 같다는 뜻이다. gRPC gRPC는 구글에서 만든 원격 프로시저 호출(RPC) 시스템이다. CGI부터 이어져 온, 외부 시스템에 값을 전달해주기 위해 사용하는 연결 방식이다. 더 줄이자면 "RESTful API를 대체할 수 있는 무엇이다" 정도로 말할 수 있겠다. 물론 응답을 주고 받을 프로젝트가 웹 프로젝트로 한정되지 않았다는 점 때문에 약간 다르지만, 결국 서버..

연말 평가가 다가와 수행한 업무들을 정리하던 중 블로그에도 회고를 적는다. 11월이지만 늦게 적는 것보단 미리 적는 게 더 나을 것 같기도 하고, 하반기에 남은 업무가 많지 않아 한두 달 지나도 차이는 없을 것 같다. 올해 상반기까지는 계속 혼자 작업을 진행했었는데, 하반기부터 팀원이 한분 붙어 함께 작업하기 시작했다. 정/부 개념이 되어 부담은 덜해졌다. 다만 서로 코드 리뷰를 해도 놓치는 부분이 여전히 있었다. 주로 스타일이나 로그 등 상대적으로 중요하지 않은 부분이 그랬는데, 이건 리뷰하는 인원이 늘어난다고 해도 별 차이가 없을 것 같다. 주요 업무서비스 업무1. 국내 숙소 상세 사이트 개편 (07/20 ~ 11/08)개요 11월 8일에 런칭한 가장 최근 프로젝트이기도 하지만 중요도와 성과를 생각하..

개발자로서 업무를 진행하다 보면 별 생각 없이 섞어 쓰는 단어들이 있다. 정확한 뜻은 다르지만 모두 이해하고 있고 구분할 정도로 다르지는 않기에 다들 무시하는 그런 단어들이다. 섞어 쓰면 안된다거나 고쳐야 한다는 그런 것은 아니고, 단순히 재미삼아 떠오르는 대로 몇가지 적어본다. 1. Function과 Method최근 멀티 패러다임 언어가 많아지며 이 둘을 구분하는 것이 꽤 중요해지긴 했다. 자신이 어떤 것을 만들고자 하는지 알아야 방향을 잡을 수 있기 때문이다. 간단하게 요약하면 이렇게 쓸 수 있겠다.함수는 외부에 영향 없이 입력에 대한 출력을 반환하는 명령이다. 메소드는 요소(객체)의 상태를 변화시키는 행동이다. 함수형 언어를 공부했다면 이 두개 단어를 혼용하는 것에 미묘한 반감을 가지게 된다. 함수..

의문 리액트의 훅은 deps값을 저장하고, 이전 값과 비교하여 변화가 있을 때 재실행(갱신)하도록 한다. deps 비교는 당연히 reference 비교라고 생각했기에 아무런 의심 없이 사용해왔다. 하지만 최근 IDE의 자동 완성을 이용해 deps 구문을 작성했을 때 의도했던 갱신이 이루어지지 않았다. 확인해 보니 deps에 등록된 객체의 필드가 문자열이었고, 객체가 변경되었지만 문자열 자체는 변하지 않았기 때문이었다. 이 참에 deps에 대해 짚어보자는 생각으로 리액트의 코드를 확인해 보고, 그 기록을 남긴다. 물론 이 글 역시 너무 오랫동안 글을 쓰지 않아 팀 메신저에 공유했었던 내용을 정리하여 다시 쓰는 글이다... React는 훅의 deps를 어떻게 비교하는가? 먼저 리액트의 코드를 직접 확인해 본..

의문더블클릭과 더블탭. 아주 흔하게 사용하고 핸들링하는 제스쳐 이벤트다. 그런데 생각해보면 이상하다. 클릭하고 또다시 클릭한다는 더블 클릭의 기준은 뭘까? 클릭과 터치는 기기에 따라 다른 이벤트로 구분하지만 이 글에서는 같은 동작에 대해 설명하려 하므로 더블 클릭으로 통일한다. 위키백과에서는위키백과에 따르면 더블 클릭은 움직임 없이 버튼을 두번 '빠르게' 누르는 것이라고 설명한다. 당연하게도 위키백과에 속도에 대한 부분도 있다. 기본 설정의 윈도우에선 500ms 안에 다시 클릭했을 때 더블 클릭으로 판단한다는 내용이다. 심지어 마우스 설정에서 속도를 변경하는 법에 대해 설명하고 있다. 하지만 웹 개발자에게 있어 os는 독립적이며, 브라우저라는 샌드박스 위의 동작에 대해 알아야 하니 다른 이야기이다. W3..

FE 개발자는 많은 Rest API(웹 개발에 대한 이야기이니 이하 API로 칭한다)를 사용한다. 대부분의 로직을 백엔드에서 처리하기 때문이다. 그러다 보니 많은 개발자가 만든 API를 사용해보게 된다. 나 역시도 정부 기관, 오픈 API나 사내 API 등 꽤 많은 수의 API들을 사용해보았다. 겉으로 보기에 큰 차이는 없어 보였지만 유독 쓰기 곤란한 것들도 있었고 오랜 기간 다양한 작업을 수행했음에도 아무런 수정이 필요하지 않았던 훌륭한 API들도 있었다. 물론 비즈니스 로직의 영향도 있고 변경 범위가 크지 않아서 그럴 수 있다. 하지만 API를 호출하는 입장에서 느껴지는 '무엇인가'가 있다. 그 차이가 무엇일까 궁금해 얼마 전부터 떠오르는 것들을 메모장에 적어두었다. 어느정도 내용이 쌓인 것 같아 블..

회사에서도, 개인적으로도 최근 진행한 프로젝트는 모두 Next.js를 사용하고 있다. 퍼블리싱을 맡는 부서가 나누어져 있지 않고 SEO와 관련된 문제를 해결하기 위한 것이 크지만, 한편으로는 리액트 진영의 라이브러리들로 편하게 개발하고자 하는 면도 있다. 하지만 Next.js를 사용해도 백엔드의 컨트롤러 부분, 그러니까 클라이언트의 요청을 직접 받는 부분을 개발하기 위한 해답이 명확하지 않다. 작은 규모의 프로젝트에서 서버간 통신을 구현할 때에는 Axios를 이용한 레이어링으로 충분하다. 하지만 API의 개수와 규모가 커지다 보면 Next.js에서 지원하는 api 폴더 내에 코드 뭉치를 욱여넣는 것으로는 부족해진다. 특히 API 엔드포인트들을 관리하고 타입 체크를 하는 것 자체가 엄청난 피로감을 유발한다..

이 책은 PM-PO 직군, 그러니까 기획 계열의 업무 관련 도서다. 어떻게 해야 프로젝트를 성공적으로 이끌어 나갈 수 있을지에 대한 책으로 일종의 자기계발 서적이다. 자기계발 서적들이 흔히 그렇지만 250장이 넘는 책의 내용 중 얻을 것이 극소수라 부정적인 시선으로 보게 된다. 최근들어 PM-PO 직군으로 운영하는 회사가 많아져서인지 이 책을 추천 도서로 넣는 경우가 있는데 개인적으로는 PM-PO 직군 밥그릇 내구도 강화 재료라고 보인다. 한동안 개발쪽에서도 유행했던 그런 책이란 느낌이다. 제목이기도 한 '개발 함정'에 관한 골자는 한줄로 요약할 수 있다. "필요없는 기능을 개발하는데 쓸데없는 시간과 인력을 소모하지 말라" 이것이다. 하지만 실무를 경험해본 사람들은 의아할 수 밖에 없다. 어떻게 "필요없..

하반기 회고라기에는 상반기 회고를 너무 늦게 작성하는 바람에 뭔가 꼬인 느낌이 있다. 내용 중 하반기에 한 작업이 많았고(8~9월 작업이니) 그 이후로는 대부분 서스테이닝 작업을 진행했기에 기록하기 애매한 내용들이 많다. 이 유지보수성 작업들은 뭔가 하는건 많은데 포트폴리오로 남길만한 내용이(뭔가 있어보이는 내용이) 없는 편이다. 그런데도 오히려 서비스 운영을 위한 근본적인 실력 자체는 늘어난다는게 참 아이러니하다. 어쨌든 사내 평가 시스템에 내용을 작성하며 정리한 김에 블로그에도 정리해두려고 한다. 1. 클라이언트 로그 라이브러리 개발이곳의 서비스들은 클라이언트 로그(통계 정보) 수집을 위해 aws kinesis를, 사용자의 인증 정보를 획득하기 위해 cognito를 사용하고 있다. 문제는 이 클라이언..