🌐 Web 项目介绍

Hey，同学！这一篇我们来聊聊 Web 应用——也就是 iFluxArt 项目的「门面担当」～ 👀

🤔 Web 是干嘛的？

Web 是 iFluxArt 体系中的门户入口，简单来说就是用户访问你站点时看到的第一个页面。它的核心任务是：

1. 展示形象：给访问者一个「第一印象」
2. 引流：引导用户去博客、文档、导航等子站点
3. 统一认证：登录、注册、密码管理等入口

🏗️ 项目定位

✨ 核心功能

🏠 首页展示

• Hero 区域：大标题 + 副标题 + 行动按钮，第一眼抓住用户注意力
• 精选内容：轮播展示博客最新文章、热门文档
• 特性介绍：用卡片展示项目的核心亮点
• 响应式设计：手机、平板、桌面都能完美展示

🔐 认证系统

• 登录：邮箱密码登录
• 注册：新用户注册
• 密码找回：忘记密码？发邮件重置
• GitHub OAuth（可选）：GitHub 账号一键登录

🧭 导航入口

• 顶部导航栏：快速跳转到博客、文档、导航等
• 底部链接：相关资源、社交链接

🎨 主题支持

• 明暗模式自动切换
• 跟随系统偏好
• 也支持手动选择

🔧 技术设计

为什么这样设计？

1. Server Components 优先

Web 页面大多是静态展示型内容，不需要太多交互。用 Server Components 可以：

• 减少客户端 JavaScript 体积
• 提升首屏加载速度
• 更好地做 SEO

2. 共享组件

Web 用的是 @iflux-art/ui 共享组件库，保证了：

• 和 blog、docs、admin 视觉风格一致
• 组件经过充分测试，稳定可靠
• 代码复用，减少重复开发

3. 路由设计

/                       # 首页
/auth/login             # 登录页
/auth/sign-up           # 注册页
/auth/forgot-password   # 密码找回页
/auth/update-password   # 更新密码页
/auth/confirm           # 邮箱确认页
/protected              # 需登录才能访问的页面

🎯 适用场景

🔗 与其他项目的关系

Web (门面)
   │
   ├──🔗 跳转──→ Blog (博客)
   ├──🔗 跳转──→ Docs (文档)
   ├──🔗 跳转──→ Links (导航)
   │
   └──🔐 认证──→ Admin (管理后台)

• Web 是「入口」，负责接待访客
• Blog/Docs/Links 是「内容」，提供实际价值
• Admin 是「后台」，管理内容

📖 下一步

想了解更多？

• 首页配置 —— 如何定制首页内容
• 认证流程 —— 登录注册是怎么工作的
• 主题配置 —— 调整网站外观
• 部署指南 —— 如何上线到 Vercel