안단테 안단테

[Flutter] 1. facebook 로그인 테스트 (firebase 프로젝트 생성) 본문

IT 기술/Flutter

[Flutter] 1. facebook 로그인 테스트 (firebase 프로젝트 생성)

안단테에 2022. 3. 25. 16:07
728x90
반응형

우리가 어플을 사용하다 보면 SNS 로그인을 필요한 시점이 있다

그래서 나는 구글 / 페이스북 / 네이버 / 카카오 로그인 구현을 예제코드랑 함께 업로드 할 예정이다

모든것이 그렇듯이 환경에 따라서 안되는경우가 많으니.. 내 환경 부터 작성하고 시작하겠다.

 

OS : Windows 10 64bit
Visual Studio Code : 1.65.2
Android Studio : Arctic Fox 2020.3.1 Patch 4
 - Virtual Device : Android 11.0(Google play) API 30 / x86 / 14 GB

 

Flutter 설치랑 이런건... 일단 기본으로 되어있다라는 가정부터 시작을 하겠다.

나중에 시간적 여유가 되면 Flutter 설치도 따로 작성을 할 예정이다.

아 그리고 안드로이드 스튜디오도 설치가 되고 시뮬레이터도 된다는 가정하에 시작을 하겠다.

 

 


개발 환경 구성

환경은 visual studio code와 android studio가 필요하니 안깔려 있다면

아래 사이트에 들어가서 다운로드 받아 설치를 해라.

 

https://code.visualstudio.com/

 

Visual Studio Code - Code Editing. Redefined

Visual Studio Code is a code editor redefined and optimized for building and debugging modern web and cloud applications.  Visual Studio Code is free and available on your favorite platform - Linux, macOS, and Windows.

code.visualstudio.com

 

https://developer.android.com/studio?gclid=CjwKCAjwrfCRBhAXEiwAnkmKmWucoh16QX3AUjX54AzJMeOz-prXQhI3hPsVaIRaS-U9lrz1q-h9LhoCgLQQAvD_BwE&gclsrc=aw.ds 

 

Download Android Studio and SDK tools  |  Android Developers

The official IDE for Android app developers.

developer.android.com


 

일단.. facebook 로그인을 구현하려면 설정이 몇가지 필요하다. (아니 많이..)

로그인 구현을 위한 순서를 대략적으로 작성하고 시작하겠다.

 

1. firebase create project
2. firebase console setting
3. facebook create app
4. facebook developer setting
5. flutter coding

이렇게 총 5가지 단계가 있다.
이번 글에서는 파이어베이스 프로젝트만 작성하겠다.
다 쓰려고 하니깐 길다..

 


 

1. Firebase create project

 

https://firebase.google.com/

 

Firebase

Firebase는 고품질 앱을 빠르게 개발하고 비즈니스를 성장시키는 데 도움이 되는 Google의 모바일 플랫폼입니다.

firebase.google.com

 

위의 사이트에 들어가서 시작하기를 눌러 구글 로그인을 먼저 합니다.

 

 

로그인 후 프로젝트 추가를 눌러 줍니다.

 

 

프로젝트 이름은 logintest로 하겠습니다.

계속 클릭.

 

 

이 프로젝트에서 Google 애널리틱스 사용 설정 하시고 계속 클릭.

 

 

Google 애널리틱스 계정 선택 또는 만들기에서 Default Account for Firebase 클릭 후 프로젝트 만들기 클릭.

 

 

차분하게 기다려줍시다..

 

 

완성됐으면 계속 클릭.

 

 

자 이제 파이어베이스 생성을 했습니다.. 아직 생성만 하고 세팅은 시작도 못했네요..

 

 

 

하나씩 작성해야겠습니다..

ㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋㅋ

지치네요..

728x90
반응형
Comments