iT邦幫忙

2022 iThome 鐵人賽

DAY 17
0
Mobile Development

通徹 Flutter 學習路徑系列 第 17

通徹 Flutter 學習路徑 Day 17 - 讓我們與 Firebase 互動吧!

  • 分享至 

  • xImage
  •  

在前面幾個篇章中
我們所著重的在畫面的呈現
然而現實生活中的專案最重要的不只是畫面呈現
更重要的是資料的來源及存放
因此我們今天會主要用來介紹 Firebase ~


什麼是 Firebase 呢?

Firebase

Firebase 提供了我們許多便利的功能
例如身份授權、資料庫、後台監測 ... 等功能
透過 Firebase 來實作應用程式可以降低我們的入手難度
大多數後端資料存取的功能 Firebase 都提供了一個方便呼叫的方式
只要對其短暫的做些研究便可以快速上手


在 Flutter 3 的發表中其中一項便是與 Firebase 的合作更加的密切了參考
那我們就來實作一遍嘗試看看吧!

Step1. 安裝 Firebase Cli

由於筆者所使用的電腦為 MacOS 因此在這邊介紹的流程主要是以 MacOS 為主

curl -sL https://firebase.tools | bash

接下來便可透過

firebase login #使用 Google 帳號進行登入

登入成功便可透過以下指令檢查目前存在 firebase 的專案有哪些

firebase projects:list

Step 2. 與 Flutter 進行整合

首先我們得先安裝 flutterfire_cli

dart pub global activate flutterfire_cli

接著到我們要與 Firebase 整合的 Flutter 專案底下執行
其中 <project-id> 可以到 Firebase 主控台查看

flutterfire configure --project=<project-id>

透過上面的指令
會自動的把與 Firebase 相關的設定及檔案給準備好

接下來讓我們在 main.dart 上進行 Firebase 的初始化

import 'package:flutter/material.dart';
import 'package:flutterfire_demo/firebase_options.dart';

void main() async {
  await Firebase.initializeApp(
    options: DefaultFirebaseOptions.currentPlatform,
  );

  runApp(const MyApp());
}

到這個步驟時目前與 Firebase 的關係已經建立起來了
後續便可以透過控制台的各項功能去新增並修改
包含認證授權、資料庫、傳簡訊功能...
後續的篇章也會再挑幾項主題來進行介紹


強而有力的官網後盾
30天Flutter手滑系列 - Firebase 設定


上一篇
通徹 Flutter 學習路徑 Day 16 - 今天來談談 Splash Screen
下一篇
通徹 Flutter 學習路徑 Day 18 - 今天來聊一下設計架構(MVVM)
系列文
通徹 Flutter 學習路徑30
圖片
  直播研討會
圖片
{{ item.channelVendor }} {{ item.webinarstarted }} |
{{ formatDate(item.duration) }}
直播中

尚未有邦友留言

立即登入留言