fbpx

使用 Next.js 的全端 React 應用程式 – 終極指南

課程簡介

學習如何使用 Next.js 製作出令人讚賞的伺服器端呈現( server-rendered ) React 應用程式

從這 9.5 小時的課程,你會學到

  • 使用 NextJS 建立驚人的伺服器端呈現的 React 應用程式
  • 從使用 NextJS 的快速靜態網站到具有完整 Node / Express 後端的完整應用程式,都包含在內
  • 使用 NextJS 框架增加的功能來提升你的 React 應用程式

要求

課程說明

你想要做出驚人的、高效能的、總體上更好的 React 應用程式嗎? 看看 Next.js 吧。

本課程是您學習 Next.js 框架的最佳指南。 在這個專案中,我們將製作四個完整的 React / Next.js 專案,每個專案從開始到 Web 部署。

以下是我們將要做的:

  • 一個完整的全端社群媒體應用程式,由 React.js / Next、完整的 Express API、 Mongoose / MongoDB、 Passport 認證和 Material UI 建構
  • 一個 Hacker News PWA 程式,可以離線執行,並有一個完美的(100 / 100) Lighthouse 評分
  • 一種使用有簽名的安全 cookie 使用者認證系統
  • 作為靜態網站的作品組合應用程式

含蓋哪些主題?

  • 在 Next 中使用 Cookie 身份驗證 / 從伺服器端和客戶端獲取Cookie
  • 在 Next.js 中使用 Passport 的使用者認證
  • 例如用於獲取資料和使用者身份驗證的 getInitialProps 生命週期方法
  • 受保護的路由( Routes ) / 在 Next 中保護路由
  • Next 路由器,以及頁面預抓取
  • Next.js 中的查詢參數和 Express 中的客制化路由
  • 將 Next 與客制化伺服器設定(如 Express)整合
  • 在 Next 的幫助下建構 APIs
  • 在 Next.js 中製作 PWA 應用程式(Web App Manifest 和 Service Workers)
  • 使用 Query Params 進行分頁
  • 使用 Now 部署我們的專案(包括靜態網站和 Node.js 應用程式)
  • 在 Next 中客制化 Head 元件來幫助提升搜尋引擎優化( SEO )
  • 客制化錯誤頁面用於更好的錯誤處理
  • Next 中的客制化頁面(_App 和 _Document)
  • 使用 Styled-JSX 設計我們的應用程式
  • 使用 Material-UI 建構令人印象深刻的使用者介面
  • 在 Next.js 中整合諸如 Material-UI 之類的 CSS-In-JS 選項
  • 使用 Material UI 的 Snackbar 通知
  • 還有更多… ..

目標受眾

  • 任何有興趣使用 NextJS 製作更好,更高性能的 Reac t應用程式的人
  • 有興趣擴大 React 技能組合的開發人員
  • 對 NextJS 框架提供的優勢功能感興趣的開發人員

講師簡介

Reed Barger  全端 Web 開發人員

我是一個充滿熱情的網頁開發者,熱衷於學習和教授我所知道的東西。 我相信通過實踐學習,這種哲學在我教授的每一門課程中都有體現。 我喜歡探索新的網路技術,我的課程專注於給你在今日快速發展的行業中擁有優勢。

英文字幕:有

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

參加課程 ♥找優惠折扣碼?

Sponsored by Udemy

也許你會有興趣

  • 追蹤這個 Twitter ,追蹤各種軟體開發和個人成長學習訊息

Soft & Share 新服務介紹

 歡迎使用 e-mail 訂閱 Soft & Share 

發表迴響

這個網站採用 Akismet 服務減少垃圾留言。進一步瞭解 Akismet 如何處理網站訪客的留言資料

Powered by WordPress.com.

Up ↑

%d 位部落客按了讚: