Google Auth FlutterFlow 연동 준비 ✦ Firebase 셋업 #4

안녕하세요, ARCOA의 지안입니다! 👋

 

지난 글에서 Firebase에서 Google Authentication을 설정하고 Google 로그인 기능을 활성화했습니다. 지금부터는 FlutterFlow와 연동하기 위한 Firebase 작업을 보너스 1편으로 진행하겠습니다.

 

소요 시간은 최대 10분입니다. 시작합시다!

 

 

 

Step 1: FlutterFlow 편집자 추가

1-1. Firebase 접속

• https://console.firebase.google.com에서 프로젝트 선택

 

1-2. FlutterFlow 편집자 추가

• 왼쪽 메뉴의 톱니바퀴(⚙️) → (그림 1) ✦① 프로젝트 설정 → ✦② 사용자 및 권한 → ✦③ 구성원 추가 클릭
• (그림 1) ✦④ 이메일 주소에 firebase@flutterflow.io 입력
• (그림 1) ✦④ 역할에 편집자(Editor) 선택
• (그림 1) ✦⑤ 구성원 추가 버튼 클릭

그림 1. 프로젝트 설정의 사용자 및 권한 탭

 

1-3. 고급 권한 설정 (필수✅)

• (그림 2) ✦⑥ 고급 권한 설정 클릭 → Google Cloud Console 새 창 열림

그림 2. 프로젝트 사용자 및 권한의 고급 설정

 

 

 

Step 2: 고급 권한 및 역할 지정

2-1. 주 구성원 설정

• 주 구성원별로 보기 탭의 firebase-adminsdk (그림 3) ✦⑦ 연필 아이콘 클릭

그림 3. Firebase 프로젝트 권한

 

2-2. 역할 추가

• (그림 4) ✦⑧ + 다른 역할 추가 버튼을 클릭하여, 아래 역할 2개를 각각 추가하고 저장 클릭
  • Cloud Functions Admin (Cloud 함수 관리자)
  • Service Account User (서비스 계정 사용자)

그림 4. 역할 지정

 

 

 

Step 3: 승인된 도메인 추가

3-1. 승인된 도메인 추가

• 프로젝트 바로 가기에서 (그림 5) ✦⑨ Authentication 또는 빌드 → Authentication 클릭
• (그림 5) ✦⑩ 설정 탭에서 (그림 5) ✦⑪ 승인된 도메인 클릭
• (그림 5) ✦⑫ 도메인 추가 버튼 클릭
• (그림 5) ✦⑬과 같이 도메인을 3개 추가
  • app.flutterflow.io
  • ff-debug-service-frontend-free-ygxkweukma-uc.a.run.app
  • (본인의 프로젝트 이름).flutterflow.app 

그림 5. Authentication 설정의 승인된 도메인

 

 

 

✅ 완료 체크리스트

[  ] 프로젝트 설정의 사용자 및 권한에 이메일과 역할 추가

[  ] 고급 권한 설정에 역할 2개 추가

[  ] Authentication 설정에 승인된 도메인 3개 추가

 

 

 

💡 팁

1. Apple 로그인은 나중에:

• 애플 개발자 계정($99/년)이 필요합니다. 
• 사업자는 D-U-N-S 발급 등 사전 절차가 많으니 미리 준비해둡니다.

2. Firebase Authentication 무료:

• Google, Apple 등 모든 제공업체 무료로 제공됩니다.
• 사용자 수와 로그인 횟수에 제한이 없습니다.

 

 

다음 글

✦ 디자이너(비개발자)의 Firebase 셋업

├ 1 ✦ Firebase 프로젝트 생성 완료

├ 2 ✦ Blaze 플랜 & 결제 설정 완료

├ 3 ✦ Google Authentication 설정 완료

├ 4 ✦ Google Auth FlutterFlow 연동 준비 완료
└ 5 ✦ Apple Authentication 로그인 연결

 

다음은 Apple 로그인 연결을 진행하겠습니다.

애플 개발자 계정이 꼭 필요하니 미리 준비해 주세요 ✦

Apple Authentication 로그인 연결 ✦ Firebase 셋업 #5