개요 회사와 사이드 프로젝트에서 디자인 시스템을 구축하게 됐다. React 기반에 Radix UI를 사용하고, Tailwind CSS로 스타일링하고, Storybook으로 문서화하는 전형적인 구성이었다. 하지만 여기서 한 가지 독특한 시도를 했다. 컴포넌트의 스크린샷을 자동으로 캡처해서 JSDoc에 주입하는 파이프라인을 만든 것이다. ▼ 'Storybook이 있는데 도대체 왜?' 라는 의문이 들 수 있을 것이다. 지금부터 왜 이런 걸 만들었고, 어떻게 구현했고, 실제로 얼마나 유용한지 정리해보려 한다. 문제 상황: 컴포넌트를 확인하려면 어디로 가야 하나?일반적인 디자인 시스템 사용 경험디자인 시스템을 만들어 본 사람이라면 알겠지만, 컴포넌트를 쓸 때 항상 이런 과정을 거친다. ▼"이 버튼 컴포넌트 어떻..
핵심만 원한다면 "JSDoc: 단순한 주석이 아니라 IDE와의 대화"로 이동해주세요.개요개발의 패러다임이 바뀌고 있다 개발의 패러다임이 바뀌었다. 불과 몇 년 전만 해도 개발자가 한 줄 한 줄 직접 코드를 작성해야 했지만, 이제는 AI가 개발의 대부분을 수행해준다. 전체적인 아키텍처 설계 면에서는 아직 인간의 통찰력이 필요하지만, 단순 기능 구현을 지시하면 AI는 불과 몇 초 만에 결과물을 내놓는다. 물론 AI에게 모든 것을 맹목적으로 맡기면 심각한 기술 부채로 이어진다. 하지만 인간이 뼈대를 세우고, AI가 살을 붙이면 이야기가 달라진다. '초안 구현'은 AI에게 맡기고, 인간은 그 결과물을 검수하고 리팩토링하는 워크플로우를 구축했을 때 생산성은 폭발적으로 증대된다. 이제 개발의 대세는 AI에게 대부..