软件工程第一次作业~

这个作业属于哪个课程 202601 软件工程（福州大学）
这个作业要求在哪里 2026秋软件工程个人作业（第一次）
这个作业的目标 完成账号与平台搭建（GitHub、博客园），掌握 Hugging Face API 调用并结合前端实现交互式图像生成，梳理个人技能树与技术方向，制定学期学习目标与三年规划
学号 102401127

软件工程课程第一次个人作业

〇、准备工作

事项 完成情况
注册 GitHub 账号并完善个人信息 ✅ 已完成，主页：https://github.com/OooneCloud
注册博客园账号、开通博客并完善昵称头像与样式 ✅ 已完成，主页：https://www.cnblogs.com/OooneCloud
关注任课老师（吴越钟）博客 ✅ 已完成
关注助教（张明圣、王奇蕊）博客 ✅ 已完成
实名加入博客园班级（202601 软件工程） ✅ 已完成

一、任务1：Hugging Face API 调用（Flux 真实感图像生成）

1.1 任务目标与模型选择

  • 任务：在 Hugging Face 注册账号、获取 API Token，调用 FLUX 模型生成一张尽量贴近真实世界的图像，并在调用代码的基础上结合前端接口实现交互式生成。
  • 使用模型：XLabs-AI/flux-RealismLora
  • 模型说明：该模型是建立在 FLUX.1-dev 之上的 LoRA 权重，主打"真实感（Realism）"，能显著改善皮肤纹理、光线和材质的真实度，适合生成接近摄影作品的画面。
  • 推理方式：由于它是 LoRA 模型，不能走通用的 hf-inference 路由，因此代码中使用 Hugging Face 官方 InferenceClient，并显式指定推理提供商 provider: 'fal-ai'，由官方客户端负责处理该提供商所需的接口格式。
项目 内容
模型名称 XLabs-AI/flux-RealismLora
调用方式 Hugging Face 官方 JS SDK：@huggingface/inference v4
后端 Node.js 原生 http 模块，本地端口 3000
前端 原生 HTML / CSS / JavaScript，无框架

1.2 API 调用步骤

第 1 步：注册账号并创建 Token。
登录 Hugging Face → Settings → Access Tokens → Create new token，创建具有推理（Inference）权限的 Token，并保存到本地 .env 文件中（.env 已被 .gitignore 忽略，不会上传到 GitHub，也不出现在任何截图中，保证 Token 安全）。

第 2 步：配置环境变量。

HF_TOKEN=hf_************
HF_MODEL=XLabs-AI/flux-RealismLora
PORT=3000

第 3 步：安装依赖并启动。

npm install      # 安装 @huggingface/inference
npm start        # node server.js
# 浏览器打开 http://localhost:3000

第 4 步：核心调用代码。

const { InferenceClient } = await import('@huggingface/inference');
const client = new InferenceClient(process.env.HF_TOKEN);

const image = await client.textToImage({
  provider: 'fal-ai',
  model: 'XLabs-AI/flux-RealismLora',
  inputs: prompt,
  parameters: { num_inference_steps: Number(input.steps) || 28 }
});
const buffer = Buffer.from(await image.arrayBuffer());

第 5 步：前端交互。
页面把提示词 POST 到本地后端 /api/generate，后端转发给 Hugging Face，再把返回的图片以 base64 回传显示：

const response = await fetch('/api/generate', {
  method: 'POST',
  headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify({ prompt, steps: steps.value })
});
const result = await response.json();   // { image: 'data:image/png;base64,...', record: {...} }
imageStage.replaceChildren(image);      // 显示生成结果

第 6 步：记录调用。
后端在每次调用后返回一条 record（时间、状态码、耗时、响应大小、模型名），前端渲染成页面下方的 API Call Record 表格，既方便截图留证，也方便对比三轮调用的耗时。

1.3 前端页面实现

前端是一个单页交互界面，包含：

  • Prompt Lab（左侧）：提示词输入框（实时字数统计，上限 2000）、推理步数滑杆（20–40，默认 28）、生成图像 按钮、示例提示词切换。
  • Generated Frame（右侧）：图像展示区，生成中显示占位提示；成功后显示图片并提供下载。
  • API Call Record（下方）：调用记录表（TIME / STATUS / LATENCY / SIZE / DETAIL）。

1.4 提示词设计与三轮调用过程

真实感图像的质量几乎完全取决于提示词的"信息密度"。我的思路是每次只改一组因素，观察画面变化，从而判断每个因素的作用。以下三轮调用的提示词、设计意图与实际生成结果一一对应。

第 1 轮：只写主体和场景

A coffee shop in Shanghai

设计意图：先给模型最少的约束（主体 + 城市），观察它的"默认输出"长什么样。

生成结果：

调用1

观察：能生成一家咖啡馆，构图随机、画面偏"概念图"，光线平板，缺少现实照片的质感。
结论：只给主体，模型会给一个平均化的结果。

第 2 轮：增加环境与光线

A small coffee shop on a rainy evening in Shanghai, warm window light, realistic reflections on wet pavement

设计意图：在第 1 轮基础上只改一组因素——加入时间（rainy evening）与光线（warm window light、wet pavement reflections），验证"光线和天气"对真实感的影响。

生成结果：

调用2

观察：画面立刻有了氛围，雨夜、暖色窗光、湿地面反射把"时间和天气"确定下来，冷暖对比让画面更像真实场景。
结论：光线和天气是决定"真实感"的关键变量。

第 3 轮：补充摄影方式与真实感约束

A documentary-style street photograph of a small coffee shop on a rainy evening in Shanghai, warm window light, realistic reflections on wet pavement, natural skin texture, 35mm lens, subtle film grain, highly detailed, photorealistic

设计意图：在保持场景不变的前提下，加入摄影语言（documentary-style、35mm lens）、质感约束（film grain、natural skin texture）与整体倾向词（photorealistic），让画面从"渲染图"走向"照片"。

生成结果：

调用3

观察：画面从"渲染图"变成了"照片"。documentary-style、35mm lens 给了拍摄视角，subtle film grain 增加了胶片颗粒感，natural skin texture 让人物皮肤不再塑料感，photorealistic 收尾强化整体倾向。
结论：用"摄影语言"描述画面，是让模型输出真实照片最有效的手段。

三轮调用记录

三次调用均返回 HTTP 200。页面下方的 API Call Record 记录了每次调用的时间、状态码、耗时（LATENCY）与响应图片大小（SIZE），详见上方三张截图页面的底部。

Hugging Face 平台侧的调用记录：

HF调用记录

提示词设计思路总结：

  1. 主体 → 环境 → 光线 → 摄影语言 → 质感约束，逐层加信息，而不是一次堆砌。
  2. 用具体的镜头、胶片、风格词（35mm、film grain、documentary）替代"好看""真实"这类空泛形容词。
  3. 每次只改一组变量，保留其他条件不变，才能判断是哪个词起了作用。

对比三轮结果可以明显看到：随着光线、材质与摄影语言信息的加入，画面从"概念化的室内效果图"逐步演进为"雨夜街边咖啡馆的纪实摄影"，真实感显著提升。

1.5 遇到的问题与解决

  1. 模型路由报错：最初按普通模型的方式调用，提示找不到路由。原因是 flux-RealismLora 属于 LoRA 模型，需要显式指定 provider: 'fal-ai'，改用官方 InferenceClient 后解决。
  2. 首次调用等待久：第一次请求明显比后两次慢，属于模型冷启动（推理服务需要加载权重）。解决思路是在界面给出"首次调用可能需要等待模型加载"的提示，并保证点击后按钮禁用、防止重复提交。
  3. 前端直接放 Token 不安全：改为后端代理，Token 只存在于服务端 .env 中。
  4. 图片传输：API 返回的是二进制流，直接塞进 JSON 会出问题，因此后端转成 base64 的 Data URL 再返回给前端展示。

1.6 API 调用体验与心得

  • 第一次真切感受到"提示词工程"是有效果的。 同样的模型，只因为提示词从 5 个词变成 30 个词，输出就从"AI 概念图"变成了"可以骗过眼睛的照片"。模型能力是上限，而提示词决定了你能不能用满这个上限。
  • API 调用不只是"发个请求"。 真正动手后会遇到 Token 管理、模型路由、二进制响应、错误处理、冷启动等待这些工程细节。这些恰恰是课堂之外的收获。
  • 前后端结合让 API 从"脚本"变成"产品"。 只写一段 Node 脚本调用 API，得到的只是终端里的一行日志；而配上前端页面后，可以交互输入、可视化结果、记录每次调用。这种"把能力交付给用户"的过程，正是软件工程的味道。作为一个平时更偏底层和算法方向、前端接触不多的学生，独立完成这一整套前后端交互，对我来说是补齐工程短板的第一步。

二、任务2：GitHub 个人主页搭建

2.1 方案选择与搭建步骤

我选择 方案一：创建个人资料自述文件（Profile README），因为它不依赖额外部署，改完即生效，维护成本低。

操作步骤：

  1. 在 GitHub 新建仓库，仓库名与 GitHub ID 完全一致（我的 ID 是 OooneCloud，仓库名即 OooneCloud），这是 GitHub 的"特殊仓库"机制，其根目录 README 会自动显示在个人主页顶部。
  2. 勾选 Public 与 Add a README file，创建仓库。
  3. 编辑根目录 README.md，写入个人介绍、技能、自我评估与三年规划，保存后个人主页立即更新。

个人主页地址：https://github.com/OooneCloud

github个人主页截图

2.2 个人主页内容概要

主页 README 包含四个部分：

  1. 个人简介：大三计算机科学与技术专业本科生，数理基础扎实，偏爱钻研计算机底层运行机制、算法逻辑与系统原理，现阶段以计算机考研深造为核心目标，努力从"会做题、会写基础代码"向"懂原理、会工程、能落地"的综合性计算机人才转变。
  2. 专业技能与实践成果：C / C++ / 汇编语言编程能力，数据结构、计算机网络、计算机组成原理等专业基础，Git / GitHub / Markdown 工具链，以及课程实验、案例复刻等实践经历。
  3. 自我评估：已掌握能力、感兴趣的技术方向（系统与底层原理、算法与网络）、待学习知识（软件工程全流程、OS / 数据库深层原理、工程化协作）与还欠缺的能力（完整项目实战、UML 建模与测试流程、团队协作经验）。
  4. 未来三年发展规划：围绕考研深造制定了三年计划——第一年夯实专业课与算法基础并完成软工实训，第二年冲刺考研初复试并沉淀技术作品集，第三年进入研究生阶段深耕系统 / 算法方向、积累科研成果。

完整的三年规划细节见我的 GitHub 主页：https://github.com/OooneCloud。

三、任务3：博客园随笔（技能梳理、代码量、学习期待与 AI 学习指南分析）

本部分已作为随笔发布在博客园：个人技术现状梳理与软件工程学期学习计划

3.1 个人技能树、技术偏好与自我评估

已具备的专业知识与能力

  • 能力 A（程序开发基础）：系统掌握 C、C++、汇编语言等底层核心编程语言，语法基础扎实，能独立编写、调试、优化基础功能代码与数据结构算法代码；了解 HTML、CSS 前端基础语法，具备一定的多语言开发基础。
  • 能力 B（专业底层基础）：完整修完数据结构、计算机组成原理、计算机网络、高等数学、线性代数、离散数学，熟练掌握各类线性 / 非线性数据结构与经典排序查找算法，理解硬件组成、指令运行机制与网络传输协议原理；目前正在深耕操作系统、数据库原理、软件工程三门核心专业课。
  • 能力 C（底层思维能力）：通过汇编、计组、操作系统前置学习，对指令执行、存储结构、程序运行底层逻辑、软硬件交互机制有清晰认知，具备扎实的底层思维。
  • 能力 D（自主学习能力）：能独立完成课后算法实验、课程实训与理论复盘，具备较强的数理逻辑、算法推导与问题拆解能力，能通过官方文档自主攻克难点。

技术兴趣方向

结合大三计算机考研规划，现阶段技术偏好偏向计算机底层原理、算法与系统方向：相较于表层应用开发，我更热衷于钻研计算机组成、操作系统、网络协议、数据结构与算法等底层核心知识，偏好逻辑严谨、原理性强的技术内容。

还欠缺的能力与技术短板

  • 能力 E（工程化项目实战）：目前能力集中在算法、基础语法与理论学习层面，擅长单文件小型代码，缺乏完整软件项目开发经验，不熟悉前后端协作、项目架构与模块化开发流程。
  • 能力 F（软件工程规范）：对需求分析、UML 建模、概要 / 详细设计、软件测试、敏捷迭代等工程化流程认知较浅，编码偏向功能实现，缺少标准化、项目化开发思维。
  • 能力 G（团队协作）：大部分练习与实验为个人独立完成，团队协作开发经验较少。
  • 能力 H（工程问题排查）：擅长算法题型，但面对工程环境配置、项目报错、多模块联动问题排查经验不足。

3.2 代码量现状与学期目标

  • 当前累计代码量：约 7000 行（含课程作业、课后练习、小型实训项目、个人 GitHub 实战练习，主要为 Java 基础程序、Python 实操代码、前端静态页面与数据库脚本）。
  • 本学期期末目标：新增有效代码量 3000 行以上，总量突破 10000 行，重点积累规范化项目代码、模块化开发代码与软件工程实训项目代码。

3.3 本课程最期待学习的知识与希望获得的收获

最期待学习的知识

  • 软件工程项目完整开发流程：需求分析、架构设计、模块划分、代码实现、测试迭代、项目部署；
  • 软件工程标准化开发规范、文档撰写规范与团队协作开发模式；
  • 软件测试、bug 调试与项目优化，跳出"只会写代码"的局限；
  • 结合实战项目掌握模块化、工程化开发思想，具备小型软件项目的独立开发与落地能力。

希望获得的收获

  • 建立系统化的软件工程思维，理解软件开发是规范化、流程化的工程实践；
  • 掌握团队协作开发、版本迭代、项目管理的基础能力；
  • 能独立完成小型软件项目从 0 到 1 的开发，熟练撰写需求文档、设计文档、测试报告；
  • 为后续考研深造与技术深耕夯实实战基础。

3.4 AI 生成《软件工程课程学习指南》及合理性分析

本次选择 DeepSeek 生成《软件工程课程简易学习指南》，完整内容及个人分析如下。

（1）AI 生成的指南

一、课程学习核心目标
软件工程核心是学习"规范化、工程化、团队化"的软件开发方法，告别零散代码练习，掌握软件从需求、设计、编码、测试到维护的全生命周期流程，具备小型软件项目独立开发与团队协作开发能力。

二、分阶段学习规划

  • 第一阶段：基础认知阶段（1-4 周）：学习软件工程基本概念、软件生命周期、开发模型（瀑布、迭代、敏捷），区分各类模型的适用场景；掌握需求分析的基本方法，学会梳理用户需求、区分功能需求与非功能需求。

  • 第二阶段：设计与建模阶段（5-8 周）：熟练掌握 UML 常用建模图（用例图、类图、时序图、活动图）；学习软件架构设计、模块化设计、分层设计思想，掌握高内聚低耦合原则，能完成小型项目的概要设计与详细设计。

  • 第三阶段：编码与规范阶段（9-12 周）：遵循代码开发规范，统一命名、注释、格式标准；学习 Git/GitHub 进阶用法，掌握分支开发、合并、冲突解决；结合课程实训完成模块化编码开发。

  • 第四阶段：测试与迭代阶段（13-16 周）：学习软件测试基础理论，掌握黑盒、白盒测试方法，能设计测试用例、排查 bug；学习软件维护与版本迭代优化，完成项目优化、文档整理与复盘。

三、核心重难点突破
重难点：UML 建模、软件开发模型区分、模块化架构设计、测试用例设计；突破方法：结合案例练习、临摹标准建模图、独立完成小型项目全流程实战。

四、课程产出要求
掌握软件工程核心理论；独立完成 1-2 个小型实训项目的完整流程；熟练撰写需求文档、设计文档、测试报告、复盘文档；养成规范化、模块化开发的习惯。

（2）合理性分析

该指南整体合理、贴合本科软件工程课程教学大纲，逻辑清晰、阶段划分科学，符合循序渐进的学习规律。

  • 优点：精准覆盖课程核心知识点，把零散理论梳理为分阶段学习任务，从基础认知、建模设计、编码规范到测试迭代，完整覆盖软件全生命周期；重难点标注清晰，贴合本科课程节奏，适配课程作业与实训要求。
  • 不足：内容偏向通用理论教学，未结合我个人考研的学习目标做个性化适配，缺少课后自主拓展、项目拔高的针对性建议，整体偏向基础应试与课程实训。

（3）对个人的实际帮助

  1. 梳理学习框架：此前我对软工课程的学习较零散，该指南帮我搭建了完整的课程学习体系，明确每周学习重点，避免知识点遗漏；
  2. 补齐能力短板：针对性弥补我"重代码、轻设计、无规范"的问题，让我重视建模设计、文档撰写与项目测试；
  3. 适配课程实训：分阶段的实战要求能指导我顺利完成本学期课程项目，规范项目流程；
  4. 助力长期发展：规范化、流程化的开发思维也为后续考研专业课与研究生阶段科研打下基础。

同时我也认识到 AI 生成内容的局限：它擅长给出结构与清单，但不了解我的真实水平和课程的具体考核要求，最终的学习计划必须由我自己结合课程安排来定，所以我不把它当标准答案，而是当作一份待验证的清单。

四、任务4：作业格式说明

  • 本作业使用 Markdown 编写，博客园编辑器已切换为 Markdown 编辑器，后台编辑页面截图如下：

博客园随笔使用md编辑器截图

五、总结

这次作业让我第一次把"调用一个大模型 API"和"做一个能给人用的界面"连了起来。技术上，我掌握了 Hugging Face Token 管理、LoRA 模型的路由选择、前后端代理与二进制响应处理；方法上，通过三轮提示词对比实验，理解了控制变量、逐层加信息的思路；认识上，通过技能树梳理和 AI 指南分析，我第一次比较清楚地看到了自己"会什么"和"不会什么"——我的基础在底层原理与算法，而短板在工程化、规范化和团队协作。

最重要的收获是：软件工程关心的不只是代码能不能跑，而是需求、设计、协作、文档与维护这一整条链路。 这正是我未来一学期乃至考研深造前最想补齐的部分。

posted on 2026-09-10 22:25  OooneCloud  阅读(17)  评论(0)    收藏  举报

博客园  ©  2004-2026
浙公网安备 33010602011771号 浙ICP备2021040463号-3