웹앱에 로그인을 붙이기 전에 알아야 할 것
로그인은 기능이 아니라 책임입니다. 정말 필요한지, 대안은 없는지, 붙인다면 무엇이 따라오는지. 첫 서비스에서 일부러 빼는 이유.
"회원가입이랑 로그인 넣어 주세요." 첫 서비스 기획에서 가장 먼저 나오고, 가장 먼저 빼야 하는 말입니다. AI는 로그인 화면을 5분에 만듭니다. 문제는 그다음입니다.
로그인이 끌고 오는 것
로그인 버튼 하나 뒤에는 이만큼이 있습니다.
- 회원가입 · 이메일 인증 · 비밀번호 재설정 · 탈퇴
- 개인정보를 저장하는 순간 개인정보처리방침, 보관 기간, 파기 절차, 동의 문구
- 세션(로그인 유지)과 쿠키 처리
- "로그인한 사람은 자기 데이터만"이라는 권한 규칙 — 화면이 아니라 서버 쪽에
- 데이터 저장소(DB)와 그 비용·백업
- 누가 관리자인지, 관리자 화면
이 중 하나라도 빠지면 사고입니다. 그리고 AI는 시키지 않으면 이 목록을 알아서 챙기지 않습니다. 코딩 경험이 없는 사람의 첫 프로젝트에 로그인이 들어가면 거의 확실히 중간에 멈추는 이유입니다.
먼저 물을 것 — 정말 필요한가
로그인이 하는 일은 두 가지뿐입니다. 누구인지 알기, 그리고 그 사람의 것만 보여 주기. 이 둘이 없어도 되는 서비스가 생각보다 많습니다.
| 하고 싶은 것 | 로그인 없이 |
|---|---|
| 우리 직원만 쓰게 | 주소를 아는 사람만 씀 + 검색 안 되게(noindex). 내부 도구는 대부분 이걸로 충분 |
| 신청·예약 받기 | 구글 설문지 링크, 카톡 채널 연결 |
| 각자 기록 남기기 | 브라우저 안 저장 + 파일로 내려받기 |
| 관리자만 고치기 | 관리자 화면을 따로 두지 말고 GitHub에서 파일 고치기 |
| 결제 | 결제 서비스 링크(외부 결제창)로 넘기기 |
첫 서비스의 기준 한 줄: 개인정보·돈·여러 사람의 기록이 오가면 다음 단계. 로그인은 정확히 그 셋과 같이 옵니다.
그래도 필요하다면 — 붙이기 전 준비
1. 기획을 다시 씁니다. 새 기획.md. 누가 로그인하나(직원 5명? 고객 수천 명?), 무엇을 저장하나(이름·연락처?), 누가 무엇을 볼 수 있나. 이 셋이 한 문장씩 적혀야 합니다.
2. 개인정보부터. 이름·이메일·연락처를 저장하면 개인정보처리방침이 필요하고, 회사라면 규정 확인이 먼저입니다. 수집 항목은 최소로. "필요한지 모르겠으면 안 받는다."
3. 직접 만들지 않습니다. 비밀번호 저장·인증 메일·세션 관리를 AI에게 처음부터 짜게 하면 안 됩니다. Supabase 같은 서비스의 인증 기능(Auth)을 씁니다. 이미 검증된 로그인을 빌려 쓰는 것입니다. 소셜 로그인(구글로 계속하기)이 비밀번호 관리 부담을 줄입니다.
4. 요청문에 세 줄. 이건 외워 두세요.
로그인을 붙일 거야. 직접 구현하지 말고 [Supabase Auth]를 써. 반드시 지킬 것 - 로그인한 사람은 자기 데이터만 보고 고칠 수 있게 서버 쪽에 접근 제한(RLS)을 걸어줘. 주소의 번호를 바꿔도 남의 것이 안 보여야 해 - 비밀 키는 환경변수로, 브라우저에 가는 코드에는 공개용 키만 - 모든 입력값은 저장 전에 서버에서 검사해 만들기 전에 어떤 테이블과 규칙을 만들지 계획을 먼저 보여줘.
5. 배포 주소를 인증 서비스에 등록합니다. 로컬에서는 되는데 배포하면 로그인이 안 되는 흔한 원인. 인증 서비스 설정에 내 배포 주소(Site URL, Redirect URL)를 넣어야 합니다.
붙인 뒤 — 사람이 확인할 것
- ☐ 시크릿 창에서 다른 계정으로 가입해 남의 데이터가 보이는지 직접 시도 — 주소 번호를 바꿔 보기
- ☐ 비밀번호 재설정 메일이 실제로 오나
- ☐ 탈퇴하면 데이터가 지워지나 (개인정보처리방침에 적은 대로)
- ☐ 로그아웃 뒤 뒤로가기로 화면이 남나
- ☐ 브라우저에 가는 코드에 비밀 키가 없나 — "브라우저 코드에 secret·service 키가 있는지 점검해줘"
내 계정으로만 확인하면 권한 문제는 절대 안 보입니다. 반드시 두 계정.
정리
로그인은 기능이 아니라 책임입니다. 첫 서비스에서는 빼고, 대안으로 버티고, 실제로 필요해진 게 확인되면 기획부터 다시 써서 인증 서비스를 빌려 붙입니다. 그때 요청문 세 줄 — 접근 제한, 키는 환경변수, 입력값 검사 — 은 반드시 넣습니다.