项目
朝圣之路
项目简介
朝圣之路是一个交互式网页应用，记录了从法国Saint-Jean-Pied-de-Port到西班牙Santiago de Compostela，再到”大地尽头”Cape Finisterre的33天朝圣之旅。项目采用现代化设计，结合了Leaflet交互式地图，为用户提供沉浸式的朝圣体验回顾。
朝圣数据
- 起点: Saint-Jean-Pied-de-Port (法国)
- 终点: Cape Finisterre (西班牙，”大地尽头”)
- 总天数: 33天
- 总距离: 893公里
- 日均距离: 27公里
- 途径国家: 法国、西班牙
技术栈
- 地图库: Leaflet.js - 轻量级开源地图库
- 地图数据: OpenStreetMap - 免费开源地图数据
- 样式: 原生CSS - 渐变背景、Flexbox/Grid布局
- 交互: 原生JavaScript - 无框架依赖
功能特点
- 交互式地图: 可缩放、可点击的Leaflet地图，显示完整朝圣路线
- 33天完整记录: 每天一张精选照片，记录朝圣路上的点点滴滴
- 实时统计: 显示总天数、总距离、日均距离等关键数据
- 时间线展示: 垂直时间线布局，清晰展示每日行程
- 全屏查看: 点击照片可全屏查看，提供更好的浏览体验
- 响应式设计: 适配各种屏幕尺寸
- 离线可用: 除地图功能外，其他内容可离线访问
每日主题
朝圣路上每天都有独特的主题和感悟：
- Day 1: Birthday Happy - 生日快乐
- Day 12: Moment of Fate - 命运时刻
- Day 16: Tears in the Backyard - 后院的泪水
- Day 25: Mountain Top - 山顶
- Day 33: End and Beginning - 结束与开始
在线体验
下载
关于朝圣之路
Camino de Santiago（圣地亚哥朝圣之路）是世界上最著名的朝圣路线之一，终点位于西班牙圣地亚哥-德孔波斯特拉，据传是使徒雅各的安息之地。无数朝圣者从中世纪开始踏上这条路线，寻找精神寄托和人生意义。
茅盾文学奖获奖作品展示
项目简介
茅盾文学奖获奖作品展示网站，采用现代卡片式设计风格，使用 Hugo 生成静态页面。展示第十届（2019）和第十一届（2023）共10部茅盾文学奖获奖作品和作家信息。
技术栈
- 静态网站生成器: Hugo - 构建速度快，中文文档完善
- 样式: 原生 CSS - 轻量无依赖，完全控制
- 数据格式: YAML - 简洁易读，Hugo 原生支持
- 配色: 深红#8B1A1A、浅米#F5F1E8、金色#C9A961
功能特点
- 响应式卡片布局（移动端单列、平板双列、桌面三列）
- 作品详情页展示完整信息（作家简介、出版社、作品描述）
- 现代卡片交互效果（hover上移+阴影加深）
- GitHub Actions 自动部署到 GitHub Pages
在线体验
下载
源码仓库
kanban-board
Overview
任务看板系统 (Kanban Board) - 一个类似 Trello 的任务看板系统，支持多人协作、任务管理、实时更新等功能。
Features
- 用户认证：注册、登录、JWT 令牌认证
- 看板管理：创建、编辑、删除看板，支持多人协作
- 任务列表：在看板内创建自定义列表（如：待办、进行中、已完成）
- 任务卡片：标题、描述、优先级、截止日期、负责人、标签分类
- 评论系统：卡片评论、回复
- 活动日志：追踪所有操作记录
- 实时更新：WebSocket 支持实时同步
- 搜索功能：按关键词、标签、负责人等条件搜索
Tech Stack
后端
- FastAPI + SQLAlchemy 2.0
- PostgreSQL 数据库
- JWT 认证
- Socket.IO 实时通信
前端
- React 18 + TypeScript
- Zustand 状态管理
- shadcn/ui 组件库
- dnd-kit 拖拽功能
Demo
Download
Quick Start
环境要求
- Python 3.11+
- PostgreSQL 16+
- Node.js 18+
后端安装
```bash
cd kanban-board/backend
pip install -r requirements.txt
cp .env.example .env
编辑 .env 配置数据库连接
alembic upgrade head
uvicorn app.main:app –reload –port 8000
```
前端安装
```bash
cd kanban-board/frontend
npm install
npm run dev
```
Usage
- 访问 http://localhost:8000/docs 查看 API 文档
- 注册账号并登录
- 创建看板和列表
- 添加任务卡片并拖拽管理
war-simulator
Overview
War Simulator - 伊朗战场模拟器，是一个交互式军事模拟工具，用于可视化军事部署、导弹射程和战场场景。
Features
- 军事部署可视化：显示各方军事力量分布
- 导弹射程模拟：动态展示不同导弹系统的覆盖范围
- 战场动画：实时模拟导弹发射和打击效果
- 交互式地图：支持缩放、拖拽等地图操作
- 控制面板：可调整模拟参数和场景设置
Demo
Download
Technical Details
- 纯前端实现，无需后端服务
- 使用原生 JavaScript 开发
- 支持 JSON 格式的军事数据配置
- 响应式设计，支持桌面和移动设备
Usage
- 解压下载的压缩包
- 打开
index.html文件即可运行 - 通过控制面板调整模拟参数
- 点击地图选择目标，观察导弹打击效果