2025.07.12, KD 팀 합류 후 첫 프로젝트가 시작됐다. 인턴쉽 및 협업 테스팅 느낌이었다. 아이디어 회의에서 야구 선발 라인업 알림 서비스를 제안했는데, 팀원 중 야구를 아는 사람이 나밖에 없었다. 도메인을 설명하는 것부터 일이 될 판이라 접고, 디스코드 클론 코딩으로 정했다.
기간은 약 3주, 07.12부터 07.31까지.
나는 board(게시판) 파트를 맡았다. 게시판은 단순해 보이는데, 막상 어떤 요소가 있는지, 어떤 단위로 나눌지 설계하는 것부터 고민이 많았다.
새로 공부한 스택은 TanStack Router, Vanilla Extract, FSD(Feature-Sliced Design) 파일 구조다. 특히 FSD는 처음 적용해보는 거라 폴더 나누는 기준 자체를 잡는 데 시간이 걸렸다.
Vanilla Extract는 index 파일로 스타일을 일괄 export한 뒤 style.className 형태로 관리하는 방식이다. CSS-in-TS라 타입 안정성이 있고, 한 파일에서 스타일을 모아보니 구조가 깔끔해졌다.
작업 순서는 이랬다. 먼저 mock 데이터로 UI 껍질을 만들고, 팀 피드백을 받으면서 수정해 나갔다.
피드백 중 기억에 남는 건 postDetail을 별도의 post 위젯으로 분리하라는 거였다. 원래는 하나의 컴포넌트에 다 때려넣고 있었는데, 위젯으로 빼니까 재사용이 되고 구조가 나아졌다. 폼훅도 이때 적용했다.
슬라이더 쪽에서 이벤트 타이밍 버그도 하나 잡았다. 이벤트가 의도한 순서대로 안 들어오는 문제였고, 디버깅하면서 이벤트 흐름을 정리했다.
UI를 다 올려놓고, api 연동만 남은 상태에서 백엔드를 기다렸다.
마지막 날인 07.31. 발표 준비를 하면서 api를 연동하려는데, 백엔드 게시판 담당자가 작업을 시작도 안 했다는 걸 알게 됐다. mock으로 만든 게 다행이었다.
결과적으로 api 연동 없이 프로젝트가 마무리됐다. 배운 건 두 가지다. 코드 작성 순서를 처음부터 신경 쓸 것 — 나중에 자동정렬 돌리면서 두 번 일하는 게 시간 낭비였다. 그리고 FSD를 직접 적용해보니, 문서로만 읽었을 때랑은 이해도가 달랐다.