一个图库前端 —— Remix + Cloudflare Pages(D1 / Turnstile)。
线上: https://xrw-album.christin3.com
- 暖色"档案"风格,暗 / 亮双主题(跟随系统 + 手动切换,见
app/components/ThemeToggle.tsx) - Justified 瀑布布局 + 灯箱(缩略图条、键盘 / 箭头 / 触摸滑动切换,见
app/components/Lightbox.tsx) - Turnstile 人机验证门 + 基于 cookie 的会话(
app/routes/_index.tsx、app/sessions.server.ts)
npm install
cp .dev.vars.example .dev.vars # 填入 SESSION_SECRET / TURNSTILE_SECRET_KEY
npm run dev数据来自 Cloudflare D1(表结构见各 loader 的查询,如 app/routes/_index.tsx、app/routes/album.$id.tsx)。绑定与项目配置见 wrangler.toml。
npm run deploy # remix build + wrangler pages deploy生产环境的密钥用 wrangler pages secret put SESSION_SECRET / ... TURNSTILE_SECRET_KEY 设置。
注:本仓库是某次前端代码的一次性开源快照,可能不随线上持续更新。