用通义灵码渐进式开发 0->1 实现高考志愿规划项目题文档

作者：阿里巴巴云原生

2025-08-22
浙江
本文字数：2766 字
阅读完需：约 9 分钟

作者：哑木

项目目标

0-1 完全通过自然语言交互 实现一个 AI 高考志愿填报系统，结合通义千问 AI 模型提供专业推荐。该项目旨在帮助高考学生和家长根据个人情况智能推荐合适的专业和学校，减少志愿填报的盲目性。

核心诉求

提供用户友好的信息填写表单，页面框架计划用 Vue3
基于 AI 模型提供智能专业推荐，模型计划用百炼，后端调用通过 Python 实现
展示专业详情（前景、薪资、需求等）
支持响应式设计，适配移动端访问
可选将用户数据存储到 Supabase 数据库

前置准备

1、开通 mastergo 企业版，否则报错无法获取 dsl。

2、灵码已经配置 mastergo 相关 mcpserver，并且添加有权限的个人访问令牌。

"@master/mastergo-magic-mcp": {2      "command": "npx",3      "args": [4        "-y",5        "@mastergo/magic-mcp",6        "--token=个人token",7        "--url=https://mastergo.com"8      ]9    }

复制代码

个人 token

3、灵码已经配置 supabase 相关的 mcpserver，并且添加有权限的个人访问令牌。

阿里云 supabase 的 MCP，配置参考

https://help.aliyun.com/zh/analyticdb/analyticdb-for-postgresql/user-guide/supabase-mcp-use-guide：

"supabase": {2      "command": "npx",3      "args": [4        "-y",5        "@aliyun-supabase/mcp-server-supabase@latest",6        "--features=aliyun",7        "--read-only"8      ],9      "env": {10        "ALIYUN_ACCESS_TOKEN": "ACCESS_KEY_ID|ACCESS_KEY_SECRET"11      }12    },

复制代码

渐进式开发步骤

1、开通 mastergo 企业版，否则报错无法获取 dsl。

第一步：MasterGo AI 设计稿生成

基于 mastergo 提供的 AI 生成页面能力，生成前端设计稿。

提示词：学生可以输入自己的姓名、性别、身份证号、所在省份、高考分数进行提交。模型可以基于输入的信息生成个性化的高考志愿填报建议及职业生涯规划。

mastergo 会自动优化相关提示词，然后再让模型生成设计稿。

第二步：通过灵码 mastergo mcp 工具进行前端设计稿还原

请根据以下设计原型，使用 Vue3 框架开发两个前端页面，并实现前后端分离架构：

1. 页面开发需求：

报考信息提交页面
mastergo 设计原型链接：
https://mastergo.com/file/167266857969601?fileOpenFrom=project&page_id=M&layer_id=1%3A0
功能要求：包含表单输入项（如姓名、身份证号、报考科目等），支持数据校验与提交功能。
报考建议页面
mastergo 设计原型链接：
https://mastergo.com/file/167266857969601?fileOpenFrom=project&page_id=M&layer_id=14%3A004
功能要求：展示个性化报考建议内容，支持从后端获取建议数据并渲染。

2. 前端实现要求：

使用 Vue 3（推荐使用 Composition API + Vite 构建）
页面组件化开发，结构清晰

3. 后端实现要求：

使用 Python（推荐 FastAPI 或 Flask 框架）
数据可暂存内存或使用简单文件存储（如 JSON），无需数据库

4. 其他要求：

提供简要的运行说明（如启动前后端的命令）
保证代码可读性与可维护性
遵循标准开发实践（如 ESLint、Prettier 可选）

请生成完整的项目结构及核心代码文件，确保前后端可独立运行并完成基本交互。

提示词里强制要求前后端分离，灵码自动生成相关目录结构，并按照设计稿进行前端代码生成。

collegeApplication/2├── frontend/                  # 前端项目3│   ├── src/                   # 源代码目录4│   │   ├── views/             # 页面组件5│   │   ├── router/            # 路由配置6│   │   ├── App.vue            # 根组件7│   │   └── main.js            # 入口文件8│   ├── package.json           # 前端依赖配置9│   └── vite.config.js         # Vite配置文件10├── backend/                   # 后端项目11│   ├── controllers/           # 控制器层12│   ├── services/              # 服务层13│   ├── models/                # 数据模型14│   ├── app.py                # 主应用文件15│   └── requirements.txt      # 后端依赖配置16└── README.md                 # 项目说明文档

复制代码

生成页面一，信息填报页面：

生成页面二，建议咨询页面：

第三步：用灵码 agent 模式进行后端模型对接代码编写

提示词：请使用 Python 编写一个后端服务，用于接收前端用户提交的报考信息，调用预训练模型进行推理处理，并将推理结果返回至前端“报考建议咨询页面”进行展示。

模型调用方式参考：

import osfrom openai import OpenAI

client = OpenAI(    api_key=os.getenv("DASHSCOPE_API_KEY"), # 如果您没有配置环境变量，请在此处用您的API Key进行替换    base_url="https://dashscope.aliyuncs.com/compatible-mode/v1",)completion = client.chat.completions.create(    model="qwen3-coder-plus",    messages=[        {'role': 'system', 'content': 'You are a helpful assistant.'},        {'role': 'user', 'content': '请编写一个Python函数 find_prime_numbers，该函数接受一个整数 n 作为参数，并返回一个包含所有小于 n 的质数（素数）的列表。质数是指仅能被1和其自身整除的正整数，如2, 3, 5, 7等。不要输出非代码的内容。'}],    )print("="*20+"回复内容"+"="*20)print(completion.choices[0].message.content)print("="*20+"Token消耗"+"="*20)print(completion.usage)