블루스카이(Bluesky) 댓글, 이제 블로그에서도 확인하세요!

저자는 정적 사이트의 한계를 극복하기 위해 블루스카이(Bluesky) API를 활용하여 댓글 기능을 구현했다. React Server Components를 사용하여 서버 측 렌더링을 수행하고, Parcel을 통해 번들링을 진행했다. API 요청/응답 관리를 위해 Tanstack react-query를 도입하여 로딩, 에러 처리, 재시도 로직을 간소화했다. 특히, @bluesky/api를 사용하여 블루스카이(Bluesky) API와 효율적으로 통합했다.

저자는 OAuth를 활용하여 블로그에서 직접 블루스카이(Bluesky)에 포스팅하는 기능을 구현하려 했으나, UI 구축의 어려움으로 인해 중단했다. OAuth 인증 흐름(OAuth Flow)을 구현하는 것보다, 블루스카이(Bluesky)에서 직접 포스팅하는 것이 사용자 경험 측면에서 큰 차이가 없다고 판단했기 때문이다. 결과적으로, 읽기 전용 댓글 섹션(Read-only Comment Section) 구현으로 범위를 축소했다.

커뮤니티에서는 웹멘션(Webmention)과 매스토돈(Mastodon)을 활용한 유사한 댓글 시스템 구현 사례가 언급되었다. 웹멘션(Webmention)은 다양한 소셜 미디어 플랫폼의 댓글을 블로그에 통합하는 데 사용되며, 매스토돈(Mastodon)은 자체 프로토콜을 통해 댓글을 관리한다. 이러한 사례들은 블루스카이(Bluesky) 외에도 다양한 분산형 소셜 미디어(Decentralized Social Media) 플랫폼을 활용한 댓글 시스템 구축 가능성을 보여준다.

저자는 자체 패키지 대신 직접 구현을 선택하여, 사이트 스타일에 맞게 UI를 커스터마이징하고 향후 기능 추가의 유연성을 확보했다. 하지만, 블루스카이(Bluesky) API의 변경에 따라 코드 유지보수(Code Maintenance)가 필요할 수 있다. 또한, 다양한 콘텐츠 형식(Rich Content Structure)을 완벽하게 지원하기보다는 텍스트 기반의 댓글 UI를 구현하여 단순성을 유지했다.