nextjs是基於React的服務端渲染框架。
Next.js 擁有一流的“開發者體驗”和許多內置功能；其中的一個例子是：
- 一個直觀[的基於頁面的路由系統，支持動態路由
- 預渲染，靜態生成和服務器端渲染均以每頁爲基礎支持
- 自動拆分代碼以加快頁面加載速度
- 具有優化預取的客戶端路由
- 內置 CSS和Sass 支持，並支持任何CSS-in-JS庫
- 支持快速刷新的開發環境
- 使用無服務器功能構建 API 端點的
- 完全可擴展
Next.js 用於數以萬計的面向生產的網站和 Web 應用程序，其中包括許多世界上最大的網站。
創建next.js應用
npx create-next-app nextjs-blog --use-npm --example "https://github.com/vercel/next-learn-starter/tree/master/learn-starter"
運行應用
npm run dev
Next.js 中的頁面
在 Next.js 中，頁面是從pages目錄中的文件導出的 React 組件。
頁面與基於其文件名的路由相關聯。例如，在開發中：
-
pages/index.js與/路由相關聯。 -
pages/posts/first-post.js與/posts/first-post路由相關聯。
我們已經有了這個pages/index.js文件，所以讓我們創建pages/posts/first-post.js看看它是如何工作的。
創建新頁面
下創建posts目錄pages。
使用以下內容創建一個first-post.js在posts目錄內調用的文件：
export default function FirstPost() {
return <h1>First Post</h1>
}
組件可以有任何名稱，但您必須將其導出爲default導出。