如何使用 Firebase 的雲端服務來建立產品
這裡將以「前端工程師」的角度，從無到有搭建資料庫、檔案儲存、後端程式(API)、多平台登入、前端程式(CSR 或是 SSR)等服務節點，這一系列的文章用來記錄，我個人的探索過程。
選擇 Firebase 來作為全產品的雲端服務據點。雖然 AWS、Azure、GCP 本家等等...可能也是好的選擇，單純做第一次的嘗試，選一個順眼的來作為建置基地，我想要的功能都有提供，也能快速地從他的產品標題和介紹得知是我想要的功能，所以不用想太多，直接開始研究。
接下來就開始本文的主題。
服務介紹
我會用到的核心服務：
- Cloud Firestore: 資料庫功能，是 NoSQL DB，可用撰寫後端程式做資料的讀寫，Firebase 還有提供另外兩種資料庫的功能服務，但這個系列不會用到，所以暫時略過。
- Storage: 靜態檔案空間功能，可用撰寫後端程式上傳、下載資源。
- Functions: 後端程式功能，我會用
Node.js撰寫 API，串接資料庫、靜態資源空間和前端程式。 - Hosting: 靜態網頁的部署空間，有串接 Github Actions 可以在 push 到主要分支時，同時做部署，像是純 SSG 和 CSR 的靜態網頁都可以用這個服務簡單處理。
- App Hosting: 前端網頁的部署空間，但這個與前面一個
Hosting最大的不同是，這個是用來放置動態的應用，像是Nuxt.js和Next.js所建置的網頁。因為我是慣用的前端框架Vue.js的前端，所以之後我會用Nuxt.js來做介紹。 - Authentication: 使用者登入管理，目前還不太確定這個好不好用，各家平台和瀏覽器關於隱私權的功能迭代都很快，不確定這個服務是否有跟上，目前看到官方範例的 repo issue 已經有人說不能用了，等之後寫到這個服務會再做後續的更新。
- Firebase CLI: 雖然這一項跟上面列的功能，類別不同，但因為這個工具會貫穿所有服務，開發者一定會用到，支援
Firebase Emulator的這個功能「本地虛擬器」可以在本地端測試資料庫和後端程式等等，就不用擔心在測試階段會吃掉流量。
研究路徑
寫文的當下，我的研究進度如下圖：
假設我現在要開發一個免登入（私人）的 App，我把我會用到的功能和 Firebase 的服務做對應：
- 前台操作的 App：Hosting
- 我會用
Nuxt.js寫一個純CSR網頁，我會需要一個網路空間放置我的前台 App，所以我要用到 Hosting 來處理。
- 我會用
- API：Functions
- 我會用
Node.js寫 API 來串接資料庫並操作他，所以我要用到 Functions 來撰寫 API endpoint。
- 我會用
- 資料庫存取資料：Cloud Firestore
- 不用多作解釋，需要有個空間可以存取前台給的資料，所以我要用到 Cloud Firestore 來做資料庫存取。
- 上傳圖片和圖片路徑：Storage
- 要可以上傳圖片，把圖片路徑存在資料庫，需要時讀取，所以我要用到 Storage 來做上傳檔案的功能。
當然，這樣其實不太夠，以一個比較完整的 SPA 服務來說，我個人未來的目標藍圖是下圖：
最後，這也不是研究的終點，如果是需要 SSR 的服務，就要用到 App Hosting 而不是 Hosting ，不過這個就等到下個系列再處理了。
結論
規劃好目前的研究目標後，就逐步挖掘 Firebase 的使用方式和程式開發，下一篇文章會開始正式探索 Firebase 的開發者後台和功能啟用。
期待 demo app 完成的一天。下一篇文章再見～