🚀 커뮤니티 기능 구현 & UI 대수술

이번 업데이트에서는 bitdak의 핵심 기능인 커뮤니티를 구현하고, 사용자의 피드백을 반영하여 UI 디테일을 대폭 개선했습니다.

1. 커뮤니티 기능 구현

• @bitdak/feature-community 패키지 분리: 재사용성과 유지보수성을 위해 모노레포 환경에서 별도 패키지로 분리했습니다.
• LocalStorage 기반 데이터 관리: 초기 MVP 단계에서 서버 없이도 동작하도록 BitDakService를 구현했습니다.
• 핵심 컴포넌트 개발: PromptCard, PromptFilter, PromptEditor 등 프롬프트 공유에 필요한 UI를 구축했습니다.

2. UI/UX 디테일 개선 (사용자 피드백 반영)

• 모바일 반응형 최적화: 버튼이 비정상적으로 보이던 문제를 해결하기 위해 w-fit, flex-shrink-0 등을 적용하여 비율을 고정했습니다.
• 필터 UI 개선: 모바일에서 좁은 공간을 효율적으로 쓰기 위해 카테고리(가로 스크롤)와 모델 선택(우측 배치)을 분리했습니다.
• 레이아웃 정렬: Color System 페이지와 커뮤니티 페이지의 그리드 시스템을 통일하여 일관성을 확보했습니다.

3. 트러블 슈팅

• 빌드 에러 해결: PromptFilter라는 이름이 타입과 컴포넌트 양쪽에서 사용되어 발생한 충돌을 PromptFilterType으로 리네이밍하여 해결했습니다.
• 모바일 레이아웃: 버튼이 찌그러지거나 너무 뚱뚱해지는 문제를 고정 높이와 패딩 조절로 해결했습니다.

4. 결론

기능 구현뿐만 아니라, 실제 기기에서의 사용성까지 고려한 디테일한 수정이 서비스의 완성도를 높인다는 것을 다시 한번 느꼈습니다.