React-Blog：部署与运维的完整指南（Docker+PM2）

React-Blog部署与运维的完整指南DockerPM2【免费下载链接】react-blogreact hooks koa2 sequelize mysql 构建的个人博客。具备评论、通知、上传文章等等功能项目地址: https://gitcode.com/gh_mirrors/rea/react-blogReact-Blog 是一个基于 react hooks koa2 sequelize mysql 构建的个人博客系统具备评论、通知、上传文章等完整功能。本指南将带你通过 Docker 容器化部署和 PM2 进程管理实现博客系统的快速搭建与稳定运行。1. 环境准备快速搭建基础环境1.1 安装核心依赖确保系统已安装以下工具Node.js(v12)用于运行前端 React 应用和后端 Koa 服务Docker Docker Compose实现容器化部署Git用于拉取项目代码1.2 获取项目代码通过 Git 克隆仓库到本地git clone https://gitcode.com/gh_mirrors/rea/react-blog cd react-blog2. 项目构建前端与后端打包2.1 安装项目依赖分别安装前端和后端依赖# 安装前端依赖 npm install # 安装后端依赖 cd server npm install2.2 构建前端静态资源使用项目内置脚本构建生产环境资源# 返回项目根目录 cd .. # 执行构建命令定义在 package.json 第 78 行 npm run build构建完成后静态文件将生成在build目录下可直接通过 Nginx 提供服务。3. Docker 部署容器化方案详解3.1 创建 Dockerfile在项目根目录创建Dockerfile定义应用运行环境# 基础镜像 FROM node:12-alpine # 设置工作目录 WORKDIR /app # 复制依赖文件 COPY package*.json ./ COPY server/package*.json ./server/ # 安装依赖 RUN npm install RUN cd server npm install # 复制项目文件 COPY . . # 构建前端资源 RUN npm run build # 暴露端口前端 3000/后端 4000 EXPOSE 3000 4000 # 启动命令 CMD [npm, run, start:prod]3.2 编写 docker-compose.yml创建docker-compose.yml管理多容器服务version: 3 services: app: build: . ports: - 3000:3000 - 4000:4000 environment: - NODE_ENVproduction - DB_HOSTmysql - DB_USERroot - DB_PASSpassword - DB_NAMEreact_blog depends_on: - mysql mysql: image: mysql:5.7 ports: - 3306:3306 environment: - MYSQL_ROOT_PASSWORDpassword - MYSQL_DATABASEreact_blog volumes: - mysql-data:/var/lib/mysql volumes: mysql-data:3.3 启动容器集群通过 Docker Compose 一键启动所有服务docker-compose up -d-d参数后台运行容器首次启动会自动构建镜像耗时约 5-10 分钟4. PM2 进程管理确保服务稳定运行4.1 安装 PM2全局安装 PM2 进程管理器npm install -g pm24.2 创建 PM2 配置文件在项目根目录创建ecosystem.config.jsmodule.exports { apps: [ { name: react-blog-frontend, script: scripts/start.js, // 前端启动脚本package.json 第 76 行 env: { NODE_ENV: production, PORT: 3000 } }, { name: react-blog-backend, script: server/app.js, // 后端入口文件 env: { NODE_ENV: production, PORT: 4000 } } ] };4.3 启动与管理服务使用 PM2 启动应用并监控状态# 启动所有服务 pm2 start ecosystem.config.js # 查看服务状态 pm2 status # 查看日志 pm2 logs # 设置开机自启 pm2 startup pm2 save5. 环境变量配置灵活调整项目参数项目通过环境变量实现多环境配置核心配置文件位于前端环境变量config/env.js定义process.env变量后端环境变量server/config/index.js第 1 行判断开发/生产环境常用环境变量说明NODE_ENV环境标识development/productionPORT服务端口号默认前端 3000/后端 4000DB_HOST/DB_USER/DB_PASS数据库连接参数6. 常见运维任务日常维护指南6.1 数据库备份定期备份 MySQL 数据# 容器内执行备份 docker exec react-blog_mysql_1 mysqldump -u root -ppassword react_blog backup.sql6.2 应用更新拉取最新代码并重启服务# 拉取代码 git pull # 重新构建前端 npm run build # 重启 PM2 服务 pm2 restart all6.3 性能监控使用 PM2 内置监控工具# 实时监控 CPU/内存使用 pm2 monit # 生成性能报告 pm2 report7. 部署方案对比选择最适合你的方式部署方式优点缺点适用场景Docker 容器化环境一致、部署简单资源占用较高生产环境、多服务协同PM2 直接部署轻量高效、配置灵活依赖系统环境开发环境、单服务器部署通过本指南你已掌握 React-Blog 的完整部署流程。无论是容器化方案还是直接进程管理都能确保博客系统稳定运行。如需进一步优化可考虑添加 Nginx 反向代理和 HTTPS 配置提升系统安全性和访问速度。【免费下载链接】react-blogreact hooks koa2 sequelize mysql 构建的个人博客。具备评论、通知、上传文章等等功能项目地址: https://gitcode.com/gh_mirrors/rea/react-blog创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考