1、渐进式线上项目案例的建设渐进式线上项目案例的建设 任海 华智杰 靳晓敏【摘要】基于互联网+教育模式下，传统的教学模式、课堂教学结构、课程资源都不能适合目前高校的前端课程教学，本文以软件工程专业的 Web 前端课程为例，构建了基于 S-CMS 的开放、协作、分享的渐进式线上前端项目案例，并给出了具体实现步骤，强调以学生自主学习为中心，有助于培养学生实际动手能力。【关键词】前端课程 S-CMS 渐进式项目案例 一、概述 随着国家颁布中长期教育规划纲要和教育信息化工作要点，提出了优质教育资源的开发与应用、强化实践教育环节的背景下，各种在线教育资源平台如雨后春笋般出现，几乎覆盖所有的线下教育，如何强化
2、教师利用信息技术所提供资源，如何深化创新人才培养模式，形成个性化数字教育平台资源，就尤其重要。余晓兰提出了基于 MOOC 平台 SPOC 模式与传统网页设计与制作课程课堂教学的混合教学模式，培养学生自主学习优质教学资源能力;宗月萍提出了基于清华优慕课教学平台的网页设计与制作课程为例线上线下混合式教学;王菁等阐述了基于云平台的“网页设计与制作”的课程辅助教学平台，通过制定合理教学内容，提高教学效果;为提高教学质量和培养学生的创新能力，汪荣提出了基于网络教学平台下网页设计与制作网络教学平台;为了运用信息化手段进行教学改革，顾盼提出了基于雨课堂平台的混合式的教学方式;为了加强在线课程的建设，汤智华提
3、出了基于互联网+背景下，并以网页设计与制作课程为例，从课程建设、课程内容、资源建设进行了相关的研究和探讨;以上论述从不同角度阐述了基于互联网+模式下的前端课程改革的必要性和紧迫性。二、渐进式线上项目案例的建设（一）渐进式线上项目案的设计理念 伴随着教育信息化的迅猛发展，特别是教育大数据、云计算、MOOC、翻转课堂、微课、创客和智慧教育等线上教学平台的出现，教育模式发生了巨大的变革，传统的 Web 前端课程如何跟进时代的发展，改变教学观念，更新教学方法，提高教学效果就尤其迫切，本文提出了基于 S-CMS 的渐进式线上前端项目案例建设为核心理念，强调吸收整合互联网最新的前端资源，以学生自主为中心的
4、研究性、探究性的学习模式，支持学生和教师共同参与建设项目案例，以项目为主导，学生从【前端理论学习】-【项目案例实践】-【线上项目应用】，三位一体、一站式的个性化的教学模式。（二）渐进式线上项目案例平台的选择 本文所采用的平台为 S-CMS 作为线上前端项目案例主要的实现方式。该系统提供了完整电脑端模板、移动端模板、生成 APP 和微信小程序四大核心功能，其所提供的后台管理系统，所有学生可以直接通过添加后台数据，将数据显示到前端页面，降低学生后端开发的难度，满足当前所有前端教学案例的集成与实现。（三）渐进式线上项目案例资源的选择 主要范围涉及校企合作案例、在线专业教育平台案例、自主开发案例、学生
5、推荐案例、典型教材案例、微信公众号案例、前端技术类 APP 和网站案例等，整合优质典型的前端項目案例，通过 S-CMS 制作对应的线上前端案例，供所有相关人员进行交流和学习。（四）渐进式线上项目案例的构建步骤 无论是移动端的项目案例还是 PC 端的项目案例，均可以通过移动端或 PC 端模板来制作，或者通过系统扩展进行微信小程序和 App 的开发，具体的操作流程如下：第一步：开发环境的安装：首先，注册阿里云，登录购买云服务器 ECS，并在所购买的云服务器上安装 PHPstudy 做为服务器环境，并将对应的 S-CMS 系统进行安装云服务器上。第二步：登录后台主界面，学生和教师分别注册管理员权限，
6、了解 S-CMS 文件结构，PC 版模板和移动版模板存放的文件夹，掌握 S-CMS 模板共 9 种类型常见的页面结构及其引用方式。第三步：S-CMS 提供了丰富的函数和标签，以满足不同模板的开发，函数格式：$函数名（参数 1，参数 2，参数 3）和标签格式：SL_标签名称。其中标签为后台数据库与前端页面之间的中介，通过前端页面调用系统标签来显示相应的数据内容。标签分为两类：通用标签和功能标签，功能标签又分为简介页面、新闻列表页标签、新闻内容页标签、产品列表页标签、产品内容页标签、万能表单页标签和联系页面标签。第四步：前端项目案例，均可以上述标签和函数，将前端页面改写成对应的页面模板。然后，登录
7、后端管理界面，添加后台页面数据，更新缓存数据，真正把前端项目案例页面通过 S-CMS 所提供的标签和函数，变成具体项目案例的线上实际应用案例。三、结束语 本文借助 S-CMS 系统，降低前端学习过程中，后端的零门槛开发，学生和教师只需要整合现有的优质项目案例，进行模板转化，就可以轻松开发出移动端或PC 端网站页面应用，因此，渐进式线上项目的构建，既能充分调动学生学习积极性和主动性，将理论实践应用一站式的学习模式，又能提升教师熟练掌握前端理论与实践，不断更新教学观念，改进教学方法，提高教学效果和教学质量，全面推进前端人才培养的新机制。参考文献：1余晓兰.MOOC 平台基于 SPOC 的混合教学模
8、式在高职网页设计与制作课程中的实践探索J.科技经济市场，2019（04）：145-147.2宗月萍.基于清华优慕课教学平台的线上线下混合式教学实践分析以高职计算机专业网页设计与制作课程为例J.中国新通信，2019，21（07）：202-203.3 王菁，曾文娟.基于云平台的“网页设计与制作”课程教学实践探索J.信息系统工程，2019（02）：168-169.4 汪荣.基于网络教学平台下网页设计与制作课程创新能力培养的教学设计研究实践思考J.才智，2018（34）：169-170.基金项目：课题：吉林省教育科学“十三五”规划一般规划课题，课题名称：吉林省西部高校 Web 前端课程教学改革的研究，课题编号（GH180580）。作者简介：邵英安（1982-），男，汉族，籍贯：吉林白城，学历：硕士，研究方向：Web 全栈开发;张强（1963-），男，汉族，籍贯：吉林松原，学历：硕士，研究方向：软件工程;白南石（1982-），男，汉族，籍贯：吉林白城，学历：硕士，研究方向：Web 程序开发;李婧（1977-），女，汉族，籍贯：吉林白城，学历：硕士，研究方向：程序算法;杨春岩（1982-），女，汉族，籍贯：吉林白城，学历：硕士，研究方向：前端设计。
