AI导哈

AI教育前端平台

一个基于Next.js的现代前端应用，为AI教育中心提供交互式学习工具，包括聊天、课程计划生成、工作表生成等功能。

  • by ideomethodTech
  • JavaScript
  • 本地部署
  • 更新于
在 GitHub 查看 ideomethodTech/mcp_frontend

使用说明

MCP前端-人工智能学习中心

用于模型上下文协议（MCP）AI学习中心的现代Next.js前端应用程序。该应用程序为人工智能驱动的教育工具提供了一个直观的界面，包括聊天、课程规划、工作表生成等。

🚀 特性

  • AI聊天界面 -与学习材料的互动对话
  • 课程计划生成器 -基于人工智能的课程规划工具
  • 工作表生成器 -创建多样化的教育工作表
  • 答案密钥生成器 -自动生成答案密钥
  • PPT生成器 -将内容转化为演示文稿
  • Firebase身份验证 -安全用户身份验证
  • 现代用户界面 -使用Tailwind CSS和Radix UI组件构建

🛠️ 技术栈

  • 框架： Next.js 15.3.3与应用路由器
  • 造型： 顺风CSS+Radix UI
  • 身份验证： Firebase身份验证
  • AI集成： 谷歌genkit
  • 表单处理： React钩子表单+Zod验证
  • 图标： Lucide反应

🏃‍♂️ 入门指南

先决条件

  • Node.js 18+
  • npm或纱线

安装

  1. 克隆存储库：
git clone <your-repo-url>
cd mcp_frontend
  1. 安装依赖项：
npm install
  1. 设置环境变量： 创建一个 .env.local 使用Firebase配置在根目录中的文件：
NEXT_PUBLIC_FIREBASE_API_KEY=your_api_key
NEXT_PUBLIC_FIREBASE_AUTH_DOMAIN=your_project.firebaseapp.com
NEXT_PUBLIC_FIREBASE_PROJECT_ID=your_project_id
NEXT_PUBLIC_FIREBASE_STORAGE_BUCKET=your_project.appspot.com
NEXT_PUBLIC_FIREBASE_MESSAGING_SENDER_ID=your_sender_id
NEXT_PUBLIC_FIREBASE_APP_ID=your_app_id
  1. 运行开发服务器：
npm run dev

该应用程序将在 http://localhost:9002.

🔧 可用脚本

  • npm run dev -使用Turbopack启动开发服务器
  • npm run build -创建生产构建
  • npm run start -启动生产服务器
  • npm run lint -运行ESLint
  • npm run genkit:dev -启动Genkit开发服务器
  • npm run genkit:watch -在手表模式下启动Genkit

📁 项目结构

src/
├── app/                    # Next.js app router pages
│   ├── (main)/            # Protected main application routes
│   ├── admin/             # Admin panel
│   ├── login/             # Authentication pages
│   └── signup/
├── components/            # Reusable UI components
│   ├── ui/               # Base UI components (shadcn/ui)
│   └── auth/             # Authentication components
├── contexts/             # React contexts
├── hooks/               # Custom React hooks
├── lib/                # Utility functions and configurations
└── ai/                 # AI integration and flows
    └── flows/          # Genkit AI flows

🔐 认证

该应用程序支持：

  • 电子邮件/密码验证
  • 谷歌登录
  • 测试演示证书： admin / admin

🤝 贡献

  1. 分叉存储库
  2. 创建要素分支
  3. 进行更改
  4. 提交拉取请求

📄 许可证

该项目是MCP（模型上下文协议）学习中心生态系统的一部分。

相关项目：

相关 MCP