nextjs是基于React的服務(wù)端渲染框架煤篙。
Next.js 擁有一流的“開發(fā)者體驗”和許多內(nèi)置功能斟览；其中的一個例子是：
- 一個直觀[的基于頁面的路由系統(tǒng)，支持動態(tài)路由
- 預渲染辑奈，靜態(tài)生成和服務(wù)器端渲染均以每頁為基礎(chǔ)支持
- 自動拆分代碼以加快頁面加載速度
- 具有優(yōu)化預取的客戶端路由
- 內(nèi)置 CSS和Sass 支持苛茂，并支持任何CSS-in-JS庫
- 支持快速刷新的開發(fā)環(huán)境
- 使用無服務(wù)器功能構(gòu)建 API 端點的
- 完全可擴展
Next.js 用于數(shù)以萬計的面向生產(chǎn)的網(wǎng)站和 Web 應(yīng)用程序，其中包括許多世界上最大的網(wǎng)站身害。
創(chuàng)建next.js應(yīng)用
npx create-next-app nextjs-blog --use-npm --example "https://github.com/vercel/next-learn-starter/tree/master/learn-starter"
運行應(yīng)用
npm run dev
Next.js 中的頁面
在 Next.js 中味悄，頁面是從pages目錄中的文件導出的 React 組件。
頁面與基于其文件名的路由相關(guān)聯(lián)塌鸯。例如侍瑟，在開發(fā)中：
-
pages/index.js與/路由相關(guān)聯(lián)。 -
pages/posts/first-post.js與/posts/first-post路由相關(guān)聯(lián)。
我們已經(jīng)有了這個pages/index.js文件涨颜，所以讓我們創(chuàng)建pages/posts/first-post.js看看它是如何工作的费韭。
創(chuàng)建新頁面
下創(chuàng)建posts目錄pages。
使用以下內(nèi)容創(chuàng)建一個first-post.js在posts目錄內(nèi)調(diào)用的文件：
export default function FirstPost() {
return <h1>First Post</h1>
}
組件可以有任何名稱庭瑰，但您必須將其導出為default導出星持。
