跳到內容

入門

歡迎閱讀 Next.js 文件!

入門指南部分將幫助您建立第一個 Next.js 應用程式,並學習您在每個專案中都將使用的核心功能。

先決條件知識

我們的文件假設您對 Web 開發有一定了解。在開始之前,如果您熟悉以下內容,將會很有幫助:

  • HTML
  • CSS
  • JavaScript
  • React

如果您是 React 新手或需要複習,我們建議您從我們的React 基礎課程開始,以及Next.js 基礎課程,該課程讓您在學習的同時構建一個應用程式。

後續步驟

安裝

瞭解如何使用 `create-next-app` CLI 建立新的 Next.js 應用程式,並設定 TypeScript、ESLint 和模組路徑別名。

專案結構

瞭解 Next.js 中的資料夾和檔案約定,以及如何組織您的專案。

佈局和頁面

瞭解如何建立您的第一個頁面和佈局,並使用 Link 元件在它們之間進行連結。

連結和導航

瞭解內建導航最佳化(包括預取、預渲染和客戶端導航)如何工作,以及如何最佳化動態路由和慢速網路的導航。

伺服器和客戶端元件

瞭解如何使用 React 伺服器和客戶端元件在伺服器或客戶端上渲染應用程式的各個部分。

快取元件

瞭解如何使用快取元件並結合靜態和動態渲染的優點。

資料獲取

瞭解如何獲取資料並流式傳輸依賴於資料的內容。

更新資料

瞭解如何使用伺服器函式修改資料。

快取和重新驗證

瞭解如何在應用程式中快取和重新驗證資料。

錯誤處理

瞭解如何顯示預期錯誤並處理未捕獲的異常。

CSS

瞭解將 CSS 新增到應用程式的不同方法,包括 Tailwind CSS、CSS Modules、全域性 CSS 等。

影像最佳化

瞭解如何在 Next.js 中最佳化影像

字型最佳化

瞭解如何在 Next.js 中最佳化字型

元資料和 OG 影像

瞭解如何將元資料新增到您的頁面並建立動態 OG 影像。

路由處理程式

瞭解如何使用路由處理程式

代理

瞭解如何使用代理

部署

瞭解如何部署您的 Next.js 應用程式。

升級

瞭解如何將您的 Next.js 應用程序升級到最新版本或 Canary 版本。