agenticnoob/hero-next
Hero Next 双语个人网站
根据项目 README 整理
阅读项目 ↓一个基于 Next.js App Router、React Three Fiber 与 Three.js 的独立双语个人网站,整合个人简介、理念文章、项目案例、公开渠道和日志,并针对桌面沉浸式浏览与移动端阅读提供不同布局。
内容与浏览体验
网站以四个章节呈现个人简介、AI 与哲学理念、公开项目及公开渠道,随后展示按日期组织的日志。中英文内容由类型化数据共享,并保存语言、主题和项目房间选择。
宽屏精细指针设备使用圆形文章索引、动态纸张、四面项目展厅和透视日志;移动端、触控设备及较矮的横屏窗口则采用完整文本、紧凑列表和原生折叠控件组成的阅读布局。
交互与技术架构
项目维持单一运行时、Canvas 和滚动源,以 React Three Fiber 管理渲染与帧循环,并结合 WebGL 四面体、面投影、三角形过渡、GLB 模型和光照。语义化 DOM 布局、无障碍颜色、层叠与指针路由由 CSS 负责。
主题与语言使用独立的持久化状态。页面支持减少动态效果,并为普通文本保持至少 4.5:1 的对比度;移动阅读布局提供持续可用的主题按钮。
项目目录与机器可读内容
项目包含四篇完整的双语精选案例,也可将经过校验的公开仓库数据加入项目目录。案例既能在展厅中以原生阅读对话框打开,也能通过独立页面呈现。
服务器渲染的 Agent 目录与 Markdown 文档覆盖个人资料、理念、项目和日志,内容由现有类型化数据及已验证的日志快照在构建期间生成,无需维护另一套文案。日志必须在首次开发或构建前同步。
边界与限制
实现仅使用 Viselora 的公开入口,并固定相关依赖版本。开发环境的宽松主机允许列表只适用于受信任网络,不应将开发端口暴露到公网。
README 指出 Canvas 与 DOM 的字形栅格化仍可能略有差异,现有内容也是可继续编辑的基础版本。自动化覆盖、交互证据和剩余诊断记录在项目状态文档中。