建立 Next.js 應用程式

要從頭開始使用 React 建置完整的 Web 應用程式，您需要考慮許多重要的細節：

• 程式碼必須使用 webpack 之類的打包器打包，並使用 Babel 之類的編譯器進行轉換。
• 您需要進行生產優化，例如程式碼拆分。
• 您可能希望靜態預渲染某些頁面以提高性能和 SEO。您可能還想使用伺服器端渲染或客戶端渲染。
• 您可能需要編寫一些伺服器端程式碼來將您的 React 應用程式連接到您的資料庫。

一個框架可以解決這些問題。但是這樣的框架必須具有正確的抽象級別——否則它不會很有用。它還需要具有出色的“開發人員體驗”，確保您和您的團隊在編寫程式碼時擁有令人驚嘆的體驗。

Next.js：React框架

進入Next.js，即 React 框架。 Next.js 為上述所有問題提供了解決方案。但更重要的是，它會讓你和你的團隊在建置 React 應用程式時落入成功的陷阱。

Next.js 目標是擁有良好的開發人員體驗和許多內置功能，例如：

• 直觀的基於頁面的路由系統（支援支援動態路由）
• 每個頁面都可支援預渲染，靜態生成(SSG) 和伺服器端渲染(SSR)
• 自動程式碼拆分以加快頁面載入速度
• 具有優化預取的客戶端路由
• 內置 CSS和Sass 支援，支援任何CSS-in-JS庫
• 支援快速重新整理的開發環境
• 使用無伺服器函數建置 API 端點的API 路由
• 完全可擴充

Next.js 用於數以萬計產品方面的網站和網路應用程式，其中包括許多世界上知名的品牌。

關於本教學

這個免費的互動課程將指導您了解如何開始使用 Next.js。

在本教學中，您將通過創建一個非常簡單的部落格應用程式來學習 Next.js 基礎知識。這是最終結果的範例：

https://next-learn-starter.vercel.app（原始碼）

加入討論

如果您對與 Next.js 或本課程相關的任何問題有任何疑問，歡迎您在Discord上向我們的社群提問。

讓我們開始吧！

現在開始 →