블로그에 댓글 기능을 달기로 했습니다.
독자가 반응을 남길 수 있으면 좋겠다는 생각이었고, 어떤 방식으로 구현할지 찾아보기 시작했습니다.
처음에는 소셜 로그인 방식으로 방향을 잡았습니다.
후보는 두 가지였습니다. GitHub 로그인과 Google 로그인.
GitHub 로그인은 개발자 커뮤니티에서 흔히 쓰이지만, 제 블로그 독자 대부분은 개발자가 아닙니다. GitHub 계정이 없는 일반 독자에게는 진입장벽이 될 수 있다고 판단해서 제외했습니다.
그래서 Google 로그인으로 결정했습니다. 스마트폰을 쓰는 사람이라면 거의 대부분 구글 계정이 있고, 별도 가입 없이 기존 계정으로 바로 로그인할 수 있으니까요.
그런데 막상 따라 해보려니 중간에 이런 화면이 나왔습니다.
"Google Cloud Console — 결제 계정을 연결하세요."
무료라고 했는데 카드 번호를 입력해야 한다니. 잘못 건드리면 요금이 나올 수 있다는 불안감에 손이 멈췄습니다.
더 쉬운 방법이 없을까 싶어서 다시 찾아보기 시작했습니다.
댓글 시스템, 생각보다 선택지가 많다
결제 없이 쓸 수 있는 댓글 시스템을 기준으로 정리해봤습니다.
| 시스템 | 로그인 방식 | 외부 설정 | 광고 |
|---|---|---|---|
| Disqus | 소셜·비회원 | 불필요 | 무료 플랜에 광고 있음 |
| Utterances | GitHub 로그인 | GitHub OAuth 앱 생성 | 없음 |
| Giscus | GitHub 로그인 | GitHub OAuth 앱 생성 | 없음 |
| Supabase 이메일 | 이메일 링크 | Supabase 대시보드만 | 없음 |
Disqus는 설정이 제일 간단하지만, 무료 플랜에 광고가 붙습니다. 애드센스를 이미 달고 있는 블로그에 광고가 하나 더 생기는 건 득보다 실이 많다고 판단해서 제외했습니다.
Utterances / Giscus는 GitHub 계정이 없으면 댓글을 달 수 없습니다. 제 블로그 독자 대부분이 개발자가 아닌 일반 독자이기 때문에 GitHub 로그인은 진입장벽이 너무 높았습니다.
그렇게 남은 게 Supabase 이메일 매직링크였습니다.
이메일 매직링크가 뭔가요?
처음엔 생소한 방식이었는데, 써보고 나서 오히려 제일 깔끔하다고 느꼈습니다.
이메일 주소를 입력하면 Supabase가 로그인 링크를 자동으로 발송합니다.
메일함에서 링크를 클릭하면 그게 끝입니다. 비밀번호도, 앱 설치도 없습니다.
이메일 입력 → 메일 수신 → 링크 클릭 → 로그인 완료 → 댓글 작성
그리고 제가 제일 마음에 들었던 점은 —
Supabase 자체는 카드 등록 없이 무료로 시작할 수 있습니다.
Google Cloud Console처럼 결제 계정을 연결할 필요가 없습니다.
설정 방법
1. Supabase 프로젝트 생성
supabase.com에서 회원가입 후 새 프로젝트를 만듭니다.
카드 정보 입력 없이 무료로 시작됩니다.
2. 댓글 테이블 생성
Supabase 대시보드 → SQL Editor에서 아래를 실행합니다.
create table comments (
id uuid default gen_random_uuid() primary key,
post_slug text not null,
user_id uuid references auth.users(id) on delete cascade,
user_name text not null,
body text not null,
created_at timestamptz default now()
);
alter table comments enable row level security;
create policy "누구나 읽기 가능" on comments for select using (true);
create policy "로그인 사용자만 작성" on comments for insert with check (auth.uid() = user_id);
create policy "본인 댓글만 삭제" on comments for delete using (auth.uid() = user_id);
3. Redirect URL 등록
Supabase 대시보드 → Authentication → URL Configuration에서 아래를 추가합니다.
https://내블로그주소.com/auth/callback
이게 전부입니다. Google Cloud Console, 결제 계정 연결, OAuth 앱 생성 — 아무것도 하지 않았습니다.
실제로 어떻게 보일까?
독자가 댓글을 달 때의 흐름입니다.
- 포스트 하단에서 이메일 입력 후 "링크 받기"
- 이메일함에서 로그인 링크 클릭
- 블로그로 자동 복귀, 로그인 완료
- 댓글 입력 후 등록
소셜 로그인보다 한 단계가 더 있긴 하지만, 구글이나 카카오 계정 정보를 블로그에 연동하는 것보다 거부감이 훨씬 적다는 반응이 많습니다. 이메일 주소 하나만 입력하면 끝이니까요.
나중에 Google 로그인을 추가하고 싶다면?
Supabase는 여러 로그인 방식을 동시에 지원합니다.
Google Cloud Console 설정할 마음이 생기면, Supabase 대시보드에서 Google Provider를 활성화하는 것만으로 구글 소셜 로그인이 추가됩니다. 이미 구축해둔 댓글 구조를 바꿀 필요가 없습니다.
처음부터 완벽한 시스템을 갖추려다 카드 등록에서 멈추는 것보다, 지금 당장 설정할 수 있는 방법으로 시작하고 나중에 확장하는 게 낫다고 생각했습니다.
댓글 기능을 달고 싶은데 Google Cloud Console에서 막혔다면, Supabase 이메일 매직링크부터 시작해보세요.