데브허브 | DEVHUB | [FE] 리액트 - 46강: Supabase OAuth 구글 로그인(소셜 로그인) 연동 완벽 가이드

Supabase 소셜 로그인 연동의 핵심은 Google Cloud Console을 활용하여 Google OAuth를 설정하고 Supabase와 연결하는 과정입니다. 🔗
Google Cloud Console에 접속하여 새로운 프로젝트를 생성하는 것이 모든 OAuth 설정의 시작점입니다. 🏗️
OAuth 동의 화면을 구성할 때 앱 이름, 사용자 지원 이메일, 사용자 유형(외부) 등을 정확히 설정해야 합니다. 📝
웹 애플리케이션 유형으로 OAuth 클라이언트 ID를 생성하고, 로컬 개발 환경(localhost) 및 실제 배포 환경의 승인된 JavaScript 원본(URI)을 추가해야 합니다. 🌐
Supabase의 인증(Authentication) 설정에서 Google 제공자를 활성화하고, 제공되는 콜백 URL을 Google Cloud Console의 승인된 리다이렉션 URI에 등록해야 합니다. 🔄
Google Cloud Console에서 생성된 클라이언트 ID와 클라이언트 시크릿을 Supabase Google 제공자 설정에 정확히 입력하여 양 플랫폼을 연결합니다. 🔑
개발 및 배포 환경을 모두 고려하여 localhost 주소와 실제 서비스 도메인 주소를 승인된 URI에 모두 추가하는 것이 중요합니다. 💻
모든 설정이 완료되면 실제 구글 로그인을 테스트하여 정상 작동 여부를 확인하고, 문제가 발생하면 설정을 재검토해야 합니다. ✅

[FE] 리액트 - 46강: Supabase OAuth 구글 로그인(소셜 로그인) 연동 완벽 가이드