react 썸네일react

2024-07-11

목차

  1. 차트 데이터 복구 실수와 HTS 투자 설정
  2. 개발 서버 환경 및 운영 이슈 경험 공유
  3. SVG 아이콘 관리 및 컴포넌트화 전략
  4. 서버 보안 사고와 대응 사례
  5. 훅(Hook) 사용 경험과 성능 최적화
  6. 애플 생태계 연결성 및 키보드 관련 팁
  7. 무선 이어폰/버즈 사용자 후기와 선택 팁
  8. 맥북 클램쉘 모드 사용 경험과 장단점
  9. 개발자 및 인프라 환경에서 겪은 다양한 에피소드
  10. 노하우 공유 및 커뮤니티 소소한 잡담

1. 차트 데이터 복구 실수와 HTS 투자 설정

  • HTS(홈트레이딩시스템) 설정을 며칠간 빡세게 맞춤.
  • 영웅문 프로그램에서 ESC 누르다 차트가 닫히고 저장 안한 상태라 복구 불가 상황 발생.
  • 주기적 저장 습관과 백업 필요성 대두.
  • 실시간 금융 차트 데이터는 저장하지 않으면 복구가 어려움.

2. 개발 서버 환경 및 운영 이슈 경험 공유

  • 로컬, 개발(dev), 스테이징(stg), 프로덕션(prod) 서버 분리 중요성 강조.
  • 다수 협업 시 서버 하나만 사용하는 건 큰 문제: 테스트 서버 부재 사례 공유.
  • 테스트 서버가 없으면 코드 안정성 및 배포 안전성 보장 어려움.
  • 실제 사례로 6명의 백엔드 개발자가 단일 메인서버만 운영해 회사가 실패한 사례 언급.

기술 설명:

  • 개발 환경 분리 : 로컬(local)에서 작업 → 스테이징에서 테스트 → 프로덕션에서 배포
  • 각각의 환경에서 버그를 미리 발견하고 실제 서비스 중단 방지
  • ngrok 등의 툴을 이용해 로컬서버를 외부에 공개하는 경우도 있으나 한계 존재

3. SVG 아이콘 관리 및 컴포넌트화 전략

  • SVG를 파일로 관리할지, 코드형 컴포넌트로 만들지에 대한 토론.
  • 코드로 SVG 컴포넌트화하면 색상 변경이나 hover 효과 주기 용이.
  • 파일로 정적 보관하면 색상 변경 시 필터 처리 등 불편함 발생.
  • svgr 등 라이브러리를 활용하면 코드 형태로 자동 변환 가능.
  • fill="currentColor" 속성 활용 시 아이콘 색상을 텍스트 컬러처럼 쉽게 변경 가능.

초보자 설명

  • SVG (Scalable Vector Graphics) : 크기 조절해도 선명한 벡터 형식의 이미지
  • 컴포넌트화 : React 등에서 재사용이 쉽고, 스타일 변경 편리

4. 서버 보안 사고와 대응 사례

  • 보안 키를 실수로 깃허브(GitHub)에 올리는 사고 발생 → 서버가 해킹당해 코인채굴 악용, 비용 폭탄 (8천만원 청구)
  • AWS 대응 빠르나 서비스 복구에 2~3일 소요됨
  • 람다(Lambda) 권한 설정 오류로 전체 서비스 중단 사례
  • 베스쳔(bastion) 서버 다운으로 3주간 DB 접속 문제 발생
  • 중요한 키 관리는 절대 공개 저장소에 올리지 말 것, 비밀 환경변수(secrets) 관리 철저 필수

기술 설명

  • 람다(Lambda) : AWS에서 제공하는 서버리스 함수 실행 서비스
  • 베스쳔 서버 : 내부망과 외부망을 연결하는 보안용 서버
  • 환경변수의 비밀 관리 : GitHub Secrets 등 안전하게 저장하기 위해 별도 관리 도구 사용

5. 훅(Hook) 사용 경험과 성능 최적화

  • React 훅은 재사용과 관심사 분리에 효과적임.
  • 큰 컴포넌트 내부 로직을 훅으로 분리해도 렌더링 성능 이슈는 동일할 수 있음.
  • UI(JSX) 분리 및 필요한 부분만 리렌더링 되도록 최적화 필요.
  • 훅 제작 시 재사용성 및 성능 영향 고려하며 작성 권장.

6. 애플 생태계 연결성 및 키보드 관련 팁

  • 에어팟 등 애플 악세사리들은 애플 기기 간 연동성 탁월함.
  • 맥용 키보드는 볼륨 조절키가 다르게 배치되어 있어 매핑 확인 필요.
  • 맥에서 fn 키와 기능키(F11 등)를 함께 눌러야 볼륨 조절 되는 키보드도 많음.
  • 윈도우용 키보드에 커맨드(⌘) 키가 표기되어도 맥에서 정상 동작함.
  • 키보드 스위치 버튼은 편의성을 위한 표시이며 기능과 직접 관계없음.

7. 무선 이어폰/버즈 사용자 후기와 선택 팁

  • 갤럭시 버즈, 에어팟 등 커널형 노이즈캔슬링 제품이 인기
  • 골전도 이어폰은 착용감이 좋아 나이드신 분들 위주로 사용
  • 음질은 고가 제품이 조금 더 우수하지만, 편의성과 생태계 연동성도 중요
  • 커널형 이어폰은 폼팁(이어폰 팁) 교체로 착용감 및 차음성 개선 가능
  • 무선 이어폰 분실 방지를 위해 착용감 좋은 모델 선택 권장

8. 맥북 클램쉘 모드 사용 경험과 장단점

  • 클램쉘 모드는 맥북 덮개를 닫고 외부 모니터와 키보드, 마우스를 이용하는 환경
  • 큰 모니터 사용 시 작업 공간 확장에 유리
  • 볼륨 조절 등 일부 기능 키가 외부 키보드와 달라 불편할 수 있음
  • 발열 문제 우려되나 개인별 체감은 다양함
  • 집이나 사무실에서 다중 모니터 환경에 적합한 사용법

9. 개발자 및 인프라 환경에서 겪은 다양한 에피소드

  • 빌드 오류가 과거부터 계속되는 문제로 고생하다가 결국 성공한 경험
  • 서버 운영 이슈로 3주간 배포 불가 상태, 비용과 인력 낭비 사례
  • 인프라 담당자 여러 명이 붙어도 문제 원인을 찾기 어려운 경우가 있음
  • 보안 문제로 인해 배포 중지와 복구 지연 발생
  • 협업 시 브랜치 관리가 중요하며, 없는 회사는 위험함

10. 노하우 공유 및 커뮤니티 소소한 잡담

  • 투자관련 강의, 리액트방 환영 인사 등 친근한 대화
  • 폰트 추천(consolas), 운동시 이어폰, 개발 외 잡담도 섞임
  • Youtube CM, 쇼츠 링크 공유하며 여가시간 활용 이야기
  • 기술면접 대비 질문은 별로 등장하지 않았음

면접팁⚡

  • 서버 운영과 인프라 관리 경험 질문 : 테스트·스테이징 서버 사용 경험과 보안사고 대응 사례 준비 필수
  • React 훅과 성능 최적화 : 훅의 역할과 리렌더링 최적화 방법에 대해 설명할 수 있어야 함
  • SVG와 UI 컴포넌트화 이해도 : UI 아이콘 관리 방법과 효율적인 스타일링 전략 질문 예상
  • AWS 람다, 베스쳔 서버 등 클라우드 운영 경험 : 갑작스런 장애 발생 시 원인 분석과 대응 프로세스 설명 준비

링크🔗

#서버보안#개발서버#SVG아이콘##맥북클램쉘#무선이어폰#HTS투자#개발노하우#개발팁#개발환경