GathSession-人工智能生成的登录页面
此存储库包含一个名为“GathSession”的虚构产品的响应式登录页面的源代码。整个网站包含在一个 index.html 文件。
➡️ 现场演示:
______________________________________________________________________
关于项目
该项目是现代人工智能驱动的开发工作流程的实际演示。登录页面是在一个交互式会话中使用 gemini-cli 命令行工具。
AI被提示与Figma设计的链接,并利用了 模型上下文协议(MCP) 连接到外部工具进行文档查找和基于浏览器的实时调试。此存储库包含该进程的未经编辑的原始HTML输出。
致谢
这个项目是一个漂亮的Figma设计的代码实现,由 丹尼斯·恩佐基非常感谢他与社区分享他的工作。
AI实现的关键功能
- 响应式设计: 桌面、平板电脑和移动设备的完全响应式布局,采用Tailwind CSS构建。
- Vue.js组件: UI使用Vue 3构建为逻辑组件。
- 交互式移动菜单: 适用于较小屏幕的汉堡菜单中的功能幻灯片。
- 滚动触发动画: 页面元素上微妙的淡入和滑入动画,由Anime.js和Intersection Observer API提供支持。
技术栈
该项目采用现代前端技术构建,为简单起见,所有这些技术都通过CDN包含在内:
