Supabase cli로 웹 사이트 로그인 구현하기 - google login (feat. claude code)

(* 아래 내용은 https://www.youtube.com/@jocoding 채널을 보면서 기록해두면 좋을만한 내용을 정리했습니다. 아래는 단편적인 내용이라 가급적 해당 강의를 보시는게 이해하는데 도움이 되실겁니다. 강추!! 입니다.)

이제 google 로그인을 정리해보자. 우선 google cloud(https://console.cloud.google.com/)에서 새 프로젝트를 만든다. (구글 클라우드 가입은 여기서 정리하지 않는다.)

이제 인증 플랫폼으로 이동한다. 돋보기 클릭해서 인증 플랫폼을 입력하면 바로 링크를 확인할 수 있다.

"시작하기" 버튼을 누르고 필요한 정보를 입력한다.

완료했다면 다음으로 Oauth client 만들기를 진행한다. 

중요한 건 이 두 가지. 승인된 javascript 원본은 사용할 웹 사이트 주소를 입력하고 localhost도 개발을 위해 일단은 같이 등록해준다. 

다음으로 승인된 리디렉션 URI는  supabase의 callback 주소를 입력한다.

생성후 oauth client id 는 복사해둔다. 그리고 생성된 클라이언트 정보에 보면 보안 비밀번호도 확인할 수 있다.

id와 secret을 아래 창에 입력한다.

이제 코드 구현은 AI에게!!

https://supabase.com/docs/guides/auth/social-login/auth-google 주소를 전달하고 로그인을 구현하라고 시켜.