Gatsby JS: 使用 GraphQL 和 React + WordPress 建立 PWA 部落格

Contents

使用 GraphQL 和 React + WordPress 建立 Gatsby JS 漸進式 Web 應用程式，將這些技能加入你的技能樹

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

如何使用 Gatsby JS 建立令人驚訝的快速網站
如何使用 Gatsby
如何在 Gatsby JS 中使用全域性 CSS 和模組 CSS
如何使用 GraphQL
如何在 Gatsby 中使用版面設計
如何使用 Markdown Remark 作為資料來源
如何使用 WordPress 為來源資料
如何最佳化你的網站 SEO
如何使用 Lighthouse 做好一個網站的稽核和評分改善工作
如何使用 Netlify 部署你的網站
使用 GitHub + Netlify 實現持續部署
如何在 Netlify，WordPress 和 GitHub 上使用 Webhooks

要求

對 ReactJS 的瞭解 ( 請參考 React 前端開發學習地圖 )
Javascript ES6 的知識 ( 請參考 ES6 線上課程 )

課程說明

Gatsby JS 是一個基於 React 的免費開源框架，可以幫助開發者可以建立網站和應用程式的快速靜態網頁生成器。

但這究竟意味著什麼呢？

嗯… 它將 React、 Webpack、 React-router、 GraphQL 和其它前端工具的最佳部分組合在一起，為開發人員創造了一個令人愉快的工具！

有了 Gatsby JS，你可以輕鬆地使用最新的網頁技術。一切都將設定，並將等待您開始構建網頁。

Gatsby 最大的優點之一就是你可以從 headless CMS、 APIs、資料庫或者檔案系統中獲取自己的資料。

沒有限制。

你甚至可以從 WordPress 中獲取資料

這使得客戶很容易與你為他們建立的網站互動，並新增新的內容。

他們只需要在 WordPress 上更新他們的文章，僅此而已… ..。

同樣，有了 Gatsby，你不會用過去十年的技術建立一個網站。

網際網路的未來在於行動、 JavaScript 和 APIs —— JAMstack。

每個網站都是一個網頁應用程式，每個網頁應用程式都是一個網站。

使用 Gatsby 很容易使您的專案變成一個靜態漸進式 Web 應用程式(PWA)

您可以得到開箱即用的程式碼和資料分割。

Gatsby 只加載關鍵的 HTML、 CSS、資料和 JavaScript，這樣你的網站就可以儘可能快地載入。一旦載入，Gatsby 就會為其它頁面提前獲取資源，這樣點選網站就會感覺非常快。

Gatsby.js 建立了速度最快的網站。

與等待生成請求時的頁面不同，預先建立網頁並將它們放置到全球伺服器雲端中ーー無論它們在哪裡，都可以立即交付給使用者。

所以如果你想知道在這門課上你會學到什麼，這裡是下面的列表

在本課程中，你將學習以下內容:

Gatsby JS 的要點 & 如何安裝和建立第一個專案
如何使用 Gatsby Starters 建立您的專案
如何在 Gatsby 中建立頁面及正確連結
如何將元素分解成元件和如何使用它們
如何建立可用作樣板的頁面佈局
如何使用 GraphQL
如何新增資料來源外掛
如何使用 Markdown Remark 建立頁面 / 發文
如何使用 Gatsby & Markdown Remark (JAM Stack)建立部落格
如何使用 WordPresss 作為 Headless CMS
如何新增 Metatags 提高網站的 SEO
如何建立 SEO 元件並在佈局中使用它
如何將你的專案部署到 Netlify 和 Github
如何使用 Netlify Webhooks 實現連續部署
如何使用 Lighthouse 稽核你的網站(Google 支援的業界標準)
如何創造 Lighthouse 的完美得分
如何將您的網站轉換為漸進式 Web 應用程式(PWA)
如何建立 WordPress Webhooks 用來在 Netlify 上重新部署你的專案當你建立 / 更新 / 刪除一個發文

如果你在某個地方卡住了，你也可以在課程中提出問題。

無論你什麼時候需要，我都會在那裡幫助你。

現在，我希望我的學生在購物時總是感到舒適，這就是為什麼我上傳了多個免費視訊供你隨時觀看。

此外，我還為你提供30天的退款保證，不問任何問題! 所以你沒有什麼風險，一切都可以從這個課程中獲得！

是時候採取行動了。這個優惠不會永遠有效

目標受眾

想要使用 Gatsby JS 建立快速，SEO 最佳化，靜態網站的 React JS 初學開發者

講師簡介

Rangel Stoilov 網頁開發者和企業家 ( 更多講師主講課程介紹 )

你好！我叫 Rangel ，從事網頁開發已經8年了。首先，我從 Dreamweaver 開始，通過 WordPress 作為一種簡單的方法來建立網站。在那之後，我想在 web 開發方面更進一步，所以我開始學習不同的程式語言，比如 C# 、 Java 和 JavaScript。我的專業是 Java 和 Spring Framework，現在我正在深化我對不同 JavaScript 框架的瞭解。我也有可靠性和智慧合約以及 Truffle 框架的熱情。我還投身於亞馬遜的創業精神，在外匯市場交易，以及建立自動化交易系統。