2024년 07월 04일
1. 왜 자꾸 코끼리를 냉장고에 넣으려고 할까?
- 새로운 기술을 도입할 때 오버엔지니어링에 대해 고민해봐야한다.
- 시리즈 규모에 따라 알맞게 선택하는 것이 중요하다.
- 기술 도입 우선 vs 비지니스 우선
- 개발 형태도 초기 개발 형태, 확장 개발 형태 등 회사 규모나 상황에 따라 대처해야한다.
- 해당 강의 중 본인이 생각하는 상태 관리 아키텍처, 컴포넌트 아키텍처, 프로젝트 아키텍처를 시각화하는 숙제가 있었다. 해당 숙제를 받아보고 느낀 점은 사내에서 컴포넌트 생성 전 팀원들과 공유할 때 이러한 방식을 도입하면 팀원 각각의 컴포넌트 이해도와 컴포넌트 생성 후 발생할 수 있는 의견 충돌을 줄일 수 있을 것이라는 생각이 들었다.
2. 아하! 모먼트! (초청 개발자님들과의 QnA)
- 작업 기간 산출 방법 / 업무 분배 방법?
- 용찬님
- 주니어에게 맡긴다. 본인이 생각하는 기준과 주니어가 생각하는 기준이 다르기 때문이다.
- 현석님
- 주니어에게 넘긴다.
- 책임은 내가 질테니 다 시도해보라고 한다. 하지만 스노우볼 효과를 방지하고자 문제가 생기면 즉시 알릴 것을 강조한다.
- 가장 쉬운 것은 역산법, 배포일 기준으로 D-Day 계산해서 역으로 산출해보는게 가장 간단하다.
- 준일님
- 스토리에 대한 팀 학습 후 작은 단위로 쪼개서 나눈다.
- 작업이 늦춰진 경우 기술 부채에 대해 기록해놓고 개선한다.
- 일이 쉽다고 느껴지면 해당 속도보다 10배 빠르게 하는 방법에 대해 고민해본다.
- 효율적인 디버깅 방식?
- 용찬님
- react development
- chrome debugger 활용 → 복잡해보이고 어려워 보이지만 최대한 많이 열어보고 사소한 디버깅이라도 디버깅해보기
- 현석님
- 알고리즘 → 협업을 잘못해도 회사에 한방한방 크게 기여하는 경우를 보았다.
- 집착해야한다. → 오류 사항을 재현하려고 노력한다.
- ex 센트리 동영상 촬영
- 사례 하나로 css가 깨지는 경우가 있었는데 바닐라 익스트랙트가 빌드 타임에 생성되는데 빌드 시 꼬여서 깨진 것이었다. 그래서 커밋 쪼개서 수십 개의 커밋을 배포해보며 찾았던 경험이 있다.
- 인성님
- locator js 익스텐션 → 크롬 개발자 도구에 설치해서 클릭하면 vs code에서 코드로 열린다.
- 디버깅 방식을 굳이 나눈다면 탑다운 방식과 바텀업 방식이 있다.
- 탑다운 : 사용자에게 가장 가까운 방향부터 디버깅하는 방식
- debugger 코드를 입력하여 크롬 개발자 도구에서 한줄 한줄 확인해본다. 결국 노가다이다.
- 바텀업 : 빌드 된 파일까지 뒤지는 방법
- 프론트에서 데이터 가공(서버에서 온 response를 원하는 결과물로 출력)은 어디서 해야할까요? 러프하게 데이터와 뷰가 나누어져있다고 했을 때 뷰에 가장 가까운 레이어에서 하면 맞는걸까요?
- 현석님
- 모델을 관리하는 인스턴스 & 클래스로 해결할 수도 있다.
- MST, Redux 정규화 → keyed-by-id
- Tanstack query
- 서버의 데이터를 갈아끼운다고 생각할 때는 QueryFn → Service 레이어에서 만든 정규화 함수 사용
- 클라이언트에서 갈아끼운다고 생각할 때는 Select 사용 → Service 레이어에서 만든 정규화 함수 사용
- 준일님
- 용찬님
- 인성님
- 전 기술은 상황에 따라 다르게 쓰는데 뷰는 데이터 파싱은 극도로 꺼리는 편입니다! 포맷 정도만 가능하게 퓨어한 데이터를 뷰로 내리는 중간 서비스 객체를 두어요
- 신규 기술에 대해 실제 개발 전에 도입 여부를 어떤 식으로 판단해서 검토를 하시나요?
-
현석님
- 사소한 패키지 하나 추가하는 것도 쉽게 용납하지 않고 철저한 PoC(Proof of Concept, 개념 증명, 기술 증명)를 엄청시킨다. 사용 방법 전파, 활용 방법 공유를 시키는 편이다.
- Shopify의 Vanilla Extract 도입 사례를 찾아보면 상당히 인상적임
-
용찬님
- 유명 라이브러리를 영향력있는 회사에서 사용하고 있거나 주변에서 많이 쓰고 핫한 기술이라고 하면 써볼만한 가치는 충분히 있다고 생각한다. 즉, 해당 기술에 경험이 없어 헤딩하는 과정이 힘들 수 있지만 새로운 도전 정신과 성장에 대한 욕구를 바탕으로 도입해보는 것이 좋을 것 같다.
- 예를 들어 현재 상황에서 Next js App Router를 도입하는 경우 상당히 힘들 수 있다.
-
인성님
- 참고할 수준의 코드가 있는지(reddit, github, stack overflow 대표적으로 사용) 확인
- npm 다운로드는 봇이 많아서 신뢰할 수준이 안됩니다
- 용량, package.json 확인하는 것도 필수
- 시간을 투자하는 만큼의 효용성이 나는지(러닝 커브, 호환성 확인)
- 실제로 코드를 작성할 때 지원되는 플러그인이나 확장팩이 있는지 확인(개발자 경험은 정말정말 중요하기 때문)
이후 혼자라면:
- 그냥 도입한다.
- 버전 관리 시스템에서 브랜치 정도를 바꿔서 하는 것을 추천
집단이라면:
- 무조건 논의, PoC, 어느정도의 가설 검증이 된 후 진행
- 웹뷰 관련 디버깅 팁?
- 인성님
- 웹뷰 디버깅 하려면 기기가 있어야한다.
- 인터페이스를 직접 만들어야한다.
- 미러링 필요
- 센트리도 활용한다.
- 콘솔을 오버래핑해서 클라우드로 넘긴다.
- 용찬님
- v-console 많이 쓴다 (텐센트꺼) → 브라우저 위에 콘솔을 올리는 것
- proxy man (네트워크 요청 확인)
- 현석
- charles proxy > 실제 기기의 네트워크 패킹을 가로채서 로컬에서 띄우는 코드를 앱에 보여줄 수 있습니다
- v-console
- 참고 영상
- 주니어 신입 취준 시절 떄, 본인의 생각나는 혹은 기억에 남는 성장법?
- 문제 해결 역량을 키워가는 방법?
- 이직해야겠다 라고 생각하게 되는 부분이나 타이밍, 면접같은 상황에서 회사를 옮기려는 이유나 회사에 들어오고 싶은 이유에 대해 어떻게 생각해야할지?