漸進式線上項目案例的建設

任海　華智杰　靳曉敏

【摘要】基于互聯網+教育模式下，傳統的教學模式、課堂教學結構、課程資源都不能適合目前高校的前端課程教學，本文以軟件工程專業的Web前端課程為例，構建了基于S-CMS的開放、協作、分享的漸進式線上前端項目案例，并給出了具體實現步驟，強調以學生自主學習為中心，有助于培養學生實際動手能力。

【關鍵詞】前端課程??S-CMS??漸進式項目案例

一、概述

隨著國家頒布中長期教育規劃綱要和教育信息化工作要點，提出了優質教育資源的開發與應用、強化實踐教育環節的背景下，各種在線教育資源平臺如雨后春筍般出現，幾乎覆蓋所有的線下教育，如何強化教師利用信息技術所提供資源，如何深化創新人才培養模式，形成個性化數字教育平臺資源，就尤其重要。

余曉蘭提出了基于MOOC平臺SPOC模式與傳統《網頁設計與制作》課程課堂教學的混合教學模式，培養學生自主學習優質教學資源能力;宗月萍提出了基于清華優慕課教學平臺的《網頁設計與制作》課程為例線上線下混合式教學;王菁等闡述了基于云平臺的“網頁設計與制作”的課程輔助教學平臺，通過制定合理教學內容，提高教學效果;為提高教學質量和培養學生的創新能力，汪榮提出了基于網絡教學平臺下《網頁設計與制作》網絡教學平臺;為了運用信息化手段進行教學改革，顧盼提出了基于雨課堂平臺的混合式的教學方式;為了加強在線課程的建設，湯智華提出了基于互聯網+背景下，并以"網頁設計與制作"課程為例，從課程建設、課程內容、資源建設進行了相關的研究和探討;以上論述從不同角度闡述了基于互聯網+模式下的前端課程改革的必要性和緊迫性。

二、漸進式線上項目案例的建設

（一）漸進式線上項目案的設計理念

伴隨著教育信息化的迅猛發展，特別是教育大數據、云計算、MOOC、翻轉課堂、微課、創客和智慧教育等線上教學平臺的出現，教育模式發生了巨大的變革，傳統的Web前端課程如何跟進時代的發展，改變教學觀念，更新教學方法，提高教學效果就尤其迫切，本文提出了基于S-CMS的漸進式線上前端項目案例建設為核心理念，強調吸收整合互聯網最新的前端資源，以學生自主為中心的研究性、探究性的學習模式，支持學生和教師共同參與建設項目案例，以項目為主導，學生從【前端理論學習】->【項目案例實踐】->【線上項目應用】，三位一體、一站式的個性化的教學模式。

（二）漸進式線上項目案例平臺的選擇

本文所采用的平臺為S-CMS作為線上前端項目案例主要的實現方式。該系統提供了完整電腦端模板、移動端模板、生成APP和微信小程序四大核心功能，其所提供的后臺管理系統，所有學生可以直接通過添加后臺數據，將數據顯示到前端頁面，降低學生后端開發的難度，滿足當前所有前端教學案例的集成與實現。

（三）漸進式線上項目案例資源的選擇

主要范圍涉及校企合作案例、在線專業教育平臺案例、自主開發案例、學生推薦案例、典型教材案例、微信公眾號案例、前端技術類APP和網站案例等，整合優質典型的前端項目案例，通過S-CMS制作對應的線上前端案例，供所有相關人員進行交流和學習。

（四）漸進式線上項目案例的構建步驟

無論是移動端的項目案例還是PC端的項目案例，均可以通過移動端或PC端模板來制作，或者通過系統擴展進行微信小程序和App的開發，具體的操作流程如下：

第一步：開發環境的安裝：首先，注冊阿里云，登錄購買云服務器ECS，并在所購買的云服務器上安裝PHPstudy做為服務器環境，并將對應的S-CMS系統進行安裝云服務器上。

第二步：登錄后臺主界面，學生和教師分別注冊管理員權限，了解S-CMS文件結構，PC版模板和移動版模板存放的文件夾，掌握S-CMS模板共9種類型常見的頁面結構及其引用方式。

第三步：S-CMS提供了豐富的函數和標簽，以滿足不同模板的開發，函數格式：{$函數名（參數1，參數2，參數3）}和標簽格式：{@SL_標簽名稱}。其中標簽為后臺數據庫與前端頁面之間的中介，通過前端頁面調用系統標簽來顯示相應的數據內容。標簽分為兩類：通用標簽和功能標簽，功能標簽又分為簡介頁面、新聞列表頁標簽、新聞內容頁標簽、產品列表頁標簽、產品內容頁標簽、萬能表單頁標簽和聯系頁面標簽。

第四步：前端項目案例，均可以上述標簽和函數，將前端頁面改寫成對應的頁面模板。然后，登錄后端管理界面，添加后臺頁面數據，更新緩存數據，真正把前端項目案例頁面通過S-CMS所提供的標簽和函數，變成具體項目案例的線上實際應用案例。

三、結束語

本文借助S-CMS系統，降低前端學習過程中，后端的零門檻開發，學生和教師只需要整合現有的優質項目案例，進行模板轉化，就可以輕松開發出移動端或PC端網站頁面應用，因此，漸進式線上項目的構建，既能充分調動學生學習積極性和主動性，將理論實踐應用一站式的學習模式，又能提升教師熟練掌握前端理論與實踐，不斷更新教學觀念，改進教學方法，提高教學效果和教學質量，全面推進前端人才培養的新機制。

參考文獻：

[1]余曉蘭.MOOC平臺基于SPOC的混合教學模式在高職《網頁設計與制作》課程中的實踐探索[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-），女，漢族，籍貫：吉林白城，學歷：碩士，研究方向：前端設計。