Gatsby JS & Firebase: 混合的 Gatsby 即時 + 靜態網站

Contents

使用即時 firestore、雲端功能、儲存、授權、 Gatsby + React hooks & GraphQL 建立 Gatsby JS 靜態網站( Static Site )。

從這 5 小時的課程，你會學到

增加你作為一個 React 開發人員的價值
瞭解 Gatsby
設定 Gatsby 以便從儲存在 Firebase 中的資料生成頁面
使用 firestore 實施即時聊天/評論部分
使用 firebase 身份驗證服務提供註冊和登入功能
使用 firebase 雲端函數進行伺服器端身份驗證
在雲端儲存中使用 firebase 雲端函數來上傳檔案
瞭解如何使用 Gatsby JS 應用程式中的 GraphQL 查詢 firestore 資料

要求

基本理解 React、git、終端命令和 npm 是必需的，其他一切都將在課程中說明

課程說明

作為一個前端/React JS/Gatsby 開發人員，你想增加自己的價值嗎？

那麼這個 React Hooks 的 Gatsby JS & Firestore 課程就是為你準備的！

學習運用 Firebase 的 Gatsby.JS 框架來提升你的 React 能力 – 這是一個非常棒的混合堆棧( HYBRID stack )，我們可以在 Gatsby.JS 中從 firestore 中儲存的資料生成靜態頁面，同時也支援動態和即時功能，比如登入/註冊和即時聊天和評論

我們將建立 “Gatsby book club” – 我們將研究如何使用 GraphiQL 瀏覽器工具通過 GraphQL 在 Gatsby 中查詢 Firestore 資料。

我們將設定 Gatsby 以基於儲存在 firestore 中的資料建構靜態網站( Static Site )，並基於 GraphQL 查詢建構 firebase 雲端儲存。我們將使用 firestore 的即時功能為每本書實施即時聊天/評論部分，並將使用 firebase 身份驗證服務為 Gatsby 應用程式提供即時註冊和登入功能。

一個應用程式沒有管理部分就不完整，所以我們將在我們的 Gatsby 應用程式實現一個管理部分，允許管理員建立新的作者和新的書籍，以及使用附有 firebase 雲端儲存的 firebase 雲端功能實現檔案上傳功能。

一旦我們完成了我們的 Gatsby 應用程式，我們將看看如何使用 Netlify 部署 Gatsby 網站的實時運作版本，並實施一個在添加新書時 Gatsby 網站會自動重建。

用 Gatsby 快速超越競爭！

Gatsby.js 建立有可能的速度最快網站。與其給予請求後等待生成頁面，Gatsby 預先建立多個頁面並將它們提到全球伺服器雲端(我們將使用 Netlify) – 隨時可以在你的使用者面前呈現，無論他們在哪裡。

Gatsby 的一些優勢包括:

無需等待 API 反應
無需等待根據請求的資料呈現元件
不需載入旋轉器( spinners )！
無需等待伺服器編譯一個頁面餵給瀏覽器 – 這些頁面已經由 Gatsby 預先編譯，並且可以立即提供給你的使用者！

我們肯定會在這 Gatsby 課程涵蓋非常多的資訊！

學生們對這門課的看法:

⭐️⭐️⭐️⭐️⭐️ “這個 Gatsby.js 課程的創作非常出色。強烈推薦中級 React.js 開發人員來上。”- Siegfred Balona

⭐️⭐️⭐️⭐️⭐️ “對於已經熟悉 React 的開發人員來說，這是一個非常好的課程。我花了 4 天時間才完成課程。它涵蓋了 Gatsby 的許多很實用的部分，可以立即適用於實戰專案。我必然會從 Tom 那裡學到更多的課程。” – Ye Joo Park

⭐️⭐️⭐️⭐️⭐️ “講師的闡述清楚明瞭，課程很好地被建立。我建議你事先了解關於 Gasby 的要點，因為這裡有許多半進階的 Gatsby 技巧(這是一個很好的學習)。” – Ole Ulrik Skipperud

目標受眾

希望增加自己作為 React/前端開發人員價值的 Web 開發人員
希望學習如何使用 Firebase 特性(如 firestore、雲端功能和雲端儲存)的 Web 開發人員
想要學習 GraphQL 並使用 GraphQL 查詢 Firestore 資料的 React 開發人員
想要學習如何使用 Gatsby 框架生成靜態網站的 React 開發人員

講師簡介

Tom Phillips 前端網頁專家和行動開發者 ( 更多講師主講課程介紹 )

多年來，Tom Phillips 一直在英國開發前端網頁和行動應用程式。在這段時間裡，他不得不為初級開發人員準備並教授最新的前端網頁框架的多門課程，並在初級開發人員的早期指導他們。通過這樣做，Tom 找到了有效的方法來教授和打破許多開發人員在嘗試開始新框架時所面臨的常見複雜問題，特別是在這樣一個迅速變化的領域，作為前端網頁開發。現在他把這些方法應用到他的 Udemy 課程中了！

早在 Tom 自己還是個初級開發人員的時候，他很幸運地受到了這個領域專家的指導。這使得他在職涯中得到了迅速的進步，並且在他作為專家的前端開發人員的時候理解和建構了多個大型專案。現在 Tom 正在扮演專家的角色與責任，分享他的知識。通過參加 Tom的一門課程，獲得與 Tom 一樣的指導並在前端網頁開發中快速追蹤你的理解和知識。

英文字幕：有

想要了解如何將英文字幕自動翻譯成中文? 請參考這篇 How-To

點選這個 Network & Security 課程✨優惠連結✨ ( NT370 起限時特價中 ) | Udemy 永久擁有課程 ( 在電腦瀏覽器登入，點選“優惠連結”後再回想要的課程介紹中點選“報名參加課程”即可取得）
Udemy 現在越來越多課程有中文字幕，請參考 Soft & Share 中文線上課程
手機上點選優惠連結看到的價格比電腦上看到的貴
＄代表當地貨幣, 如在台灣為 NT
點選”報名參加課程”有可能因瀏覽器 cookies 轉久一點或回報錯誤而無法連上，請稍等刷新或重新點選就會出現