第十七届蓝桥杯全国软件和信息技术专业人才大赛【Web 应用开发】-CSDN博客

本文链接：https://blog.csdn.net/2302_77059843/article/details/147980361

报名

报名时间：2026 年蓝桥杯 Web 应用开发的报名时间可能在 2025 年 10 月至 12 月，具体截止日期可能在 12 月中旬左右。
考试时间：2026 年蓝桥杯 Web 应用开发的省赛可能在 2026 年 4 月举行，国赛可能在 2026 年 6 月中上旬举办。

试题形式：均为场景实战题（编程实操）。题目包含完整的题面 PDF 文档和基础源代码压缩包，选手需根据题面文档中详细说明的背景、需求、目标，结合基础源代码，通过修改、新增代码来实现最终目标。部分题目可能有前序准备步骤，如解压缩资源文件、在浏览器中预览网页效果等。
知识范围：
- HTML5：包括页面结构搭建、语义化标签使用、表单元素应用等。
- CSS3：涉及样式设计，如布局（Flexbox、Grid 等）、样式属性（颜色、字体、边框等）、动画效果实现等。
- JavaScript：涵盖基础语法、DOM 与 BOM 操作、内置对象使用、事件处理、AJAX 异步请求、正则表达式等。
- ES6：如箭头函数、解构赋值、模板字符串、Promise 等新特性的应用。
- Axios：用于进行 HTTP 请求，包括 Axios API 的使用、实例创建、请求配置、默认配置以及拦截器的设置等。
- Vue.js（v3.0+）：Vue 核心知识，如常用指令、模板语法、生命周期、数据渲染、事件绑定等；组件相关，包括组件定义及使用、父子组件、兄弟组件等；还有 vue - router（v4.x）和 pinia 的使用。
- ElementPlus（v2.3.6+）：UI 组件库的使用，如按钮、表格、表单等组件的应用。
- ECharts（v5+）：基础语法、绘制图表、异步数据加载和更新、交互组件以及事件处理等。
- Node.js（仅限大学组，v12.x）：可能会考查使用 Node.js 编写后端接口等相关知识。
能力考查：
- 需求理解能力：要求选手能够准确阅读、分析和理解题目中的需求描述，明确要实现的目标。
- 功能实现能力：包括实现静态和动态页面效果，开发与调用 API，以满足题目中的功能性需求。
- 非功能需求处理能力：需要考虑兼容性、安全性、性能等非功能性方面，确保 Web 应用在不同环境下稳定、安全且高效地运行。
- 产品交付能力：涉及打包、部署等相关知识，考查选手将开发成果进行最终交付的能力。
竞赛形式：个人赛，省赛、决赛均采用封闭、限时方式进行。选手机器通过局域网连接到各个考场的比赛服务器，答题过程中不允许访问互联网，也不允许使用本机以外的资源（如 USB 连接）。比赛系统以 “服务器 - 浏览器” 方式发放试题、回收选手答案，选手将答案提交到比赛系统中，超过比赛时间将无法提交。
评分方式：全部题目将使用前端自动化测试技术完成机器自动评分。对于功能实现类型的题目，基于单独的测评数据来测试功能实现的完整性；对于页面布局类型的题目，基于最终效果和目标效果的相似度进行评分。

所学题目分类

如何准备？

知识储备

深入学习基础技术
- HTML5：熟练掌握各种标签的语义和用法，如<header>、<nav>、<article>等语义化标签，以便更好地构建页面结构。
- CSS3：精通布局方式，如 Flexbox 和 Grid 布局，能够灵活实现各种页面布局效果；掌握 CSS 样式的优先级和继承规则，以及如何进行浏览器兼容性处理。
- JavaScript：深入理解 JavaScript 的基本数据类型、函数、对象等概念，掌握 DOM 操作方法，能够熟练使用事件绑定、事件委托等技术实现页面交互效果。
掌握框架与库
- Vue.js：熟练掌握 Vue 的组件化开发、路由配置、状态管理（如 Pinia）等核心知识，能够使用 Vue.js 构建单页面应用程序。
- Element Plus：熟悉 Element Plus 的常用组件，如表格、表单、对话框等的使用方法，能够根据设计稿快速搭建页面 UI。
- ECharts：掌握 ECharts 的基本配置项，能够根据数据需求绘制各种类型的图表，如柱状图、折线图、饼图等，并实现图表的交互功能。
了解其他相关技术
- Axios：掌握 Axios 的基本用法，能够使用它进行 HTTP 请求，与后端 API 进行数据交互，包括请求拦截、响应拦截等功能。
- ES6+：熟悉 ES6 及以上版本的新特性，如箭头函数、解构赋值、模板字符串、Promise 等，提高代码的编写效率和可读性。

实践练习

完成基础项目：可以在网上搜索一些开源的 Web 项目进行学习和模仿，也可以自己动手做一些简单的项目，如个人博客、电商网站的前端页面等，将所学知识应用到实际项目中，提高自己的动手能力。
优化项目细节：注重项目的细节，如代码的规范、性能的优化、用户体验的提升等。学习如何压缩图片、合并 CSS 和 JavaScript 文件，以提高页面的加载速度；如何进行表单验证，提高数据的准确性和安全性。