Next JS & WordPress：使用 Next & WP 建構快速的 NextJS 網站

Contents

這門課程教授開發人員如何使用 Next.js 和 Headless WordPress 來建構功能豐富的房地產網站。它涵蓋了使用 GraphQL 查詢儲存在 WordPress 中的資料、使用 Tailwind CSS 設計元件以及使用 Verce l部署網站等主題。建議參與者具有 React JS 的基本瞭解。

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

作為前端/React JS 開發人員，增加您的價值並提升您的知識
學習下一個 JS
使用 Next JS（使用 React JS 和 GraphQL）建立一個靜態的、伺服器編譯的、內容驅動的網站
了解如何使用 GraphQL 和 GraphiQL 查詢儲存在 WordPress 中的資料
將 WordPress 設置為建構內容的後端，然後使用 React JS 和 GraphQL 將內容呈現為頁面
使用 Vercel 部署您的 Next JS 靜態網站並在內容更改時重建
了解如何使用 Tailwind CSS 設計 Next JS 應用程式的樣式
了解如何使用 ACF pro 建立自訂的 Gutenberg blocks (塊)
使用 React 上下文和 React Hooks
建立自訂的 React Hooks
使用 Next JS 建立 api 端點

要求

對 React JS 有基本的了解

課程說明

你想提高你的 React JS 技能並增加你作為前端開發人員的價值嗎？

通過使用 Headless WordPress 後端學習 Next.js 來提升您的 React 技能！我們將在 Next JS 建構的網站使用 React JS 和 GraphQL ，從給定資料集生成和建構靜態頁面。本課程將著眼於將 WordPress 設置為 headless (無頭) CMS，同時使用 NextJS 從 WordPress 資料（例如自訂的貼文類型、頁面、選單、媒體、進階自訂欄位，以及更多！ ) 使用 GraphQL 查詢該資料。

沒錯，我們實際上可以使用 GraphQL 查詢 WordPress 資料！

我們將在本課程中創作一個房地產代理網站，在本地查看 Next JS 和 WordPress 的初始設置和開發，將 Gutenberg 塊映射到 React 組件，建立我們自己的自訂的 Gutenberg 塊，使用 Tailwind CSS 設計這些組件並查詢 WordPress和 Gutenberg 資料與 GraphQL 自動生成我們的靜態頁面。

我們將看看如何使用 GraphiQL 瀏覽器工具透過 GraphQL 查詢 WordPress 資料。我們也會接觸一點 WordPress 程式碼，但不會太多——這裡的主要焦點是 Next JS。一旦我們熟悉並對 NextJS 和 WordPress 開發得心應手，我們將繼續使用 Vercel 設置和部署一個實時運作的網站，每次我們使用 webhooks 在 WordPress 後端更新內容時，就會重新建構我們的靜態網頁。

建議您對 React 有基本的了解。我們將涵蓋 Next.js、WordPress、GraphQL 和 Tailwind CSS 的所有其他內容！

超越競爭對手！

Next.js 建構最快的網站。我們不會在請求時等待生成頁面，而是使用 Next JS 中的靜態生成功能來預構建頁面並將它們提升到全球雲端伺服器（為此我們將使用 Vercel）——不管用戶身在何處，都可立即交付給他們。

無需等待 API 響應
無需等待根據請求的資料渲染組件
沒有加載旋轉器( spinners )！
無需等待伺服器編譯頁面以提供給瀏覽器 – 這些頁面已經預編譯並準備好立即提供給您的用戶！

目標受眾

想要使用 Next JS 學習更好的方法來使用 WordPress、React JS 和 GraphQL 建立靜態的、內容驅動的網站的 React JS 開發人員

講師簡介

Tom Phillips 12 年以上前端 Web 開發人員

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

早在 Tom 本人還是一名初級開發人員時，他有幸得到了該領域專家的指導。這使他能夠在他的職業生涯中迅速取得進步，並在他作為專業前端開發人員的時間裡理解和構建多個大型專案。現在 Tom 正在移轉價值並分享他的知識。通過註冊他的一門課程，獲得相當於他當初所獲得的幸運指導，快速了解您在前端 Web 開發方面的理解和知識。