Q&A 정리

Q1. env 배포서버에서 못 읽는 이슈, 문제 원인을 어디로 좁힐 수 있을까요? [트리]

• 첫번째 sass 환경의 env 잘 읽고 있는가
• webpack에서 console.log()

• 브라우저환경과 node환경의 차이 인지할 것
• node > 브라우저
• console.log()

Q2. ducksPattern 사용시 constants나 간단한 util함수의 위치는 어디가 좋을까요? [트리]

Q3. 폴더 구조

• 크게 두가지 폴더구조
• 기능별, 도메인별

• 도메인별
• 웹뷰의 경우, 화면크기의 제약으로 데이터양이 적어 재사용성이 조금 적다 > 도메인별 적합

• 기능별 대표사례
• admin
• 재사용성이 굉장히 큰 경우

• 현재 우리는 도메인별 중에서도 페이지별 구분
• 개발은 P처럼 가져가는 것이 조금 더 좋다.
• 지금은 가고, 문제상황이 심화/인지 되었을 때, 고려해서 그때 해결
• 지금은 맞고, 나중은 틀리다. 항상 염두할 것!

• 폴더구조는 글 읽기와 같다.
• 서비스는 한 권은 책과 같다.
• 이 repo를 읽는 사람의 입장에서 생각해보기
• src 진입 전과 진입 후는 집중 관심사가 아예 다르다.
• 진입 전: 서비스 세팅
• 진입 후: 서비스 세팅 상관 없이 진짜 서비스 관련 코드
• 다른 사람과 협업하며,다른 사람에게 어떻게 읽혀보나 보며 고민을 많이 해보고 많이 고쳐볼 것!
 

• StyledComponent 분리 필요한가?
• type > 로직 > style 으로 나누어져있다.
• 현재 작업자가 여러명이 아니기 때문에, 동시작업으로 인한 conflict 적다.
• 충분히 흐름에 따라 코드를 읽는 것 가능. 여러 폴더를 이동하지 않아도 되는 장점
• why라는 고민이 항상 중심이 되어야 함
 
 

Q4. React-Hook-Form 관련 질문

• 복잡도가 높은 경우에는 Context를 통해 내부에 숨기는 것이 용이
• react-hook-form dependency가 높음
• 이미지
• 복잡도를 어느 곳에다 위임하는 것이 좋은가? 에 포인트를 두고 고민해볼 것
 
 

Q5. zenhub 사용시 epic 구분/범위

• 어떤 조직이냐에 따라 다르다
• 목적조직이냐 아니냐
• 프론트엔드팀 / 디자인팀 / 백엔드팀 > 따로한다.
• 목적조적: 공구서비스 / 모임팀 > 합쳐서한다.
 
 

Q6. 인증/인가 정석 프로세스는?

• [궁금/의문]
• 현업에서의 개발편의성과 보안과의 타협을 어느정도 하는지?
• accessToken의 선호 저장 위치는 어떠한가요?
• localStorage 저장, cookie 저장, 전역상태 저장
 
• 회사 도메인 마다 조금씩 다르지만, 뱅샐 ⇒ 변수에도 저장하지 않음, 당근 ⇒ 로컬스토리지 저장
• 피해빈도, 어뷰징 리스크 등을 고려/타협을 통해 진행
• 위험할 수록 서버에서 관리하도록
 
 

Q7. 백엔드와의 소통을 할 때, 어떤 문서를 중심으로 소통하나요?

• 문서화에 관련 된 부분
• 슬랙과 노션의 차이
 
• 오버커뮤니케이션의 중요성
• 더블체크의 중요성 (혹시나 해서 물어볼게)
 
• 목표와 목표로하는 것이 아닌 것을 처음에 꼭 명시할 것!!
 
• 프로덕트 스펙(유저스토리)
• 보통 프론트가 하는 것이, 서로 협업의 장점이 있다.
• 노션의 경우 동기화 최대한 활용
 
• OAS를 이용한 코드 문서화 방법도 있다.
• code로 문서를 자동화 시키는 것
• output으로 API 생성하는 이슈
 

Q8. password를 서버로 보낼 때 암호화해서 보내나?

• input password도 결국 코드로 확인가능하다.

• 보통 프론트에서는 크게 관리하지 않지만, 필요하다면 암호화를 해서 사용

Q9. 공통 컴포넌트 개발 시 유의사항

• 나만의 용어 사용하지 않는 것
• checked → selected

• …props 넘겨주어 확장성 가질 수 있도록 하는 것