멘토님과의 커피챗 #2

헬스체크

멘토님의 귀한 말씀들

프롱이들의 궁금한 점

가나다 순으로 정렬했어요 !!

김민수

• 디자이너와 협업을 어떤식으로 진행하시는지 궁금합니다!
• 요구사항 정의서가 있는지.. 피그마로 파일을 넘겨주시는지..
• A) 조직마다 조금씩 다른데, 당근에서는 ShapeUp 이란 방식으로 제품을 만들고 있다. 처음에 러프한 아이디어를 던진 사람이 PRD를 작성하고, 이 PRD를 바탕으로 building(아이디어 구체화)할 때 디자인, 개발자가 협업한다. 디자이너분께서 피그마로 디자인을 주시고, 디자인이 완벽하게 나오기 전 개발 진행할 수 있는 것들 진행하고, 추후 디자인이 완성되면 핸드오프를 가지고 개발도 완성시킨다.

• css 사용을 많이 하시는지 궁금합니다~
• A) 피그마에서 대부분 css 까지 만들어주긴 하지만 기본적으로 css는 많이 사용한다.

안재현

• 코테 스터디 관련 (다윤님이 질문해주신 것과 동일합니다 !!)
• 현재 진행중인 방식은 매주 5문제를 선정하여 각자 1문제씩 코드 발표를 합니다!!
• 효과적인 코테 스터디 방식은 어떤 것이 있을까요?

이승민

• 프론트엔드 개발자는 원활한 협업을 위해 디자인 툴을 어느정도 다룰 수 있거나 백엔드 지식을 어느정도 알고 있으면 좋다는 말이 있던데 사실인가요?
• A) 어느정도 맞는 말. 일단 디자인 툴을 완벽히 다룰 필요는 없다. 왜냐면 대부분 팀으로 일하고 팀에 디자인에 전문성을 갖춘 분(UI/UX 디자이너 등)이 존재한다. 그래서 툴을 다루기보단 해당 디자인이 개발하기 좋은 디자인인가 or 경험을 해치지 않으면서 개발 리소스 적은 방향은 무엇인지 이런 쪽으로 커뮤니케이션 많이 하는 것이 더 효과적이고, 디자이너분들도 그것을 기대한다. 백엔드 지식도 알고 있으면 좋다. 전체 애플리케이션을 혼자 개발하면서 풀 사이클을 경험해보면 시야를 넓히는데 도움이 된다.

• 실제 현업에서도 요구사항 명세서를 작성하고 프로젝트를 진행하나요?
• A) 맞습니다. 현재 당근에서는 요구사항 명세서 처럼 자세하게 작성하지는 않지만 러프한 아이디어와 문제 정의, 해결 방법에 대한 내용을 담는 PRD라는 문서를 작성하고 있습니다(이것도 팀마다 조금씩 다릅니다)

정다윤

• 어떻게 하면 타입스크립트를 잘 활용할 수 있을까요?
• React + TS로 개발을 했었는데, 객체의 타입을 관리할 때나 함수 매개변수 타입 지정하는 정도로만 사용했었습니다.
• 근데 따로 강의를 들어보니 제가 모르고 있었거나 사용해보지 못한 기능들이 많더라구요!! (클래스,오버로딩,제네릭이나 여러가지 유틸 타입들)
• 이런 기능들도 따로 공부하는게 좋을까요?
• 아니면 개발하다가 필요 한 상황이 생겼을 때 찾아서 적용할 수 있는 정도면 될까요?
• A) typescript 도 따로 공부하는거 물론 좋은데, 시간이 한정되어 있단 사실. 선택과 집중 필요. 현재 개발하면서 부딪히는 상황에서 그때그때 공부하는것도 좋음. 만약 여유가 된다면 https://github.com/type-challenges/type-challenges 여기서 공부하는것도 좋다.

• 멘토님은 알고리즘 (코테) 스터디를 해보신 적 있으신가요??
• 만약 있으시다면 어떤 방식으로 하셨는지 궁금합니다!
• 효과적인 코테 스터디 방식이 있다면 조언 부탁드립니다!
• A) 학부 / 이직 준비하면서 코테를 준비한 적이 있습니다. 개인적으로 경험이 좋았던 방식은 같은 문제를 여러명이 풀어와서 서로의 해답을 비교해보는것. 그리고 자료구조를 배우고 해당 자료구조를 활용할 수 있는 문제를 푸는 것이 문제 유형과 보다 쉽게 풀어 자신감 올리는데 도움이 됐어요.

• 리팩토링 관련
• 제가 사이드플젝에서 처음으로 react-query를 사용해보게 되었는데요..!
• 처음이라 사용법이 미숙하기도 했고, react-query를 아예 사용하지 않은 팀원도 있어서 전체적으로 api 관련 코드들이 중구난방이 되었습니다 ㅠㅠ
• 리팩토링으로 보완하고는 싶은데 팀원들 없이 혼자서 하게될 것 같습니다.
• 혼자서 리팩토링한다면 제가 다른 팀원 코드까지 react-query로 통일시키는게 좋을까요? 😭
• A) 질문의 의도 ⇒ 다른 사람과 협업하는 프로젝트에서 api 연동 방식이 중구난방이면 평가자가 보았을 때 안 좋지 않을까.. 라는 우려가 있었음. 일단은 이 부분은 괜찮다 why? 기술 도입 자체가 합의가 되야하기 때문에 합의되지 않아서 도입하지 않은 걸 가지고 뭐라 할 사람 없음. 일단 스스로 학습 & 경험 차원에서 리팩토링 하는 것 자체는 좋은 것 같다. 합의를 잘 해서 리팩토링 해보면 좋겠다.

• 협업을 할 때 백엔드가 어떻게 돌아가는지 몰라서 곤란할 때가 있었습니다.
• 멘토님은 서버 개발을 공부해보신 적이 있으신가요?
• A) 전 JS를 공부하면서 Node.js 서버 프레임워크 Express를 다뤄보고 자연스레 서버쪽도 공부하게 되었어요. 첫 직장이 작은 스타트업이었는데 여기서 프론트/서버 둘 다 경험해본게 성장에 좋은 영향을 미쳤던 것 같아요.
• 백엔드 지식이 있으면 프론트엔드 개발자로서 유리할까요?
• A) 저는 유리하다고 생각해요. 그리고 기본적으로 프론트/백엔드 개발자로 나누는 것은 회사에서 리소스를 효율적으로 관리하기 위한 목적이고, 개발자는 ‘개발자’ 이기 때문에 영역 구분 없이 원한다면 다 할 수 있다고 생각해요.

• 지금까지 어떤 CSS 라이브러리/프레임워크를 사용해보셨나요??
• ex) Tailwind, css-in-js, 등등..
• 사용해보신 css 기술들의 장단점이 궁금합니다!
• 개인적으로 가장 좋아하시는 css 기술은 무엇인가요?
• A) 기본 css, style-components, emotion, css module, stitches, tailwindcss, vanilla-extract 등등.. css → 클래스 네임이 글로벌하게 적용되네? scoped css가 필요하겠다 → styled-components, emotion → 런타임에서 오버헤드가 많네.. 번들도 크고. 빌드타임에 클래스 다 생성해낼 수 없나? → css module, stitches, tailwindcss(JIT), vanilla-extract
• A) 가장 좋아하는 건 css module. Vue를 사용할 때 css module을 사용했는데 경험이 되게 좋았다.

하송희

• (다윤님의 질문과 동일합니당) 코딩테스트 스터디를 효율적으로 진행할 수 있는 방법이 궁금합니다 !.!

• 프론트엔드 개발자도 피그마를 수준급으로 다룰 수 있어야할까요? 아니면 기초정도 수준만 알아도 될까요..? (대충 원하는 디자인을 그리는 정도)