react 썸네일react

2023-10-17

목차

  1. 이력서 작성 팁과 취업 전략
  2. 타입스크립트 ES 모듈과 확장자 문제
  3. Node.js 버전 관리 및 프로젝트 공존 방법
  4. 도커와 배포 환경 활용
  5. React 개발 관련 질문 및 상태관리
  6. 타입스크립트 타입 변환 및 API 응답 처리
  7. 연봉 협상과 복지 정책 이해
  8. 코드 작성 습관과 클린 코드 방향성
  9. iOS 앱 개발과 macOS 환경 필요성
  10. 프로젝트 배포 시 새로고침과 캐싱 문제

1. 이력서 작성 팁과 취업 전략 🎯

  • 핵심
    개발 이력서에서 단순 기술 나열보단 '문제 발견 → 해결 과정 → 결과'의 서사를 명확히 쓰는 것이 중요함.

  • 설명

    • 이력서 작성 시 자신이 시도한 프로젝트나 경험을 구체적 스토리로 풀어내면 평가자의 관심도 높아짐.
    • 흔히 실력 부족보다 '평범함'이 탈락 사유로 더 많이 꼽힘.
    • 회사는 '일손'이 아닌 '비즈니스를 실현할 사람'을 원함을 어필할 것.
    • 지원동기보단 능력과 경력, 포트폴리오에서 직무 만족도와 진정성을 드러내야 함.
    • 평가자는 개인 노력보다 검증 가능한 결과와 증명을 더 신뢰함.
  • 의견

    • 역량 표현은 구체적 목표(A), 경험(B,C), 회사 기여(D), 앞으로의 계획과 회사에서 얻을 점을 함께 어필하는 구조로 작성하라.
    • 막연한 개발 문화나 워라밸 추구만 강조하면 불리함.

2. 타입스크립트 ES 모듈과 확장자 문제 📁

  • 핵심 이슈
    import 구문에서 .js 확장자 명시 여부에 따라 브라우저가 모듈을 찾지 못하는 문제 발생.

  • 설명

    • ES모듈(ESM) 규칙상 웹 환경에서는 상대경로 import 시 확장자를 반드시 명시해야 찾을 수 있음.
    • TS 컴파일 후 .js 확장자가 자동으로 붙지 않아, 직접 .js를 써야 정상 로딩됨.
    • Node.js는 버전에 따라 다르지만 18버전 이상부터 ESM 지원이 정식화되어 있어 환경별 차이가 있음.
  • 해결 팁

    • tsconfig.json에서 확장자 붙이는 옵션을 활용하거나, 빌드 후 import 경로를 명시적으로 수정해야 함.

3. Node.js 버전 관리 및 프로젝트 공존 방법 🟢

  • 대화 내용

    • 한 시스템에서 Node 12 이하와 18 이상 버전을 동시에 관리하는 게 까다로움.
    • 동시에 실행은 도커 없이 거의 불가능하며, 보통 프로젝트별로 버전을 맞춰 마이그레이션 권장.
  • 설명

    • nvm(Node Version Manager)으로 프로젝트별 Node 버전 전환 가능하지만, npm 호환성 문제 주의.
    • 빌드 오류 및 라이브러리 의존성에 따라 적정 버전 선정 필요.
    • 도커를 쓰면 각각의 컨테이너에서 별도 Node 환경 구성이 가능해 편리함.
  • 조언

    • 신규 프로젝트는 최신 Node.js 버전으로 맞추는 게 권장됨.
    • 개인 프로젝트와 회사 프로젝트가 다를 경우 도커 또는 nvm 조합으로 환경 분리.

4. 도커와 배포 환경 활용 🐳

  • 주요 내용

    • 도커는 직접 배포를 하면서 장애 대응 경험이 있을 때 필요성을 실감하게 됨.
    • Vercel 등 서비스형 플랫폼도 있지만, 도커만의 이점은 환경 일관성, 복잡한 서비스 의존성 관리임.
  • 설명

    • 도커는 애플리케이션 및 필요한 라이브러리를 컨테이너화해 환경 문제를 줄임.
    • 배포 자동화, CI/CD 파이프라인 연동에 유리.
  • 의견

    • 개발 중에는 도커가 부담스러울 수 있으나, 배포 및 운영 단계에서 장애를 줄이려면 익히는 게 좋음.

5. React 개발 관련 질문 및 상태관리 ⚛️

  • 전역 상태관리

    • 로그인 정보 외에 전역 상태관리가 필요한 상황은 제한적임.
    • 대부분 useState, Context API, 또는 복잡한 경우 Redux 사용.
    • 전역 상태를 가볍게 또는 복잡하게 사용할지는 프로젝트 스케일과 요구에 따라 다름.
  • contentEditable 컴포넌트 문제

    • React에서 contentEditable을 controlled 컴포넌트로 사용 시 커서 위치가 앞쪽으로 가거나 중복 입력 이슈 발생 가능.
    • 한글 입력에서는 isComposing 이벤트를 체크해야 정상 동작 보장.
    • 비제어 컴포넌트 방식이 대안일 수 있음.

6. 타입스크립트 타입 변환 및 API 응답 처리 🔄

  • 타입 변환 어려움

    • JSON 응답을 타입스크립트 타입 인스턴스로 안전하게 변환하는 건 쉽지 않음.
    • 런타임에 타입 체크는 불가능하며, 컴파일 타임 타입 체킹과는 분리됨.
  • 해결 방법

    • API 응답 형태를 타입 정의로 작성하고, 필요 시 검증 라이브러리(typia 등) 사용.
    • 컴파일 타임에 API를 직접 호출하고 리턴 타입을 자동 생성하는 코드제너레이터 활용 가능.
  • 날짜 변환

    • UNIX timestamp는 1970년 1월 1일 이후 경과한 초 또는 밀리초 단위 숫자임.
    • 초 단위라면 date * 1000 으로 밀리초 변환 후 new Date() 생성.
    • 밀리초 단위면 바로 new Date(timestamp) 가능.

7. 연봉 협상과 복지 정책 이해 💰

  • 연봉 인상 기대

    • 3년차 이직 시 보통 10%~20% 인상 예상.
    • 단, 연봉 외 복지(식대, 복지포인트 등)를 함께 고려해야 함.
  • 복지비와 식대

    • 복지비와 식대는 급여명세서 상 분류가 다름.
    • 식대는 비과세 한도 내에서 회사에서 제공 가능하며, 세금 혜택이 있음.
    • 식권대장으로 주는 경우도 있으나 총 지급액 산정에 유의할 것.
    • 식대가 급여에 포함되어 있을 경우 세금 계산에 차이가 있으므로 꼼꼼히 확인 필요.
  • 조언

    • 연봉만 비교하기보다는 전체 복지와 조건을 복합적으로 검토할 것.

8. 코드 작성 습관과 클린 코드 방향성 ✍️

  • Truthy/Falsy 조건 사용

    • if (!a) 와 if (a === 0) 은 의미가 다름. 둘을 혼용하면 의도와 다른 결과 초래 가능.
    • 가독성을 위해 조건이 길어질 땐 별도 함수로 분리 추천.
  • 조기 리턴 (Early Return) 패턴

    • 복잡한 조건문 대신 초반에 조건 체크 후 리턴하면 코드 가독성 증가.
    • 특히 중첩 if, switch 구문 복잡성을 줄일 때 유용.
  • switch vs 객체 매핑

    • switch-case구문 대신, 키-값 객체를 활용해 값을 매핑하는 방법 권장 (e.g. const cases = {a:10, b:20}; const value = cases[key];).
    • 이는 변수를 재할당하지 않고도 간결하게 처리 가능.
  • 삼항 연산자 중첩 주의

    • 간단한 조건에는 삼항 사용 가능하지만, 중첩 삼항은 가독성 저하로 권장되지 않음.

9. iOS 앱 개발과 macOS 환경 필요성 🍎

  • 맥북 필요성

    • iOS 앱 개발과 빌드는 macOS 환경이 필수임.
    • Xcode가 macOS 전용 IDE이기 때문.
  • 대안

    • 맥북 또는 맥 미니 중고 구입.
    • AWS EC2 Mac 인스턴스 대여를 통한 클라우드 빌드 가능.
    • Github Actions 같은 CI/CD 파이프라인에서 macOS 빌드 환경 적용 가능.
  • 참고

    • 개발은 어느 OS에서나 가능하나, 빌드 및 배포에는 macOS 권장.
    • ios 개발자 등록비(매년 약 10만원)도 고려 필요.

10. 프로젝트 배포 시 새로고침과 캐싱 문제 🔄

  • 문제

    • 배포 후 기존 사용자는 새로운 버전 파일이 캐시되어 새 기능이 바로 반영되지 않고 새로고침 필요.
  • 해결 방법

    • 서비스 워커를 활용해 배포 버전을 체크 후 자동 새로고침 또는 알림 배너 제공.
    • 강제로 캐시 무효화 정책 적용.
    • 사용자를 강제로 접속 차단하거나 새로고침 유도하는 사례도 있음(게임 등).
  • 참고

    • SPA 배포 시 사용자 경험을 위해 버전 관리와 캐싱 전략 필수.

면접팁⚡

  • 이력서에서 ‘나’가 어떻게 문제를 발견했고, 해결했는지 구체적인 기술 서사 작성.
  • 지원동기에 너무 일반적 문구 넣기보다 지원 회사의 비즈니스 이해와 내 역할 가능성 어필.
  • 자신의 약점도 숨기지 말고, 어떻게 극복하려고 하는지 설명하기.
  • 면접 중 모르는 질문은 솔직하게 모른다고 하고, 유추되는 부분 설명하거나 관련 지식을 연결해서 답변할 것.
  • 과도한 책임을 지지 말고, 본인이 집중한 부분 위주로 이야기하라.

링크🔗

#이력서#타입스크립트#Nodejs#React#도커#iOS개발#취업전략#연봉협상#코딩습관#배포