浅析高职院校Web前端开发课程体系建设

摘 要：Web前端开发课程是高职院校计算机相关专业重要的课程，其教学目的就是使学生通过学习Web开发技术，具备独立开发Web前端产品的能力。本文简单介绍了Web前端和学习Web前端具备的基本技能;分析了工业和信息化部教育与考试中心下发的关于Web前端开发职业技能等级标准的主要内容;深度剖析了Web前端开发的核心课程，为高职院校计算机教师有效开展Web前端开发课程的教学提供了指导。

关键词：Web前端;高职;课程体系

Web前端开发是从网页制作演变而来的，名称上有很明显的时代特征。在互联网的演化进程中，网页制作是Web1.0时代的产物，那时的网站主要内容是静态的，用户使用网站的行为也以浏览为主。2005年以后，互联网进入Web2.0时代，各种类似桌面软件的Web应用大量涌现，网站的前端由此发生了翻天覆地的变化。网页不再只是承载单一的文字和图片，网页上各种生动交互式的软件为用户提供了更好的使用体验，这些都是基于前端技术实现的。高职院校的人才培养目标是培养技能型人才，高职院校Web前端开发课程也应该与时俱进，跟上飞速发展的信息时代。

1 Web前端

Web前端也被称为“客户端”，是用户可以看到和体验到的网站视觉方面，即用户所看到的一切Web浏览器展示的内容，涉及用户可以看到，触摸和体验的一切。Web前端包括Web页面的结构、Web的外观视觉表现以及Web层面的交互实现。随着互联网技术的发展和HTML5、CSS3的应用，现代网页更加美观，交互效果显著，功能也更加强大。

2 如何进行Web前端的学习

学习Web前端需要三个必备的基础技能：HTML、CSS、JavaScript。这三个是前端开发中最基本也是最必须的三个技能。前端的开发中，在页面的布局时， HTML将元素进行定义，CSS对展示的元素进行定位，再通过JavaScript实现相应的效果和交互。除了这三种核心的技术必须学会以外，还有其他的知识也需要我们掌握，例如jQuery、Ajax、各种常用的框架、以及后端技术。

3 高职院校Web前端开发课程体系建设

工业和信息化部教育与考试中心下发了关于Web前端开发职业技能等级标准，在该标准中明确提出了Web前端开发职业技能的培养目标，就业方向，衔接专业，考核方式，主要课程等等，为高职院校Web前端开发课程的教学指明了方向。

3.1 Web系统开发过程

Web前端系统开发过程：先是项目的提出;然后进行需求分析;后面进入设计阶段，有UI设计和系统设计;设计结束后分别进行前端和后台的开发;以上工作结束后完成系统测试和项目的发布与维护。

3.2 Web系统开发相关岗位

Web系统开发的相关岗位：产品经理或项目经理下属分别有IU/UE、前端开发和服务端开发。

3.3 考试中心下发的核心课程

MySQL 数据库基础与应用、PHP 技术与应用、Web 前后端数据交互技术、响应式开发技术、网站项目实战等课程。

3.3.1 MySQL 数据库基础与应用

MySQL是一个关系型数据库管理系统，是最流行的关系型数据库管理系统之一，在 Web 应用方面，MySQL是最好的 RDBMS （Relational Database Management System，关系数据库管理系统） 应用软件。MySQL拥有体积小、速度快、性能高、使用简单等优点，同时其开放源代码也使得其具有使用门槛低的特点。

3.3.2 PHP 技术与应用

PHP（Hypertext Preprocessor）是全球最流行的Web程序开发语言，没有之一，而是唯一。语法简单，易于学习、功能强大、灵活易用。集众家之所长融合了现代编程语言（如 C、Java 和 Perl）的一些最佳特性以及PHP自创新的语法。PHP、Apache和MySQL的组合已成为Web服务器的一种配置标准。PHP当仁不让的成为Web脚本技术的先驱，引領Web技术的潮流。

PHP是一种HTML内嵌式的语言，和微软的ASP颇有几分相似，都是一种在服务器端执行的嵌入HTML文档的脚本语言，被很多的大型门户网站所使用，例如：腾讯、新浪、百度等等。用PHP做出的动态页面与其他的编程语言相比有更快的执行速度。PHP支持几乎所有流行的数据库以及操作系统，完全不必考虑跨平台问题。

3.3.3 Web 前后端数据交互技术

了解Web的概述。掌握HTTP协议，主要掌握 HTTP协议概述、通信过程、状态值汇总等。掌握并能灵活应用Ajax技术，通过理解 Ajax简介、工作原理等，掌握 JSON解析和XML解析，应用DOM的操作。了解Iframe和 Socket通信，了解Socket概念、工作原理、服务端与客户端、通信协议、通信机制、通信过程。掌握Cookie工作原理、作用、创建、使用、销毁等操作。

3.3.4 响应式开发技术

了解Bootstrap概述;掌握并能灵活应用 Bootstrap栅格布局，掌握Bootstrap 栅格基本布局、水平布局、垂直布局、栅格排序、偏移等操作。能应用Bootstrap样式中的媒体对象、文本、列表、表格、图片、表单、辅助样式（背景色、文本颜色）。掌握Bootstrap组件，应用Bootstrap按钮、表格、下拉菜单、按钮组、输入框组、导航、标签、徽章、缩略图、警告框、进度条、版式、字体图标等。掌握SASS的概述、安装配置、基础语法等。

3.3.5 网站项目实战

完成实战项目的设计与开发。可以采用线上线下相结合的实训方式，与项目实例相结合的教学方法，以面向门户网站、交易类网站、企事业网站、娱乐性质网站的规划与建设、开发与维护、关系型数据库开发与管理等为实训项目内容，配备一定量的企业实际项目。

从目前高职院校教学的发展现状来看，经过多年的教学实践，显然已经取得了前所未有的重大突破。要实现面向未来的长远发展，还需要所有同仁开拓进取，完善不足。

本论文为天津市高等职业技术教育研究会（2019）年度课题“1+X证书制度下职业教育改革实施路径研究——以Web前端为例”（课题批准号：2020-4010）的研究成果。

作者简介：任志娟（1971-），女，天津人，教师，副教授，主要从事数据库、程序设计等方面的教学和研究。