ZVIOLIN
PROJ-03
PROJ-03 Featured 活跃中

星幕网 (Shimmer)

现代化在线演出票务预订平台

独立完成的全栈演出票务平台（React 19 + Go + Redis）：秒杀分布式锁零超卖、JWT 安全体系、Docker Compose 一键部署，线上 Demo 可访问，首屏 LCP < 1.2s。

React 19TypeScriptVite 6Tailwind CSSGo 1.23GinMySQL 8.0Redis 7Docker
★ 0 Stars
内测中 用户
LCP < 1.2s 性能
2025 年份
查看源码 在线演示 返回列表
shimmer-web.json 
{
  "id": "shimmer-web",
  "title": "星幕网 (Shimmer)",
  "type": "Featured",
  "year": "2025",
  "status": "active",
  "category": "全栈应用",
  "tech": ["React 19", "TypeScript", "Vite 6", "Tailwind CSS", "Go 1.23", "Gin", "MySQL 8.0", "Redis 7", "Docker"],
  "github": "https://github.com/Zviolin/ShimmerWeb",
  "demo": "https://shimmer.zviolin.online/"
}
01

项目概述

独立完成的全栈演出票务平台（React 19 + Go + Redis）：秒杀分布式锁零超卖、JWT 安全体系、Docker Compose 一键部署，线上 Demo 可访问，首屏 LCP < 1.2s。

02

核心特性

🎫

演出票务 — 热门演出推荐、分类浏览、Banner 轮播、按分类/状态筛选搜索

⚡

秒杀抢票 — 基于 Redis 分布式锁保证抢票一致性，高并发场景下零超卖

📊

数据看板 — 今日/本周收入统计、订单趋势分析、分类分布可视化

🔐

企业级安全 — JWT 令牌认证、bcrypt 密码加密、SQL 注入防护、XSS 防护、CORS 跨域限制

📦

Docker 一键部署 — Docker Compose 编排，前端 Nginx + 后端 Go + MySQL + Redis 容器化

📋

订单全流程 — 订单列表、详情查看、支付/取消/退款、管理员退款处理与导出

03

技术架构

前端
React 19 + TypeScript + Vite 6 + Tailwind CSS
后端
Go 1.23 + Gin Web Framework
数据库
MySQL 8.0
缓存
Redis 7
认证
JWT + bcrypt
部署
Docker + Docker Compose + Nginx
04

性能指标

首屏加载 1.2s
API 响应 45ms
并发支持 1000+QPS
可用性 99.9%
05

项目结构

project-structure 
ShimmerWeb/
├── Backend/          # Go 后端服务
│   ├── controller/   # 控制器层
│   ├── middleware/    # 中间件（认证、日志）
│   ├── model/        # 数据模型层
│   ├── router/       # 路由配置
│   └── service/      # 业务逻辑层
├── Web/              # React 前端应用
│   ├── src/api/      # API 请求封装
│   ├── src/components/ # 公共组件
│   ├── src/pages/    # 页面组件
│   └── src/hooks/    # 自定义 Hooks
├── Database/         # 数据库脚本
└── docker-compose.yml
06

详细说明

项目概述

星幕网 (Shimmer) 是一个现代化的在线演出票务预订平台，融合了前后端全栈技术实践。平台提供从演出浏览、座位选择、秒杀抢票到订单管理的完整票务流程，同时配备功能完善的管理后台，支持数据看板、用户管理、演出管理等运营功能。

个人职责

独立完成本项目从 0 到 1 的设计、开发与线上部署：

  • 后端架构：Go + Gin 分层设计（router / controller / service / model / middleware），JWT 认证与日志中间件链
  • 高并发设计：Redis 分布式锁保证秒杀抢票一致性，实现高并发场景下零超卖
  • 前端工程：React 19 + TypeScript 组件化开发，自定义 Hooks 封装请求与状态逻辑
  • 安全加固：bcrypt 密码加密、SQL 注入 / XSS 防护、CORS 跨域限制与操作日志审计
  • 容器化部署：Docker Compose 编排 Nginx + Go + MySQL + Redis，一键构建上线（线上 Demo）

核心功能

用户端

  • 首页 - 热门演出推荐、分类浏览、Banner 轮播
  • 演出列表 - 按分类/状态筛选，支持搜索
  • 演出详情 - 演出信息、座位选择、立即购买
  • 秒杀抢票 - 分布式锁保证抢票一致性
  • 订单管理 - 订单列表、订单详情、取消/支付/退款
  • 个人中心 - 账户设置、隐私设置、数据导出

管理端

  • 数据看板 - 今日/本周收入、订单统计、分类分布
  • 用户管理 - 用户列表、状态管理、删除
  • 演出管理 - CRUD 演出信息、封面上传
  • 票种管理 - 票种配置、库存管理
  • 订单管理 - 订单列表、退款处理、订单导出
  • 系统设置 - 系统配置管理
  • 日志审计 - 管理员操作日志

安全特性

  • JWT 令牌认证
  • 密码 bcrypt 加密
  • 强密码策略验证
  • 文件类型上传限制
  • SQL 注入防护
  • XSS 防护
  • CORS 跨域限制
  • 操作日志审计
  • 管理员权限控制
  • 环境变量敏感信息隔离

API 设计

认证接口

接口 方法 描述
/api/auth/register POST 用户注册
/api/auth/login POST 用户登录
/api/admin/auth/login POST 管理员登录

公开接口

接口 方法 描述
/api/performances GET 演出列表
/api/performances/:id GET 演出详情
/api/performances/categories GET 分类列表
/health GET 健康检查

快速开始

Docker 一键启动（推荐）

git clone https://github.com/Zviolin/ShimmerWeb.git
cd ShimmerWeb
cp .env.example .env
docker compose up -d --build

本地开发

# 启动数据库
docker run -d --name shimmer-mysql -e MYSQL_ROOT_PASSWORD=Shimmer2024Secure! -e MYSQL_DATABASE=ticketdb -p 3308:3306 mysql:8.0
docker run -d --name shimmer-redis -p 6399:6379 redis:7-alpine

# 启动后端
cd Backend && go run main.go

# 启动前端
cd Web && pnpm install && pnpm dev

默认账户

角色 用户名 密码 地址
管理员 admin 123456 /admin/login
用户 testuser 123456 /login