# 내 블로그에 Bluesky 댓글 섹션을 추가했다

> Clean Markdown view of GeekNews topic #26110. Use the original source for factual precision when an external source URL is present.

## Metadata

- GeekNews HTML: [https://news.hada.io/topic?id=26110](https://news.hada.io/topic?id=26110)
- GeekNews Markdown: [https://news.hada.io/topic/26110.md](https://news.hada.io/topic/26110.md)
- Type: GN+
- Author: [neo](https://news.hada.io/@neo)
- Published: 2026-01-25T23:33:51+09:00
- Updated: 2026-01-25T23:33:51+09:00
- Original source: [micahcantor.com](https://micahcantor.com/blog/bluesky-comment-section.html)
- Points: 4
- Comments: 1

## Topic Body

- 정적 사이트에서도 **Bluesky API**를 이용해 댓글을 표시할 수 있도록 구현한 사례  
- Bluesky가 **계정 인증, 스팸 관리, 저장소, 모더레이션**을 처리하므로 별도 서버 유지가 불필요  
- 구현은 약 **200줄의 TypeScript 코드**로 구성되며, `@bluesky/api`와 **Tanstack react-query**를 활용  
- 댓글은 **읽기 전용 형태**로 표시되며, 각 블로그 글의 메타데이터에 Bluesky 게시물 ID를 연결해 자동 로드  
- **개방형 소셜 플랫폼과 정적 블로그의 결합 가능성**을 보여주는 실험적 구현  

---

### Bluesky 댓글 섹션 구현 배경
- 정적 생성 사이트에서 댓글 기능을 직접 호스팅하기 어렵다는 점이 출발점  
  - CDN에 배포된 정적 콘텐츠는 동적 데이터 저장이 불가능  
  - 별도 VPS나 클라우드 서비스를 운영하면 비용과 관리 부담이 큼  
- Bluesky는 **공개 API와 AT 프로토콜 기반의 개방형 플랫폼**으로, 댓글 관리에 필요한 기능을 이미 제공  
  - 계정 인증, 스팸 필터링, 저장소, 모더레이션을 Bluesky가 처리  
  - 블로그 측에서는 단순히 API를 호출해 댓글을 표시하면 됨  

### 다른 대안과 Bluesky 선택 이유
- Twitter, Disqus, giscus(GitHub Discussions 기반) 등의 대안도 고려  
- Bluesky는 **탈중앙화된 AT 프로토콜** 위에 구축되어 특정 기업의 통제 위험이 낮음  
- GitHub 기반보다 **대화 중심의 플랫폼**으로서 댓글 호스팅에 적합  

### 구현 방식
- Cory Zue가 공개한 **bluesky-comments 패키지**를 참고했으나, 직접 구현을 선택  
  - 사이트 스타일에 맞춘 커스터마이징과 향후 확장성을 위해 자체 코드 작성  
  - 전체 구현은 UI 컴포넌트와 API 함수 포함 약 200줄 규모  
- 초기에는 OAuth를 통한 **직접 게시 기능**도 고려했으나, UI 복잡성과 시간 제약으로 제외  
  - 결과적으로 **읽기 전용 댓글 표시 기능**만 구현  

### 기술 구성
- 사이트는 **React Server Components**와 **Parcel**을 사용해 구축  
  - 콘텐츠는 **MDX**로 작성되어 JavaScript/JSX를 직접 포함 가능  
  - 각 글의 `metadata` 객체에 `bskyPostId`를 포함해 Bluesky 게시물과 연결  
- Bluesky TypeScript SDK(`@bluesky/api`)를 사용해 **getPostThread 엔드포인트**에서 댓글 스레드 데이터 수신  
- API 요청은 **Tanstack react-query**로 관리  
  - 오류, 로딩, 재시도 상태를 자동 처리  

### UI 설계
- Bluesky 응답에서 **텍스트 콘텐츠만 추출**해 단순한 댓글 UI로 표시  
- **스레드 구조**는 들여쓰기와 왼쪽 경계선으로 구분  
  - 프로필 이미지와 게시 날짜는 Bluesky 디자인을 참고  
- 상단에는 원본 Bluesky 게시물로 이동하는 링크를 추가해 **대화 참여 유도**  
- 댓글 작성 기능은 없으며, 사용자는 Bluesky에서 직접 답글을 남김  

### 향후 가능성
- 필요 시 이 구현을 **독립 패키지로 공개**할 수 있음  
  - 다만 현재 코드는 개인 사이트에 맞춰져 있음  
  - 단순한 구조이므로 다른 개발자도 소스코드를 참고해 쉽게 구현 가능  
- Bluesky 댓글 연동이 블로그 **참여도 향상**에 도움이 될지 여부는 아직 미지수  

### Bluesky 사용자 반응
- 여러 Bluesky 이용자들이 댓글로 **“좋은 아이디어”, “빠른 반응 속도”, “Disqus 대안으로 적합”** 등의 긍정적 반응을 남김  
- 일부는 **스팸 관리, 중첩 댓글 처리, 첨부파일 지원** 등에 대한 질문을 제기  
- 작성자는 Bluesky의 **개인 모더레이션 기능**으로 특정 댓글을 숨길 수 있다고 설명

## Comments



### Comment 49901

- Author: neo
- Created: 2026-01-25T23:33:52+09:00
- Points: 1

###### [Hacker News 의견들](https://news.ycombinator.com/item?id=46747366) 
- 블로그나 웹사이트를 **정적 사이트 생성기(static site generator)** 로 렌더링한다면, 댓글을 콘텐츠 파일로 가져와 빌드 과정에 포함시키는 방법을 제안함  
  1) 이메일, CGI 스크립트, 서버 프로그램 등으로 댓글을 수집하고  
  2) 수동으로 검토해 스팸을 삭제한 뒤  
  3) 댓글을 `.md`나 `.html` 파일로 저장하고  
  4) 사이트 빌드 시 함께 렌더링하는 방식임  
  이 과정은 손이 많이 가지만, **스팸 차단**과 **데이터 완전한 소유권**이라는 장점이 있음
  - 나도 비슷한 시스템을 **이메일 기반**으로 구현했음. 자세한 내용은 [내 블로그 글](https://ckardaris.github.io/blog/2026/01/22/my-comments-run-on-email.html)에 정리했음
  - 작은 웹사이트라면 하루에 몇 개 안 되는 댓글만 관리하면 되므로, 수동 검토가 충분히 가능함. 또 **Markdown 파일 자동 업데이트**로 쉽게 자동화할 수도 있음
  - “나는 팩스로만 댓글을 받음 ;)”이라며 농담을 던짐
  - “끔찍하게 들림”이라며 비효율적이라고 반응함

- React를 쓰지 않고 싶다면, 내가 만든 **Bluesky 댓글 웹 컴포넌트**를 참고할 수 있음  
  [GitHub 저장소](https://github.com/ascorbic/bluesky-comments-tag)와 [테마 플레이그라운드](https://bluesky-comments.netlify.app/theme/)에서 확인 가능함.  
  매우 **테마 커스터마이징**이 쉬움

- 원글의 아이디어를 참고해 **Mastodon 기반 댓글 시스템**으로 구현했음  
  자세한 내용은 [내 블로그 글](https://jesse.id/blog/posts/you-can-now-comment-on-my-blog-from-the-forkiverse)에서 볼 수 있음
  - 사실 이런 **Fediverse 댓글 통합**은 예전부터 Mastodon이나 Bluesky로 시도되어 왔음  
    참고: [관련 블로그 글](https://blog.nawaz.org/posts/2025/Jan/adding-fediverse-comments-to-my-static-site/)

- EU의 **혐오발언 관련 법률** 때문에 사이트 운영자가 댓글을 필터링하지 않으면 처벌받는다는 이야기가 있는데, 그게 실제로 어떤지 궁금함  
  그래서 나는 아예 댓글 기능을 꺼버렸음
  - 법률 전문가는 아니지만, 이런 위험은 **정치적 의도**로 과장되는 경우가 많음. EU 법은 사이트 규모와 목적을 고려함. 작은 개인 사이트가 처벌받은 사례는 들어본 적 없음  
  - **Bluesky의 moderation labeler**를 활용하면 사전 필터링이 가능함. EU 기준에 맞춘 건 없지만, 직접 라벨러를 만들어 문제 있는 댓글만 걸러낼 수도 있음  
  - 법 이전에, 내 이름이 걸린 사이트에 **혐오 발언**이 올라오는 건 원치 않음

- 내 블로그는 완전 정적 구조이고, **50줄짜리 Cloudflare Worker 스크립트**로 댓글을 받아 Markdown에 바로 추가함.  
  댓글 기능을 임베드하지 않고도 구현 가능함
  - 댓글을 **Pull Request로 자동 커밋**하는 식으로, PR을 댓글 검토 도구로 쓰면 재미있을 것 같음  
  - “그게 진짜 ColdFusion이면 더 멋질 듯”이라며 농담함  
  - “링크나 구현 세부정보를 공유해줄 수 있냐”고 묻는 사람도 있음

- Bluesky API를 활용해, 특정 블로그 링크를 포함한 첫 번째 게시글을 자동으로 찾아 댓글로 연결하는 식으로 **자동화**할 수도 있음

- Bluesky 성장에도 도움이 될 것 같아 테스트용으로 계정을 만들었음. 꽤 **재미있는 성장 해킹 아이디어** 같음
  - 하지만 **영리 목적 SNS**는 결국 Twitter처럼 될 것이라 생각함.  
    이상적으로는 **자체 호스팅**이나 **Fediverse 기반** 댓글 시스템이 더 지속 가능함  
  - “우리는 그 다른 플랫폼이 아니다”라는 메시지만으로는 성공하기 어렵다는 의견도 있음

- 내 블로그는 인기가 많지 않지만, 예전에 **스팸과 혐오 댓글 지옥**을 겪은 적이 있음  
  그래서 다시는 개인 블로그에 댓글 기능을 열 생각이 없음

- Bluesky 기반 시스템이라도, 직접 **라벨러(labeler)** 를 추가해 특정 라벨이 붙은 댓글을 필터링하는 식으로 **자체 검열**을 할 수 있음

- 나도 비슷한 아이디어로, 내 블로그 외에 [cartes.app](https://cartes.app)에서 **OSM 장소별 댓글 기능**을 추가했음  
  ATproto 계정으로 리뷰를 남길 수 있고, 데이터는 **사용자 소유 JSON** 형태로 PDS에 저장됨
  - “정말 멋지다. 그 데이터를 어떻게 모으냐, 혹시 **Bluesky firehose**를 듣는 방식이냐?”고 묻는 댓글이 달림