Photoview 开发环境搭建：Go + React 全栈开发配置终极指南

【免费下载链接】photoview 自托管个人服务器的照片库 项目地址: https://gitcode.com/gh_mirrors/phot/photoview

Photoview 是一款专为摄影爱好者设计的自托管个人照片库，采用 Go + React 技术栈构建，支持 RAW 格式图片和 EXIF 信息解析。本指南将详细介绍如何快速搭建完整的 Photoview 开发环境，让你能够轻松进行全栈开发。📸

🔧 开发环境概述

Photoview 采用现代化的全栈架构：

• 后端 API：基于 Go 1.25.0，使用 GraphQL 接口
• 前端 UI：基于 React 18，采用 TypeScript 开发
• 数据库支持：SQLite、MariaDB、PostgreSQL 18

🚀 快速开始：Docker 开发环境

环境要求

• Docker Engine 最新版本
• Docker Compose Plugin

一键启动步骤

# 构建开发镜像
docker compose -f dev-compose.yaml build

# 启动 API 和 UI 服务器
docker compose -f dev-compose.yaml up

启动完成后：

• GraphQL Playground：http://localhost:4001
• 网站界面：http://localhost:1234

💻 本地开发环境配置

Go 后端环境搭建

依赖安装（Debian/Ubuntu）：

sudo apt update
sudo apt install golang g++ libheif-dev libdlib-dev libjpeg-dev libblas-dev liblapack-dev libmagic-dev libmagickwand-dev

启动 API 服务器：

cd ./api
go mod download
go run .

热重载开发模式：

cd ./api
reflex -g '*.go' -s -- go run .

React 前端环境搭建

依赖安装：

cd ./ui
npm install
npm start

热重载开发模式：

cd ./ui
npm run mon

📁 项目结构详解

了解项目结构是高效开发的关键：

api/
├── graphql/           # GraphQL 接口定义
├── scanner/          # 媒体扫描模块
├── database/         # 数据库驱动和迁移
└── server.go         # 服务器入口

ui/
├── src/
│   ├── Pages/        # 页面组件
│   ├── components/   # 可复用组件
└── package.json     # 前端依赖配置

🛠️ 开发工具配置

必备工具

• reflex：Go 代码热重载
• nodemon：React 代码热重载
• SQLite3：本地开发数据库

📋 环境变量配置

后端配置（api/.env）：

# 数据库驱动配置
PHOTOVIEW_DATABASE_DRIVER=sqlite
PHOTOVIEW_SQLITE_PATH=photoview.db

🔍 开发调试技巧

API 调试

• 访问 GraphQL Playground：http://localhost:4001
• 支持实时查询和变更操作

前端调试

• 开发服务器：http://localhost:1234
• 支持热模块替换

🎯 最佳实践建议

1. 数据库选择：本地开发建议使用 SQLite，生产环境使用 PostgreSQL

2. 开发流程：

   • 修改 Go 代码 → 自动重启 API 服务器
   • 修改 React 代码 → 自动刷新页面

3. 性能优化：

   • 启用硬件加速（可选）
   • 配置合适的缓存策略

💡 常见问题解决

权限问题：

# 确保媒体文件可读
chmod -R o+r /path/to/photos

通过本指南，你可以快速搭建 Photoview 的完整开发环境，开始你的全栈开发之旅！🚀

【免费下载链接】photoview 自托管个人服务器的照片库 项目地址: https://gitcode.com/gh_mirrors/phot/photoview