본문 바로가기
프로그래밍/Flutter & Dart

Flutter 앱에서 Firebase 사용 하기 (iOS 편)

by 어느덧중반 2021. 1. 31.
반응형

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

 

Firebase 에서 제공하는 수많은 기능을 통해 사용자의 데이터를 저장하고 분석하며 비즈니스를 성장시킬 수 있다? 잘 이해가 안간다면 우선 뭐든 만들어보고 무엇을 의미했던건지 역추적해보도록 하자. 해당 게시글에서 Firebase 프로젝트를 생성하는 방법에 대해 알아볼 것이다.

#1. 구글 로그인 및 Firebase 프로젝트 생성

#2. Flutter 앱 만들기 (Android Studio 기준)

#3. Firebase - iOS 플랫폼 추가하기


#1. 구글 로그인 및 Firebase 프로젝트 생성

 - Firebase 프로젝트를 생성하기 위해선 일단 본인의 구글 계정으로 로그인이 필요하다. 자, 우선 로그인해보자.

 - 다음으로 Firebase 페이지에 접속해보자.

 

Firebase

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

firebase.google.com

 - Get Started를 눌러보자.

 - 기존 프로젝트가 없다면 빈 화면만 있을 것이다. 프로젝트 추가 버튼을 눌러 프로젝트를 생성해보자.

 - 나는 SNS Login 화면을 구성해볼 것이기에 login test로 프로젝트를 생성했다.

 - 구글 애널리틱스는 추후에 앱의 사용자가 많아진다면 여러 도움을 받을 수 있는 도구인것 같은데, 나도 고수가 아니라서 잘 모르겠다. (예를 들어, 내 앱을 사용하는 주요 사용자의 연령대나 성별 등을 분석해주는?) 나는 우선 사용 설정은 해두는데 체크해제를 하고 계속해도 무방하다.

 - 애널리틱스 계정이 없다면 하나 생성해주자. 구성을 안하는 경우 여긴 스킵하겠지?

 - 자, 프로젝트가 생성되었다. 시작이 반이라지 않나? 이제 무한한 도구들을 아낌없이 사용해보도록 하자.

 - 프로젝트 생성후 접하게 되는 첫 화면이다. 좌측에 수많은 아이콘은 Firebase에서 사용할 수 있는 수많은 기능들이고 빨간색 체크표시해둔 것이 바로 iOS / Android / Web / Unity 등 어떤 플랫폼을 추가하여 사용할지를 선택하는 부분이다. 해당 게시글에서는 iOS와 Android만 추가하도록 하겠다.

아주 간단하게 Firebase 프로젝트를 하나 생성해보았다. 아직까지 어려운 것은 전혀 없다. 이제 Flutter 앱을 하나 만들고 각 플랫폼을 추가해보도록 하자.

 

#2. Flutter 앱 만들기 (Android Studio 기준)

 - Android 와 iOS 플랫폼 추가를 위해서는 우선 Flutter 프로젝트 생성을 해야한다.
   왜냐하면, 각 플랫폼을 추가할 때 패키지명이 필수로 들어가게 된다.
   (패키지명은 왜 들어가야 하는가? 예를 들어 A앱과 B앱 2개가 있다고 치자.
    우리는 A앱에 들어가는 데이터베이스 (Firebase의 Firestore 기능) 를 Firebase로 구성하고 싶다면 A앱에 대한
    고유 정보 등을 등록해서 이 데이터베이스는 A앱의 데이터베이스이다! 라고 구분할 수 있어야 한다. 그렇기 때문에
    우리가 Flutter 프로젝트를 생성하고 패키지명을 알아야 하는 것이 해당 앱이라는 것을 구분하기 위함이라고
    알고 있으면 된다.)

 - 자, Android Studio를 열어 Flutter 프로젝트를 생성하자. (다른 IDE 사용자도 각자 프로젝트 생성하면 된다.)

프로젝트 이름 등은 각자 알아서 생성하기 바랍니다. 똑같이 생성할 필요가 전혀 없음

이제 Flutter 프로젝트까지 생성되었다면 앞으로 iOS 플랫폼 추가하는 것만 하면 된다. 거의 다 왔으니 지치지 말고 조금만 더 가보도록 하자.

#3. iOS 플랫폼 추가하기

- 자, 위의 Firebase 프로젝트 생성한 화면에서 iOS 아이콘을 눌러 추가해보자.

- 아래와 같은 화면이 보일 것이다. 긴장하지 말자. 우리는 이미 패키지명을 알고 있다.

- 각 플랫폼 등록을 위해선 패키지명이 반드시 필요하다. iOS의 패키지 확인하는 방법을 알아보자.
  > flutter project > ios > Flutter > Open iOS module in Xcode (해당 프로젝트를 XCode로 열기)

- 아래의 위치에 있는 Bundle ID가 바로 패키지명이다. 복사하자.

- 위에서 복사한 Bundle ID 를 아래 패키지명 붙여넣을 곳에 붙여넣고 앱 등록 버튼 클릭하자.

- 여기서 중요하다! GoogleService-Info.plist 다운로드 버튼클릭으로 해당파일을 다운받자.

- 다시 XCode로 돌아가서 아래의 위치에 조금 전 다운로드받은 plist 파일을 드래그&드롭으로 넣도록 하자.

드래그 해서 Runner 폴더쪽 접근하면 초록색으로 + 시킬것인지 가이드라인이 보일 것이다. 그 때 드롭하자!
아래 팝업에선 Finish를 눌러서 복사를 마치자.
복사 후엔 Runner 폴더 안에 GoogleService-info.plist 파일이 있어야 한다. 주의사항은 Android Studio에서 넣을 경우 적용이 안될 수 있으니 꼭 XCode를 통해 plist 파일을 넣도록 하자.

- 이제 해줘야 하는 것은 끝이다. 다음 버튼을 클릭하자.

- 해당 항목도 할 필요가 없다. 다음 버튼을 클릭하자.

- 해당 항목도 마찬가지로 할 필요가 없다. 다음 버튼을 클릭하자.

- 이제 콘솔로 이동하면 된다. iOS 앱 추가는 이 것으로 끝이다.

Firebase 프로젝트 생성과 Android 플랫폼을 만드는 과정은 여러 번 반복하다보니 이젠 어느정도 익숙해진 것 같다. 해당 과정을 통해 Google Login을 구현할 수 있게 되었다. 다음 편에선 Google Login 로직을 설명하고 실제로 Login 소스를 구현해보도록 하겠다.

Android 플랫폼 추가 하는 법을 알고 싶다면 아래 링크로 이동해서 참고하면 된다.
1. 2021/01/25 - [트렌드/Flutter & Dart] - Flutter 앱에서 Firebase 사용 하기 (Android 편)

※ 파트너스 활동을 통해 일정액의 수수료를 제공받을 수 있음

반응형

댓글