COMMIT.chat
View Bookmarks
react 썸네일react

2023-11-30

목차

  1. 개발자 퇴사와 커리어 변화 이야기
  2. IT 업계 연봉과 워라밸 토론
  3. React 관련 기술 공유 및 질문
  4. 모달 상태 관리 이슈와 해결책
  5. Next.js getServerSideProps 캐싱 관련 질문
  6. 개발자 면접 준비 및 포트폴리오 설명 전략
  7. API 에러 코드 문서화와 Swagger/Redoc
  8. CSS 및 Frontend 스타일링 관련 이야기
  9. 상태 관리, Context API 사용법과 학습 팁
  10. 커뮤니티 내 소소한 기술 잡담 및 장비 자랑

1. 개발자 퇴사와 커리어 변화 이야기

  • 한 개발자가 퇴사를 알리고 팀원들이 각자 반응을 나눔.
  • 퇴사 당일에도 업무 마무리, 카톡 대화, 소소한 일화가 오감.
  • 퇴사 후 취업준비에 대한 걱정과 계획 공유.
  • 퇴사 시 챙겨야 할 것(키보드 등 개인 장비)이나 회사 흔적 문제 논의.
    • 회사 장비(예: 노트북)는 반납해야 하며 개인 소유장비인지 확인 필수.
  • 면접 준비, 경력증명서, 경력 관리 필요성 언급.

2. IT 업계 연봉과 워라밸 토론

  • 연봉대화 중심: 신입/중고신입/경력직 간 임금 차이 토론.
    • 신입은 경험이 적지만 바로 투입 가능한 점을 어필할 수 있음.
    • 중고신입은 3~5년 경력이나 기업 이직용 신입으로 간주.
    • 연봉 2900~3500 수준의 신입 사례 공유, 일부는 2400대 박봉도.
  • 워라밸 중요성 강조: 주말 휴식, 야근 없는 환경 선호.
  • 건강관리: 오메가3, 종합비타민, 루테인 추천 → 모니터 작업으로 눈 보호 필요.
  • 현실적인 취업난과 이직 고민이 반영됨.

3. React 관련 기술 공유 및 질문

  • React 기본, React Native(RN) 관계 및 학습 방향 논의.
  • PWA(Progressive Web App) 사용 경험과 한계점:
    • PWA는 웹을 앱처럼 만드는 기술이지만 접근성 문제로 현실 사용에 어려움 존재.
  • React 프로젝트에서 CSS/스타일 문제 토론:
    • 폰트 굵기 이슈는 전역 스타일, font-weight, font-face 선언 문제 가능.
  • "Props drilling" 문제와 Context API 논의:
    • Props drilling이 많아지면 관리 어려워 컨텍스트, 전역 상태관리가 필요.
    • 공부 순서: props → Context API → 전역 상태관리 라이브러리 추천.
  • Closure(클로저), 렉시컬 스코프 등 JS 핵심 개념 공부법 공유:
    • 실행 컨텍스트 및 클로저는 자바스크립트 동작 원리 이해에 필수.
    • 그림을 그려보며 이해하는 학습법 추천.

4. 모달 상태 관리 이슈와 해결책

  • 모달 컴포넌트에서 외부 상태를 props로 전달 시 발생하는 "값 싱크" 문제.
    • 모달이 열릴 때 상태를 내부에 저장해 이후 업데이트가 어려움.
    • 해결책: 모달 내에서 상태 관리 후 필요한 값을 콜백함수로 부모에 전달하는 패턴이 권장됨.
  • 비슷한 문제는 Toss slash, Mantine modals 등 라이브러리에도 존재.
  • 모달 상태 동기화 문제는 구조적 한계가 있어 설계 시 주의 필요.

5. Next.js getServerSideProps 캐싱 관련 질문

  • getServerSideProps 내 API 요청 결과 캐싱 가능 여부 문의.
  • getStaticProps는 사용할 수 없는 상황에서 서버사이드 리렌더링 캐싱 필요.
  • 서버 배포 환경(AWS EC2 등)에 포함된 캐싱 전략 논의.
  • AWS에서 캐싱하려면 서버 미들웨어 혹은 엣지 캐시 구현 검토가 필요.

6. 개발자 면접 준비 및 포트폴리오 설명 전략

  • 면접 시 포트폴리오 설명을 간단하게 할지, 자세히 할지는 상황에 따라 다름.
    • 기본적으로 간단히 설명하되 면접관이 관심을 보이면 깊게 다루기.
  • ReadMe 파일에 질문 유도할 키워드를 strategically 삽입하면 유리.
  • 면접 질문은 주로 경력, 퇴사 사유, 기술 질문, 인성 질문 순.
  • 10년 후 자신의 모습, 성장 계획 등의 내면적 질문도 빈번.
  • 면접관 질문에 집중하고 '주절주절'하지 않는 게 좋음.
  • 취업 스트레스, 반복되는 면접 질문에 대한 공감과 조언 공유.

7. API 에러 코드 문서화와 Swagger/Redoc

  • 백엔드 에러코드 문서화 수준과 난이도에 대한 고민.
  • 도메인별 에러 코드 정리만 되어 프론트에선 정확한 대응 어려움.
  • 유지보수 이유로 에러 코드 문서화가 축소되는 문제 발생.
  • Swagger(OpenAPI)와 Redoc 도구 소개:
    • Swagger는 API 문서화 및 테스트 자동화 도구.
    • Redoc은 Swagger 문서를 보기 쉽도록 렌더링해주는 도구.
  • 문서화는 자체가 API 스펙이므로 꼭 필요하나 현실적 난관 존재.

8. CSS 및 Frontend 스타일링 관련 이야기

  • CSS로 화면 너비에 따라 유동적으로 굴곡진 이미지를 구현하는 방법:
    • SVG, 배경 이미지, Border-radius 조합 등이 대안.
  • 일반 퍼블리싱(Static HTML/CSS) → React 컴포넌트 전환 시 작업 난이도.
    • BEM(Block Element Modifier) 네이밍 기법 사용 권장.
    • 컴포넌트화 과정에서 props 매핑이 쉬워짐.
  • 폰트 스타일 문제 발생 시 폰트 파일, font-weight, 글로벌 CSS 설정 확인 필요.
  • Styled Component, Tailwind CSS, 바닐라 CSS 등 스타일링 라이브러리 선택에 관한 짧은 토론.

9. 상태 관리, Context API 사용법과 학습 팁

  • 상태 공유가 필요한 컴포넌트끼리는 Props drilling이나 Context API 선택.
  • 상황에 따라 페이지 단위 Provider 설정 추천.
  • 컨텍스트 남발은 피하고, 적절한 단위에서 사용하는 게 바람직.
  • 전역 상태 라이브러리는 Props와 Context API 학습 후 단계적으로 도입.
  • React Hooks 개념과 Custom Hook 작성 경험 공유.
  • 클로저, IIFE 등 자바스크립트 고급 개념 섭렵 중요.

10. 커뮤니티 내 소소한 기술 잡담 및 장비 자랑

  • 키보드, 마우스 등 개발 장비에 대한 관심과 자랑.
  • 로지텍, Nuphy Air75 등 다양한 고급 장비 소개.
  • 집에서 작업 환경, 네트워크 속도 자랑.
  • 개발 중 다이어트, 운동, 건강 관리 관련 대화.
  • 코딩 스트레스 해소를 위한 드립과 유머가 활발.

면접팁⚡

  • 포트폴리오는 간단명료하게 준비하되 면접관 질문에 따라 깊게 설명하기.
  • ReadMe 파일에 질문 끌어낼 키워드를 전략적으로 배치.
  • 직무와 관련된 상황별 구체적 경험을 말하면 좋음.
  • 반복적인 기술질문 대신 면접 중 관심 가는 부분에 집중해서 설명할 것.
  • 면접 전 예상 질문과 답변을 준비해 충분히 연습하자.

링크🔗

#퇴사#연봉#워라밸#React#NextJS#상태관리#면접준비#API문서화#CSS#개발자커뮤니티
이전 포스트

2023-11-29

2023년 11월 29일
다음 포스트

2023-12-01

2023년 12월 1일