SOURCE // NEWS

Next.js 16 + Gemini:独立开发者用 AI 打造期末成绩计算器

Next.js 16 + Gemini:独立开发者用 AI 打造期末成绩计算器

每到期末考试季,学生们总是在备忘录里重复着同样的代数计算:“平时作业占 20%,我拿了 91%;期中考占 30%,我考了 84%……那么期末考占 50%,我需要考多少分才能拿到 A-?”为了解决这一痛点,开发者 yashmitb 构建了 GradeHQ,并在不断迭代中将其发展成了一个完整的开源个人项目。

该项目的核心功能非常实用:用户可以添加带有权重比例(如作业、期中、期末等)的课程,并输入已有成绩。接着,选择目标字母等级(如 A-),系统就会精确计算出剩余考试中所需的最低分数。更酷的是,它支持 AI 自动填充功能。你只需上传一份教学大纲(Syllabus)PDF 或者是 Canvas 成绩单的截图,系统就能自动提取出课程类别、权重和分数。

在技术栈方面,GradeHQ 堪称现代前端技术的典范。它基于全新的 Next.js 16(使用 App Router 和 Turbopack 编译器)、TypeScriptTailwind v4 以及用于优雅过渡动画的 Framer Motion。在 AI 层面,它选用了高速且高性价比的 Gemini 2.5 Flash 模型。整个应用坚持“本地优先”原则,所有数据存储于浏览器的 localStorage 中。服务器端不保存任何内容,只有上传的文件会单次发送给 #Gemini 接口并在解析后立即丢弃。

开发 AI 解析路由(/api/parse)是其中最有趣的部分。开发者在此处做了精细的用户体验优化。首先,Gemini 如果对提取出的某项成绩或权重不够自信,不会进行盲目猜测,而是会返回一个标记数组(flags array)说明空白原因,并在 UI 中提示用户手动填补,避免得出错误结果。其次,系统内置了免费的共享 Gemini 密钥,一旦达到每日调用限制,UI 会引导用户无缝输入自己的免费 API Key 并安全保存在本地。最后,针对大文件解析可能带来的 10-20 秒延迟,UI 实现了动态的状态轮播(例如“正在读取文件...”、“匹配成绩中...”等),极大地缓解了用户的等待焦虑。

开发者表示,下一步将引入更多评分标准预设、优化大纲格式的边缘情况处理,并加入暗黑/明亮主题切换。目前该项目已在 GitHub 开源。

AgentUpdate 深度解析

从 GradeHQ 的设计中,我们可以窥见 AI Agent 与垂直工具结合的未来演进方向。相较于传统臃肿的 SaaS 系统,GradeHQ 展示了“极简前端 + 强大轻量级 AI(Gemini 2.5 Flash) + 本地优先存储”的敏捷架构模式。这种设计不仅保障了隐私安全性,更通过 AI Auto-fill 彻底颠覆了传统的数据录入体验。在 AI Agent 生态中,数据录入和格式对齐(如解析多样化的 PDF 和 Canvas 截图)长期以来是端到端自动化的最大瓶颈。GradeHQ 通过 Gemini 进行结构化数据提取,并配合前端完善的“置信度标记”与“人工校准”机制,提供了一种极具现实参考价值的“人机协同(Human-in-the-loop)”设计范式。未来,类似的微型 Agent 插件将无缝嵌入各类垂直场景,推动无感知数据录入的全面普及。