react+koa全栈开发 以及 部署流程

  1. 前端开发
  2. 后端开发
  3. 部署

前端开发

  1. 前端使用react、sass、TS、vite、pnpm进行开发,太详细的这里就不展开说了
  2. 项目创建可以参考我的另外一篇文章 优雅地创建一个前端项目

后端开发

  1. 后端使用node,使用koa框架进行开发,数据库我使用的是一个mysql的云数据库,但是大家只要能够连接上自己的数据库就行
  2. 后端开发详情参考我的另外一篇文章 koa基础配置

部署

服务器

  1. 我买了一个华为云服务器
  2. 但是你用什么服务器不重要,只要公网能访问就行
  3. 我服务器的配置是2G+2核+CentOS操作系统

XShell连接服务器

  1. 填写主机
  2. 填写账号密码


安装宝塔

  1. 登录宝塔
  2. 复制一下服务器操作系统对应的安装方法,我的是CentOS的,就复制了第一条
  3. 到XShell中粘贴运行一下,一键自动安装宝塔
  4. 安装好宝塔之后别急着关XShell,要记得记住自己的宝塔地址以及相应的账号密码这些

服务器安装软件

  1. 在宝塔的"软件商店"中安装node版本管理器、nginx

node安装

  1. 事先说一下,我使用的包管理是pnpm,而pnpm要求node版本至少16.14,并且我本地的node版本是16.14.0
  2. 使用node管理器下载了16.14.2版本的node,在这个版本的node里面下载了pnpm
  3. 注意:
    1. 如果你找不到16.14版本的node,可以更新版本列表",这样大概就可以看见了
    2. node的版本尽量跟你本地开发的node版本差不多
  4. 坑:如果你安装了低版本的node,又想要使用pnpm,宝塔是不会给你报错的!!!

项目上线

  1. 将项目从本地移动到服务器上,我放在了www文件夹下面(要注意的是不要直接上传node_module文件夹,大概率你也上传不了)
  2. 在"网站"栏中添加node项目,进行相关信息的填写,等待下载依赖
  1. 如果依赖没下载成功可以事后自己再下载一下

nginx配置

  1. nginx配置,详情参考我的另外一篇文章 nginx配置过程

项目启动

  1. 项目启动可以在宝塔上面进行,也可以在XShell中进行
  2. 如果在宝塔上面没启动成功,可以检查一下自己的启动命令有没有错误,以及可以尝试在XShell中启动
  3. XShell中启动项目,首先要把node配置一下全局环境变量,可以参考一下这篇文章,大概就是找到root/etc/profile,然后添加你对应node的环境变量;然后node启动你的项目,看看有没有什么报错,解决一下,再启动
相关推荐
吳所畏惧8 小时前
宝塔面板Redis密码修改指南:SSH命令修改 vs 面板UI界面修改,哪个更靠谱?
运维·服务器·数据库·redis·缓存·ssh
DFT计算杂谈8 小时前
无 Root 权限在 Tesla K80 零门槛部署 DeepSeek 大模型
linux·服务器·网络·数据库·机器学习
维天说9 小时前
CLI-Switch 2026年3月版历史设计:Hook、TTY 隔离与 JSON 状态
java·服务器·json
Zhang~Ling9 小时前
从 fopen 到 struct file:从零开始拆解 Linux 文件 I/O
linux·运维·服务器
hoLzwEge9 小时前
拯救低效调试!code-inspector-plugin 让代码定位如虎添翼
前端·前端框架·node.js
爱写代码的阿森10 小时前
鸿蒙三方库 | harmony-utils之PreferencesUtil首选项数据监听详解
服务器·华为·harmonyos·鸿蒙·huawei
爱写代码的森10 小时前
蒙三方库 | harmony-utils之FileUtil文件重命名与属性查询详解
linux·运维·服务器·华为·harmonyos·鸿蒙·huawei
郝亚军11 小时前
使用Vue 3和Nginx打包和部署Vue.js项目的一般步骤
前端·vue.js·nginx
吠品11 小时前
Zabbix Web界面误报Server未运行的排查与解决
java·服务器·数据库