便宜VPS网Next.js是一个基于React的Javascript框架，它允许开发人员创建服务器端渲染和静态生成的React应用程序。
一、安装NodeJS和NPM
1、安装curl.
$ sudo apt-get install curl
2、添加最新的稳定版本的NodeJS。
$ curl -sL https://deb.nodesource.com/setup_14.x | sudo -E bash -
3、安装NodeJS
$ sudo apt-get install nodejs
4、验证安装。
$ node -v $ npm -v
二、设置
1、更改到首选的项目根文件夹。
$ cd /path/to/desired/folder/
2、使用npx CLI构建工具初始化Next.js项目开发环境。将my-project替换为所有小写的项目名称。
$ npx create-next-app my-project
3、更改到项目目录，列出目录内容。
$ cd my-project$ ls
4、项目的文件结构应该类似于以下(不包括node_modules和package-lock.json):
path/to/project/
├── package.json
├── pages
├── public
├── README.md
└── styles
5、启动开发服务器。
$ npm run dev
6、控制台报告后:
ready - started server on http://localhost:3000
在web浏览器中导航到端口3000上的服务器IP。
http://192.0.2.123:3000/
三、验证网页说欢迎来到Next.js!
要为你的项目创建一个优化的生产版本，用CTRL + C关闭开发服务器，然后运行:
$ npm run build && npm run start
命令完成后，web服务器开始为您的web应用程序提供服务。导航到端口3000上的服务器IP，并查看生产版本。这次它的加载速度应该会快得多。
四、静态文件的自定义服务器
要使用服务器如Nginx或Apache来存放文件，导出项目的静态构建。你的项目可能会失去一些功能，因为像API路由这样的特性对于静态站点是不可用的。要使用服务器并保存这些动态函数，请参考Next.js自定义服务器API。
要使用自己的服务器，请编辑软件包。json文件在项目的根目录。在scripts对象下添加另一个脚本，键为export，值为next export。你的修改方案。json应该是这样的:
{ "name": "my-project", "version": "0.1.0", "private": true, "scripts": { "dev": "next dev", "build": "next build", "start": "next start", "export": "next export" }, "dependencies": { "next": "10.0.3", "react": "17.0.1", "react-dom": "17.0.1" }}
在编辑package.json文件后，运行以下命令生成web应用的静态构建:
$ npm run build && npm run export
在项目目录中查找命名为out的文件夹，其中包含导出的项目。使用此文件夹直接为静态web应用程序提供您选择的服务器。
