Files
photography/frontend
xujiang 5dd0bc19e4
Some checks failed
部署管理后台 / 🧪 测试和构建 (push) Failing after 1m5s
部署管理后台 / 🔒 安全扫描 (push) Has been skipped
部署后端服务 / 🧪 测试后端 (push) Failing after 3m13s
部署前端网站 / 🧪 测试和构建 (push) Failing after 2m10s
部署管理后台 / 🚀 部署到生产环境 (push) Has been skipped
部署后端服务 / 🚀 构建并部署 (push) Has been skipped
部署管理后台 / 🔄 回滚部署 (push) Has been skipped
部署前端网站 / 🚀 部署到生产环境 (push) Has been skipped
部署后端服务 / 🔄 回滚部署 (push) Has been skipped
style: 统一代码格式化 (go fmt + 配置更新)
- 后端:应用 go fmt 自动格式化,统一代码风格
- 前端:更新 API 配置,完善类型安全
- 所有代码符合项目规范,准备生产部署
2025-07-14 10:02:04 +08:00
..
2025-07-08 14:06:30 +00:00
2025-07-09 09:27:55 +08:00

摄影作品集前端项目

这是一个基于Next.js 15的现代化摄影作品集网站支持动态数据获取和响应式设计。

技术栈

  • Next.js 15 - React框架
  • React 19 - 用户界面库
  • TypeScript - 类型安全
  • Tailwind CSS - 样式框架
  • shadcn/ui - UI组件库
  • TanStack Query - 数据获取和缓存
  • Axios - HTTP客户端

功能特性

  • 🖼️ 照片画廊展示
  • 📅 时间线视图
  • 🔍 分类筛选
  • 🎨 响应式设计
  • 🌙 主题切换支持
  • 📱 移动端优化
  • 🔄 数据缓存和同步
  • 🎯 TypeScript类型安全

开发环境设置

  1. 安装依赖:
npm install
  1. 配置环境变量: 复制 .env.local 文件并设置API地址

  2. 启动开发服务器:

npm run dev
  1. 构建生产版本:
npm run build

项目结构

frontend/
├── app/                    # Next.js应用目录
│   ├── layout.tsx         # 根布局
│   ├── page.tsx           # 主页
│   └── globals.css        # 全局样式
├── components/            # 组件目录
│   ├── providers/         # 上下文提供者
│   ├── ui/               # UI组件
│   └── ...               # 业务组件
├── lib/                  # 工具库
│   ├── api.ts            # API配置
│   ├── queries.ts        # 数据查询
│   └── utils.ts          # 工具函数
├── hooks/                # 自定义钩子
├── public/               # 静态资源
└── types/                # 类型定义

API接口

项目使用React Query进行数据管理支持以下API接口

  • GET /api/photos - 获取所有照片
  • GET /api/photos/:id - 获取单张照片
  • GET /api/categories - 获取分类列表
  • POST /api/photos - 添加照片
  • PUT /api/photos/:id - 更新照片
  • DELETE /api/photos/:id - 删除照片

开发命令

# 启动开发服务器
npm run dev

# 构建生产版本
npm run build

# 启动生产服务器
npm start

# 代码检查
npm run lint

# 类型检查
npm run type-check

部署

项目可以部署到Vercel、Netlify等平台。确保设置正确的环境变量。test change