개발 공부/Flutter / / 2022. 5. 27. 02:23

[Flutter] Flutter 3.0 프로젝트 Firebase 연결하기

여러 삽질 끝에 해냈다. 

 

1. CLI설치 

https://firebase.google.com/docs/cli?hl=ko#setup_update_cli

 

Firebase CLI 참조  |  Firebase Documentation

FirebaseVisionOnDeviceAutoMLImageLabelerOptions

firebase.google.com

자신에 맞는 OS를 선택하면 되는데 나는 Windows를 쓰고 있기 때문에 Windows를 눌렀다.

누르면 아래와 같이 나오는데

Node.js를 사용할 줄 알면 npm을 하면되고 그렇지 않으면 독립 실행형 바이너리를 다운로드 받으면 된다.

나는 1. Windows용 Firebase CLI 바이너리를 다운로드 합니다의 링크를 통해 다운로드 받았다.

 

V3(백신프로그램)가 다운로드 받은 파일이 실행하지 못하게해서 V3에서 다운로드 파일을 검사 예외파일로 지정했다.

 

2. CLI 실행 및 명령어 입력

다운로드 받은 파일을 실행하면 아래와 같이 창이 하나 뜬다.

명령어를 입력한다

firebase

좀 기다렸다가 실행이 끝나면 다음 것을 입력한다

firebase login

입력하고 기다리면 질문이 나오는데  y를 누르고 계속 진행하면 웹페이지로 구글계정 선택 화면이 뜬다.

Firebase 계정으로 진행해서 하면 로그인이 된 걸 확인할 수 있다.

 

로그인이 잘 되었는지 확인해 보자. 

firebase projects:list

Firebase 프로젝트 목록이 제대로 나오는 걸 확인할 수 있다.

 

3. Firebase Flutter 앱 추가

Firebase로 가서 프로젝트를 만든 후 앱을 추가해준다. 이번에 3.0이 릴리즈 되면서 Firebase에 Flutter앱을 추가할 수 있게 되었다.

Flutter 아이콘을 클릭하면 안내 페이지가 나온다

CLI는 설치 했고 Flutter SDK는 Flutter를 설치하면서 끝내놓았다.  Flutter 프로젝트를 만드는데 나는 이미 Android Studio를 통해서 만들었기 때문에 2번으로 넘어갔다. 

도대체 저 명령어를 어디서 실행해야할지 감이 오지 않아서 CLI에서도 해보고 Flutter 설치파일에서 실행했다가 에러가 나서 이런저런 삽질을 하다가 프로젝트 내의 Terminal에서 한다는 것을 알게되었다.

 

Android Studio에서 Flutter Project를 열어서 하단의 Terminal에 입력했다

dart pub global activate flutterfire_cli

이렇게 입력해 잘 되면 좋겠지만 경고가 떴는데 path에 대한 언급이 나온다. 시키는대로 아래의 경로를 path(환경변수)에 추가하고 나서(혹시 몰라 admin과 시스템 PATH에 둘 다 넣었다)

바로 적용이 안되어서 컴퓨터를 재부팅 후에 진행했다. 

C:\Users\admin\AppData\Local\Pub\Cache\bin

 

다시 프로젝트 Terminal로 가서 다음 명령어를 입력해준다 

flutterfire configure --project=espero-350806

입력후에 플랫폼에 대한 메뉴가 나오는데 수정 없이 Enter를 누르면 된다. 이후 플랫폼별 앱이(Android, ios) Firebase에 등록이 되고 프로젝트 내에 lib폴더에 firebase_options.dart 파일이 생성된다.

4. pubspec.yaml에 firebase core 추가

Firebase를 사용하기 위해 패키지 설치

$flutter pub add firebase_core
$flutter pub get

5. 초기화 코드 추가

내가 제대로 못찾은 걸 수도 있는데 Firebase에서는 아래의 코드만 나와있었다.

await Firebase.initializeApp(
    options: DefaultFirebaseOptions.currentPlatform,
);

이것만 넣으면 작동이 안된다. 

아래는 실제 프로젝트에 넣은 코드이다. WidgetsFlutterBinding.ensureInitialized();을 넣어줘야 작동한다.

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await Firebase.initializeApp(
    options: DefaultFirebaseOptions.currentPlatform,
  );
  runApp(const MyApp());
}

앱을 실행했더니 잘 작동했다. 

 

끝!

'개발 공부 > Flutter' 카테고리의 다른 글

[Flutter] Android Studio Dart SDK 설정하기  (0) 2023.07.26
  • 네이버 블로그 공유
  • 네이버 밴드 공유
  • 페이스북 공유
  • 카카오스토리 공유