https://github.com/t8lionchion/ghost
幽約地圖 — 靈異地圖互動平台 幽約地圖是一款結合 Next.js + React 前端與 Django REST Framework 後端的全端專案，透過 Google Maps SDK 為基礎，提供用戶： 即時瀏覽：在地圖上查看全台各地靈異事故現場標記與詳細描述。 社群回報：使用 JWT 身分驗證後，上傳事件位置、照片和事件描述，並自動列入任務列表。 介面美化：前端採用 Bootstrap 快速佈局，確保響應式與易用性。 未來規劃整合 ECPay 捐贈金流、WebSocket 即時通知，期望成為最完整、最安全的靈異探索生態系。
https://github.com/t8lionchion/ghost
bootstrap django nextjs react
Last synced: 3 months ago
JSON representation
幽約地圖 — 靈異地圖互動平台 幽約地圖是一款結合 Next.js + React 前端與 Django REST Framework 後端的全端專案，透過 Google Maps SDK 為基礎，提供用戶： 即時瀏覽：在地圖上查看全台各地靈異事故現場標記與詳細描述。 社群回報：使用 JWT 身分驗證後，上傳事件位置、照片和事件描述，並自動列入任務列表。 介面美化：前端採用 Bootstrap 快速佈局，確保響應式與易用性。 未來規劃整合 ECPay 捐贈金流、WebSocket 即時通知，期望成為最完整、最安全的靈異探索生態系。
- Host: GitHub
- URL: https://github.com/t8lionchion/ghost
- Owner: t8lionchion
- License: mit
- Created: 2025-07-31T06:54:26.000Z (11 months ago)
- Default Branch: main
- Last Pushed: 2025-08-26T08:10:54.000Z (10 months ago)
- Last Synced: 2026-04-11T19:39:19.914Z (3 months ago)
- Topics: bootstrap, django, nextjs, react
- Language: Python
- Homepage: https://ghostmove.decheng.dev/
- Size: 1.3 MB
- Stars: 1
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# 幽約地圖
## 一、專案概述
* **幽約地圖**：靈異地圖平台，前端採用 Next.js + React，後端使用 Django + DRF 提供 RESTful API，並以 JWT 保護。
* 功能模組：
* 使用者帳號（註冊／登入／權限）
* 地圖標記（故事圖示顯示）
* 活動報名系統
* 靈異事件投稿與審核
* 金流訂單管理
* 抽獎系統
---
## 二、Software Stack
| 分類 | 技術 / 工具 | 說明 |
| ---- | ----------------------------- | -------------- |
| 前端 | Next.js + React | 頁面渲染、CSR／SSR |
| | Axios / Fetch | API 串接 |
| | Bootstrap CSS（可選） | UI 排版 |
| 後端 | Django | Web 框架 |
| | Django REST Framework (DRF) | 建立 JSON API |
| | djangorestframework-simplejwt | JWT 認證 |
| | django-cors-headers | 處理 CORS |
| 資料庫 | SQLite（開發）／MySQL（部署） | 資料持久化 |
| 安全 | JWT Access/Refresh | Token-based 驗證 |
| | 自訂 Permission | VIP/管理員角色驗證 |
| 開發工具 | uv + pyproject.toml | Python 環境與套件管理 |
| | Git & GitHub | 版本控制 |
| | Postman/Thunder Client | API 測試 |
---
## 三、目錄結構
```plaintext
ghostmove/ # 專案根目錄
├── ghostmove/ # 主設定（settings.py / urls.py）
├── manage.py # 指令入口
├── accounts/ # 用戶系統、JWT、註冊／登入
├── events/ # 活動報名系統
├── records/ # 靈異事件投稿+地圖與標記 API
├── lottery/ # 抽獎系統
└── pyproject.toml # 套件定義
```
---
## 目錄結構示意圖 (Mermaid)
```mermaid
graph TD
subgraph root[ghostmove]
subgraph proj[ghostmove]
S[settings.py]
U[urls.py]
end
M[manage.py]
P[pyproject.toml]
subgraph accounts[accounts]
A1[models.py]
A2[serializers.py]
A3[views.py]
A4[urls.py]
A5[permissions.py]
end
subgraph events[events]
E1[models.py]
E2[serializers.py]
E3[views.py]
E4[urls.py]
E5[permissions.py]
end
subgraph records[records]
R1[models.py]
R2[serializers.py]
R3[views.py]
R4[admin.py]
R5[urls.py]
end
subgraph lottery[lottery]
L1[models.py]
L2[serializers.py]
L3[views.py]
L4[admin.py]
L5[urls.py]
end
end
```
## 四、常用指令
1. **初始化專案**：
```bash
mkdir ghostmove && cd ghostmove
uv init
uv add django djangorestframework djangorestframework-simplejwt django-cors-headers
```
2. **建立 Django 專案**：
```bash
uv run django-admin startproject ghostmove .
```
3. **建立功能模組 (App)**：
```bash
uv run django-admin startapp accounts
uv run django-admin startapp maps
uv run django-admin startapp events
uv run django-admin startapp records
uv run django-admin startapp orders
uv run django-admin startapp lottery
```
4. **啟動開發伺服器**：
```bash
uv run python manage.py runserver
```
---
## 五、軟體安裝手冊
https://hackmd.io/@CsHqT8WZSB2UWK0bvYgtvQ/S1hDI09Ygx
## 六、軟體使用者手冊
https://hackmd.io/@CsHqT8WZSB2UWK0bvYgtvQ/rJCT_yjtlx