新 Web 应用必须满足如下“功能性与非功能性”的业务需求。

类别 A（CATEGORY A）

• BR（A.1）：开发栈（Development Stack｜覆盖：第 1 周）

  新 Web 应用必须使用 Vue.js 3 框架开发。

• BR（A.2）：响应式（Responsiveness）

  新 Web 应用必须具备响应式能力，以兼容各种设备。

  提示（Hint）： 响应式可使用 Bootstrap、Materialize CSS 或其他框架实现。

  参考链接：https://getbootstrap.com/，https://materializecss.com/

类别 B（CATEGORY B）

• BR（B.1）：校验（Validations）

  必须实现至少两种不同类型的用户输入校验。

• BR（B.2）：动态数据（Dynamic Data）

  必须能够动态获取并显示来自底层 JavaScript 数据结构的值（例如：从 JSON、状态变量或 Vue 绑定中获取）。

  提示（HINT）： 使用 Local Storage 将数据持久化到当前会话之外。示例参考：https://www.geeksforgeeks.org/how-to-make-localstorage-reactive-in-vue-js/

类别 C（CATEGORY C）

• BR（C.1）：身份验证（Authentication）

  新 Web 应用必须具备基础身份验证机制（登录/注册功能与用户账户），以提供机密性（confidentiality）。

• BR（C.2）：基于角色的身份验证（Role-based authentication）

  新 Web 应用必须具备基于角色的身份验证机制（支持不同类型的用户），至少两种角色，以在页面上支持不同的授权级别。

• BR（C.3）：评分（Rating）

  新 Web 应用必须实现聚合评分功能。用户可以评分，并查看针对某一特定方面（例如“评论”）的所有用户的平均评分。

• BR（C.4）：安全（Security）

  新 Web 应用必须实施基础安全措施以防御在线攻击（如 XSS），并遵循基础安全实践（例如实现客户端数据校验）。