목차
- 리믹스(Remix) action과 zustand 연동 고민
- 야구 이야기: 팬덤과 시즌 전망
- 코딩테스트 난제와 그래프/행렬 문제
- 조용한 키보드 추천과 개인 취향
- 비전프로와 휴가, 마이너스 연차 토론
- React 클린 코드 및 커스텀 훅 활용법
- Tabulator 라이브러리 오류 및 해결법
- TailwindCSS 논쟁과 사용 경험
- Rust 언어 도입과 유지보수 이슈
- 회사 문화와 면접 이야기
Zustand #코딩테스트 #TailwindCSS #Rust #키보드추천 #개발자문화 #면접준비 #오픈소스
1. 리믹스(Remix) action과 zustand 연동 고민
- 질문: Remix의 action 함수로 JSON을 반환하고, useActionData로 받아온 데이터를 zustand 상태관리 라이브러리에 저장하고 싶음
- 이슈: 문법이나 데이터 흐름이 복잡해 보임
- 팁: action을 통해 데이터를 받고, useActionData 훅으로 받은 데이터를 컴포넌트 내부에서 zustand에 저장할 때는 적절한 useEffect 또는 이벤트 핸들링이 필요함
- 설명: Remix는 React 기반 풀스택 프레임워크로 action을 통해 서버에서 데이터를 처리 후 JSON 반환 가능하다. useActionData 훅으로 그 데이터를 클라이언트에서 받는데, zustand는 경량 상태관리 라이브러리로 전역 상태를 쉽게 관리 가능함. 두 개념 연동 시 동기화 타이밍과 훅 사용 위치에 유의해야 함
2. 야구 이야기: 팬덤과 시즌 전망
- 개발자들 사이에서 야구 팬덤 논쟁 활발
- 한화의 시즌 1위, 기아, 엘지 등 팀별 성적과 기대감 공유
- 야구장 좌석 배치와 응원 문화(팀별 구역, 친구끼리 응원 등) 소개
- 초보자도 쉽게 이해할 수 있도록 "코시"는 한국시리즈 우승 의미, "가을야구"는 플레이오프 참여 의미임
3. 코딩테스트 난제와 그래프/행렬 문제
- 코딩테스트가 어려워지는 추세, 특히 행렬과 그래프 문제에서 난관
- 행렬과 그래프 차이점: 행렬은 2차원 배열, 그래프는 노드와 간선 구조
- 쉬운 문제부터 점차 난이도 올리면서 기본 실력을 쌓는 전략 권장
- 팁: 문제를 이해하기 전에 너무 어려워하지 말고, 본질부터 접근
4. 조용한 키보드 추천과 개인 취향
- 사무실 환경에 적합한 조용한 기계식 키보드 스위치 추천: 오테뮤 피치, 라임 등
- 키보드 인식률 문제와 사용자 경험 공유
- 키보드가 잘 동작하지 않으면 업무 효율에 큰 영향 미침
- 기계식 키보드 소리가 싫은 사용자 고려 사항과 저소음 스위치 사용 권장
5. 비전프로와 휴가, 마이너스 연차 토론
- 애플 비전프로 사면 키보드/마우스 제공 이야기에 불만과 농담 섞임
- 연차 사용 방식에 관한 대화: 마이너스 연차(급히 사용하여 다음 월급에서 차감)와 디데이 산정법(휴가 첫날 포함 여부)
- 직장인 현실 공유로 공감대 형성
6. React 클린 코드 및 커스텀 훅 활용법
- React 특화 클린 코드 관련 책 추천 요청
- 커스텀 훅에서 반환한 함수를 부모와 자식 컴포넌트에서 중복 사용 시 import하는 것과 props로 전달하는 방법 간 토론
- 팁: 컴포넌트 깊이가 얕고 조건이 단순하면 props 전달, 복잡하면 전역 상태나 Context API 고려
- 클린 코드는 유지보수와 재사용성 향상에 중요함
7. Tabulator 라이브러리 오류 및 해결법
- Tabulator 테이블 라이브러리 사용 중 가끔 verticalFillMode가 null 참조 오류 발생
- 원인: DOM 또는 Tabulator 초기화 시점 문제
- 해결 팁: 오류 발생 코드를 setTimeout으로 후순위 실행하거나 DOM 로드 완료 확인 후 초기화
- Tabulator는 동적 표 생성에 강점이 있지만, 초기화 타이밍 잘 맞춰야 안정적임
8. TailwindCSS 논쟁과 사용 경험
- TailwindCSS 강한 호불호 존재: 빠른 개발 vs 클래스 이름 잔뜩 붙는 가독성 저하
- Tailwind v4 부터 tailwind.config.js/ts 파일 없어도 사용할 수 있고, CSS에서 바로 작성 가능한 방식도 지원
- 유지보수가 쉽지 않은 점 언급, 컴포넌트 단위 스타일링 필요성 강조
- 다양한 보조 라이브러리(cva, twin.macro 등) 등장, Tailwind의 스타일링 방식 이해가 중요
- 디자이너 협업 시 피그마 Anima 같은 플러그인으로 호환 가능
9. Rust 언어 도입과 유지보수 이슈
- 프론트엔드에서 Rust 사용 사례 공유 (이미지 밝기 조절 WASM 연동 등)
- Rust 도입 장점: 속도 향상
- 단점: 후임자가 Rust를 알아야 유지보수 가능
- Rust 학습과 실무 적용에 대한 현실적 고민 존재
- 결론: Rust는 특정 목적에 특화해 쓰고, 팀 역량에 맞게 도입 여부 결정해야 함
10. 회사 문화와 면접 이야기
- 회사 내 영어 이름, 닉네임 문화 논쟁 (친근함 vs 식상함)
- 일부 회사 반말 문화 및 독특한 분위기 토론
- 클래스101 관련 블라인드/잡플래닛 리뷰 공유, 직장 문화에 대한 현실적 조언
- 면접 준비 어려움, 서류 합격 사례 및 지원 팁 공유
- 면접에서 기술 질문 받았던 내용과 대처 경험 이야기
- 개발자 커뮤니티 내 케미와 인간적 소통 강조
면접팁 ⚡
- React에서 전역 상태 관리(zustand) 활용 시, 서버 action 데이터(fetch)와 클라이언트 상태 초기화 타이밍을 신중히 설계할 것
- 커스텀 훅에서 반환된 함수를 여러 컴포넌트에서 사용할 때, 단순한 구조라면 props 전달 추천
- 코딩테스트 문제는 난이도에 맞춰 차근차근 접근하고, 행렬과 그래프 문제는 구조를 확실히 이해할 것
- 오픈소스 라이브러리 사용 시 초기화 순서, DOM 준비 여부 꼭 확인해 예기치 않은 에러 방지
- TailwindCSS 사용 시 장단점을 인지하고 팀 내 합의된 스타일 가이드 준수 권장
링크 🔗
- Tailwind IntelliSense 설치 및 설정 가이드: https://tailwindcss.com/docs/editor-setup
- Atlassian Drag and Drop 라이브러리: https://github.com/atlassian/pragmatic-drag-and-drop
- Atlassian Drag and Drop 데모 페이지: https://atlassian.design/components/pragmatic-drag-and-drop/examples
- 클래스101 관련 블라인드 글: https://www.teamblind.com/kr/post/%ED%81%B4%EB%9E%98%EC%8A%A4101-%EC%8B%9C%EB%A6%AC%EC%A6%88-kMxwFi73
#React#Remix#Zustand#코딩테스트#TailwindCSS#Rust#키보드추천#개발자문화#면접준비#오픈소스