react 썸네일react

2025-04-21

목차

  1. 아침 인사와 출근길 이야기
  2. 노트북 사이즈와 작업 환경
  3. 해외 여행 및 프리랜서 근황
  4. AI와 자동화 관련 농담과 의견
  5. VSCode 자동완성 설정 이슈
  6. 수학적 경로 계산 질문과 답변
  7. PG사 결제 연동과 수수료 구조
  8. 리액트 로그 수집 및 분석 방법
  9. 타입스크립트, 협업과 생산성 향상
  10. 개발 도구 메모리 사용과 최적화 팁

1. 아침 인사와 출근길 이야기

  • 아침에 출근하며 운동 성과 공유: 로잉머신 1km, 스쿼트 100개 완료 축하
  • 여러 명이 출근 중임을 알림, 출근길 포스팅 예정이라며 분주한 시작
  • 출근길의 다양한 기분과 날씨 이야기도 등장

2. 노트북 사이즈와 작업 환경

  • 작업에 사용하는 노트북은 16인치가 주로 등장
  • 작업 환경은 학교, 사무실, 외부 등 다양함
  • 사무실은 에어컨 때문에 춥고, 외부는 더울 수 있음에 유의

3. 해외 여행 및 프리랜서 근황

  • 스위스 여행 후 프리랜서 활동 중인 개발자 근황
  • 블로그 링크를 통해 a2a 클라이언트 만드는 방법 공유(별도 링크 참고)

4. AI와 자동화 관련 농담과 의견

  • AI를 팀원 혹은 노동자로 쓰자는 농담 많이 등장
  • AI가 못하는 집안일에 관한 유머도 오감각
  • 개발자 사이에서는 AI가 일자리를 얼마나 대체할지에 대한 가벼운 토론 존재

5. VSCode 자동완성 설정 이슈

  • VSCode에서 Copilot 기능 관련 단축키가 바뀌어 헷갈리는 문제 발생
  • 해결 방법: 단축키맵을 사용자가 원하는 대로 변경 가능
  • 이전 설정이 기억나지 않으면 실행 기록이나 기본 단축키 참고 권장

6. 수학적 경로 계산 질문과 답변

  • 외곽으로 돌아가는 길과 대각선으로 가는 길, 어느 쪽이 빠른가? 궁금증
  • 맨해튼 거리(격자형 거리) 개념 언급, 수학적으로 두 경로가 동일하다는 답변
  • 실제 길이 계산과 상황에 맞춰 판단해야 하며, 차량 신호나 횡단 보도 대기 시간도 고려할 필요 있음

맨해튼 거리란?
격자 모양의 도심에서 두 점 사이의 거리를 계산할 때 가로와 세로 이동 거리의 합으로 계산하는 방식

7. PG사 결제 연동과 수수료 구조

  • PG사(Payment Gateway) 결제 연동 시 테스트 API 제공되어 실제 결제 전 비용 발생하지 않음
  • 결제 성공 후 수수료가 발생하며 보통 2~5% 수준
  • 수수료는 결제 대행사가 가져가며, 이는 운영 비용 및 서비스 유지비용으로 이해하면 됨

8. 리액트 로그 수집 및 분석 방법

  • 로그 수집 목적 다양: 방문자 경로, 버튼 클릭수, 오류 추적 등
  • 개발 중에는 콘솔 로그 유용하지만 운영 환경에선 에러 추적 도구 사용 권장
  • 관련 툴이나 라이브러리로는 Sentry, LogRocket 등이 있으며, 커스텀 로그 관리 방법도 이야기됨

9. 타입스크립트, 협업과 생산성 향상

  • 타입스크립트를 점점 더 선호하는 추세
  • 타입 안정성으로 버그 줄이고, 인텔리센스 같은 개발 편의 기능 지원
  • 특히 협업하는 프로젝트에서 코드 품질 관리에 큰 도움 됨

10. 개발 도구 메모리 사용과 최적화 팁

  • 맥북 등 최신 기기에서 IDE와 브라우저의 메모리 점유율 높음을 자주 경험
  • 메모리 캐시, 백그라운드 프로세스 등 복합 요인 존재
  • 활성 상태 보기, 불필요한 프로세스 종료, 캐시 클리어 등의 방법 사용 가능
  • 런캣(RunCat)처럼 메모리 사용 상태 모니터링 앱도 참고하며 관리 필요

면접팁⚡

  • PG사 결제 연동 관련 질문 대비
    • 결제 연동 시 테스트 API와 실제 결제 시 수수료 발생의 차이 명확히 설명하기
    • 결제 수수료가 왜 발생하는지, PG사의 역할 이해하고 설명할 것
  • 프론트엔드 상태 관리 경험
    • 서버 상태와 클라이언트 상태 분리 관리 이유 및 방법 이해
    • React Query, 커스텀 훅 활용 사례 공유하면 좋음
  • 코드 자동완성 및 개발 생산성 도구 활용
    • VSCode 단축키 커스터마이징 경험과 자동완성 도구 활용 팁 준비

링크🔗

#프론트엔드#리액트#타입스크립트#PG사결제#VSCode#자동완성#AI#개발환경#수학적문제#로그분석