# website-cms

**Repository Path**: zengchen1024/website-cms

## Basic Information

- **Project Name**: website-cms
- **Description**: No description available
- **Primary Language**: Unknown
- **License**: Not specified
- **Default Branch**: main
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 0
- **Forks**: 0
- **Created**: 2026-08-28
- **Last Updated**: 2026-09-17

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 官网内容管理系统案例

## 案例背景

本案例模拟一个企业官网与后台内容管理系统，包含前台展示、后台登录、新闻与案例管理、留言管理、文件上传和部署配置。它适合用于讲解内容管理系统、认证授权、前后端分离和上线部署流程。

## 目录结构

| 目录 | 说明 |
|------|------|
| `frontend-cms` | React + Vite 前台和后台管理端 |
| `backend-spring` | Spring Boot 后端，包含认证、内容、留言、文件上传和管理接口 |

## 开发环境

| 依赖 | 版本 | 用途 |
|------|------|------|
| JDK | 17 | 后端编译与运行 |
| Node.js | 18+ | 前端构建与开发服务器 |
| Docker + Docker Compose | - | 启动本地 MySQL |

Ubuntu 安装示例：

```bash
# JDK 17
sudo apt-get update && sudo apt-get install -y openjdk-17-jdk

# Node.js 18+（推荐使用 nvm 或 NodeSource 安装）

# Docker（含 compose 插件）
# 安装步骤见 https://docs.docker.com/engine/install/ubuntu/
```

后端使用 Maven Wrapper（`./mvnw`），首次运行会自动下载 Maven，无需单独安装。

## 本地启动

### 后端

```bash
cd backend-spring

# 1) 准备环境变量（首次）
cp .env.example .env
# 编辑 .env，至少修改 JWT_SECRET 与 APP_INITIAL_ADMIN_PASSWORD

# 2) 启动 MySQL（首次启动自动建库建表）
sudo docker compose up -d

# 3) 加载环境变量并启动后端
set -a && source .env && set +a
./mvnw spring-boot:run
```

默认端口为 `8080`。数据库、JWT 和对象存储配置见 `backend-spring/.env.example` 与 `src/main/resources/application.properties`。

> 也可直接执行 `bash backend-spring/setup-local-env.sh` 一键完成「安装 JDK 17 + 启动 MySQL」。
> 首次启动会自动创建管理员账号 `admin`，密码为 `.env` 中的 `APP_INITIAL_ADMIN_PASSWORD`。

#### 编译与构建

```bash
cd backend-spring

# 清理后重新编译（删除 target/ 并重新编译，产物在 target/classes）
./mvnw clean compile

# 打包为可执行 jar（含测试，产物位于 target/OfficialSiteBackend-0.0.1-SNAPSHOT.jar）
./mvnw clean package

# 跳过测试打包
./mvnw clean package -DskipTests
```

运行打包产物：

```bash
set -a && source .env && set +a
java -jar target/OfficialSiteBackend-0.0.1-SNAPSHOT.jar
```

### 前端

```bash
cd frontend-cms
npm install
npm run dev
```

默认端口为 `8081`，`/api` 与 `/uploads` 已代理到后端 `8080`。前端环境变量见 `frontend-cms/.env.example`。

## PBL 任务建议

- 梳理前台页面、后台管理页面和后端 API 的资源关系。
- 实现一个完整 CMS 流程：新增新闻 → 前台展示 → 后台编辑 → 删除或下线。
- 给留言管理增加状态流转，例如“未处理、处理中、已回复”。
- 将文件上传从本地存储改成 Mock 对象存储适配器。
- 对登录、Token 过期、无权限访问和表单校验补充测试。

## 部署实验

`backend-spring/deploy` 中保留了脱敏后的 systemd 和 Nginx 示例。课堂中可以让学生基于 `example.edu` 占位域名，改写成本地虚拟主机或测试服务器配置。