1.项目结构博客：
博客项目的前端工程，使用的技术栈是Next.js + React Hooks + Antd + Axios。
：
博客项目的后端服务，使用的技术栈是 Egg.js。
行政：
博客后台管理系统，使用的技术栈是-React-App + React Hooks + Antd + Axios。
文件：
存放博客使用的静态资源（如上传的图片等文件）的目录。
2. 部署前的准备 2.1 购买云服务器
去阿里云（下面以阿里云为例）、腾讯云等云服务平台购买云服务器ECS。具体购买配置取决于您的项目规模。一般来说，1核CPU、2G内存、1M带宽的配置对于个人项目来说基本够用了。
购买成功后，您将获得一个服务器实例和对应的公网ip（您的服务器ip地址）。当前网站实际上是我们输入URL进行DNS域名解析后访问的，也就是去对应的公网ip后访问。
2.2 购买注册域名
还是去阿里云、腾讯云或者其他可以购买域名的地方挑选一个可用的域名购买。购买域名后，需要进行实名认证、域名解析（绑定公网IP与您的域名）、网站域名ICP备案、公安网上备案。详情请参阅域名购买平台使用及备案指引。
只有完成网站域名的ICP备案后，该域名才能访问对应的公网IP，即您的网站可以被公众访问。
网站域名备案审核一般需要较长时间（10-30天不等），可以同时等待项目部署，然后申请域名再做一些配置修改。
域名附加说明：
❝比如严格称为域名（全球唯一），域名与服务器公网IP一一绑定。虽然 www 只是一个主机名，但一个域名可以有多个主机，例如，❞
3. 搭建服务器环境 3.1 连接服务器
在系统上正在连接服务器，我们使用（linux系统命令行操作工具）连接服务器，输入自己的公网ip和服务器实例密码，创建一个新的连接会话。如下所示：
成功连接服务器后，进入服务器的命令行操作模式（一般默认进入根目录）。
3.2 环境搭建 3.2.1 Mysql数据库
由于博客项目本地开发使用的数据库是egg-mysql插件，所以我们需要配置mysql数据库：
1：安装mysql：
复制
2：设置mysql开机自动启动：
复制
3：mysql密码和安全一系列设置命令：
复制
注意：这里设置是否允许root远程登录的时候建议选择no（输入n），这样我们就可以远程操作mysql了。
4：本地登录mysql：
复制
然后输入密码进入msql运行环境。
5：mysql重启：
复制
6：从sql文件导入mysql数据库表：
先使用数据库名切换数据库，然后使用如下命令：
复制
可以将我们本地的数据库结构和数据导入到服务器的mysql中，这里可以通过pwd获取sql文件的绝对地址。ps：我们可以使用工具将sql文件导出到本地，然后传输到服务器。
3.2.2 安装Node环境
由于我们的博客项目是基于node环境开发和运行的，所以我们需要在linux服务器上安装node。
1：安装nvm：
NVM (Node) 是一个用于管理节点的 bash 脚本，它允许您管理多个 Node.js 版本。使用 NVM，您可以安装或卸载要使用或测试的任何版本的 Node.js。使用以下命令安装 nvm。注意不要使用 sudo，因为这将允许 root 用户启用脚本。
复制
2：安装节点：
复制
可以多次安装多个版本的node，使用nvm ls查看安装的node版本，如下图：
带箭头的行是当前 shell 会话中使用的 Node.js 版本。打开新的 shell 会话时的默认 Node.js 版本。
3：切换当前节点版本：
nvm 使用版本号
复制
4：切换node默认版本：
复制
复制
安装并设置好node版本后，就可以像在环境中一样使用npm和node的功能了
3.2.3 安装 PM2
PM2 是具有负载均衡功能的 Node 应用程序进程管理器。它可以在后台运行，主要用于守护节点进程。后面我们运行项目的时候会用到，后面会详细介绍。使用以下命令安装 node pm2 后：
复制
3.2.4 安装 Nginx
Nginx 是一个高性能的 HTTP 和反向代理 Web 服务器。我们经常将它用于项目进程端口监控、接口代理转发以及服务器静态资源路径的相关配置。细节将在后续项目运行配置中介绍。使用命令安装 Nginx：sudo yum nginx
4. 项目部署 4.1 代码上传
我们使用 Xftp 工具主要用于服务器和本地文件传输和编辑操作。同理，输入公网ip和实例密码新建一个链接会话，如下图：
然后我们可以将自己项目代码的文件夹从本地转移到服务器目录下的任意路径（建议不要放到根目录下，可能会出现一些文件权限问题）。
由于我们之前的项目代码是基于本地开发环境编写的，所以一些配置的连接ip端口（如数据库、后端服务）基本都是：xxxx。
因此，在将代码上传到服务器之前，我们可以在代码中的适当位置新建一个带有特殊ip端口配置的js文件并出去，然后通过判断当前代码环境（在线或开发）来配置不同的ip端口）。然后在需要引用ip端口的地方直接导入就可以了，不用像开发环境那样写死了。
4.2 运行项目
在运行项目之前，请确保每个项目的依赖都安装成功。
4.2.1 运行博客
回到里面，进入博客文件夹（前端项目目录），然后使用上面安装的PM2启动和守护项目进程。为什么使用 PM2 来控制项目运行，而不是项目中原先配置的命令？
因为使用原来的命令启动后，当我们与服务器断开连接时，进程会被销毁。
在这种情况下，为了使网站始终可访问，我们是否不需要我们的计算机始终打开并连接到服务器？显然这是非常不合理的！使用PM2启动守护进程就是为了解决这个问题。PM2常用命令如下：
1：创建、启动和守护一个节点项目流程：
复制
注意：一旦您创建了一个新进程并为其命名，它将永久保留在可用进程列表中，除非您将其删除。
2：查看所有创建的进程信息：
复制
3：查看指定进程的详细信息：
复制
进程id是创建新进程时产生的唯一标识，可以通过pm2 list查询。
4：启动所有/指定创建的进程：
复制
5：重新启动所有/指定的已创建、正在运行的进程：
复制
6：删除所有/指定创建的进程：
复制
7：停止所有/指定的已创建、正在运行的进程：
复制
4.2.2 操作
先切换到文件夹路径。博客前端项目运行成功后，需要启动后端服务提供接口数据支持。由于后端服务是由 egg.js 开发的，所以值得一提的是框架内置的 egg- 不需要 pm2 进程守护进程，见下图官方说明。所以我们可以通过执行 npm start 或 npm stop 直接在服务器上启动和停止后端服务。
附加说明：
因为mysql数据库默认是不允许通过公网ip直接连接的。所以在egg中的egg-mysql配置中，无论是在线环境还是开发环境，还是配置了本地ip端口（通常是：3306），然后在线环境中，我们会配合nginx配置要实现连接成功，请阅读下面的 nginx 配置部分。
4.2.3 运行管理员
首先切换到管理文件夹路径。博客的后台管理项目是用-react-app脚手架搭建的。由于是基于生产环境打包生成静态资源文件，所以我们需要使用Nginx来配置它的服务器访问路径，后面会详细介绍。在此之前，我们可以执行 npm run build 将生产环境使用的静态资源文件打包生成，默认生成在 admin 的 bulid 文件夹中。
4.3 Nginx 配置 4.3.1 配置前准备
Nginx 会对每个项目进行端口监控配置。请确保一些必要的服务器端口（例如网站首页默认的80端口和mysql数据库的3306端口）开放使用。以阿里云为例，其端口配置是通过服务器实例-安全组规则配置来设置的。另外，我们还要为nginx开放一些端口（端口号可以自定义），为每个项目进程配置端口代理转发。
4.3.2 配置说明
即使上面的项目运行成功后，我们仍然忍不住要知道如何在浏览器中访问相应的页面。这时候，我们就需要 Nginx 大显身手了。
nignx 配置文件的一般默认路径是 /etc/nginx/nginx.conf。
我们打开文件，进行基本配置，并给出配置项的详细说明。
如以下示例所示：
复制
配置保存后记得执行 nginx -s 重启使配置生效。Nginx的配置对于新手来说调试还是需要一点时间的，所以这里我们要多多尝试，查询必要的数据。配置完成并通过访问之后，我们初步的服务器部署流程就基本结束了，接下来主要要做的就是项目的维护了。
原文：.club/
复制
