“崗課賽證”下前端開發課程線上實訓的研究*

朱雪梅 黃志成

（廣東女子職業技術學院 廣東廣州 510000）

一、前端開發課程的崗課融通基本要求

2021年4月，全國職業教育大會上提出“崗課賽證”新概念[1]?！皪彙笔枪ぷ鲘徫?、“課”是課程體系、“賽”是職業技能大賽、“證”是職業技能等級證書。崗課賽證是指結合專業對應崗位設置課程，以崗位要求設置職業考證，同時以賽促教，以賽促學，以提升學生的工作崗位實踐能力為人才培養目標。課程是崗課賽證融通的核心與載體，同時將職業資格證書考試與專業課程教學相銜接，做到課程與考證相結合，課程與職業資格證書融合。證書的核心就是“1+X”職業技能等級證書，2019年教育部下發《關于在院校實施“學歷證書+若干職業技能等級證書”制度試點方案》，開啟了“1+X”證書試點工作。所謂的“1+X”，其中“1”指的是學歷證書，而“X”指的是若干職業技能等級證書，“1+X”體現了學歷與能力并重的理念。

前端開發課程對應的是“1+X”web前端開發職業技能等級證書，它對應的知識點是從職業頂層目標（工作領域）出發，分解出這些工作領域的“工作任務”，根據工作任務說明職業技能要求，再依據職業技能要求列出詳細的技能要求，最后從技能要求闡明所需掌握的知識。整個職業技能考查的是學生既要有知識的獲得，又在崗位實踐能力上有所提高，最后提升崗位職業素養，因而前端開發課程的教學應該融入“1+X”技能點，創新該類課程的崗課賽證融通教學[2][3]，讓學生通過課程的學習能夠提高“1+X”考證率，從而達到提高崗位職業能力的教學目標。

二、前端開發課程的教學問題反思

高職學生對于編程類的課程都缺乏編程實踐練習、編程思維能力培養，在崗課賽證融通機制下，如何融入“1+X”考證技能點進行上機實訓教學，是目前高職教育工作者創新教學需要研究的重點問題。以往前端開發課程的實訓教學存在以下問題。

1.實訓內容覆蓋面小

以往前端課程的上機實訓練習或課后實踐，都是課堂某個知識點的反復練習，幾乎很少覆蓋“1+X”考證內容技能點，無法做成“1+X”考證題庫。大多數實訓操作練習都是安排學生照葫蘆畫瓢，進行驗證性上機實訓，學生不會遷移運用，學習效果差，學生能力與企業真實職業崗位要求差距較大。同時，上機練習學生達不到量的有效訓練，更談不上質的提高。學生只有較為全面掌握和熟練運用編程語言，才能更好勝任企業崗位軟件開發工作。

2.實訓線下輔導效率低

學生在上機訓練時，都需要教師一對一指導才了解自己的實訓效果。課上時間有限，教師很難對每個學生進行一一指導，更談不上分層教學，針對性輔導。教師因為同時帶多個班教學，批改作業不能及時給予反饋，教學效率低、教學效果差，從而打擊學生學習的積極性。

由上而知，學生在傳統的前端開發課程實訓中很難進行知識遷移運用和能力拓展。針對高職學生量身訂造，又能按照高職教育的崗課賽證新要求，融入企業“1+X”考證內容，使用人工智能技術提升上機實訓教學效率，能在疫情常態化管控下輔助教師進行線上教學，創新線上線下教學形式，實現崗—課—賽—證融合的上機實訓系統，顯得非常有必要。

三、崗課賽證融通下前端開發課程能力要求

崗課賽證融通下的職業教育，“崗”是育人標準，“課”是育人核心，“賽”是育人手段，“證”是能力拓展。前端開發課程根據“1+X”證書技能點對課程進行重構，將企業真實項目引入教學，結合企業崗位需求設置教學內容，根據工作流程設置課程任務。

“1+X”Web前端開發職業技能等級標準（簡稱“技能標準”）分為初級、中級和高級，以中級技能點為例來進行說明。中級證書的技能標準的工作領域為：靜態網頁搭建、動態網站搭建、移動端靜態網站開發、移動端動態網站開發；工作任務主要是網頁開發和美化，技能點主要是HTML、CSS、CSS3、JQuery等前端知識，根據技能標準要求的技能點，對課程內容進行重構，形成“以項目為載體”的項目化課程，每個項目是校企合作遴選的市場需求的真實企業項目，每個項目再根據工作流程細化為需求分析、功能實現、成果展示評價等各個具體的工作任務（如圖1所示）。

圖1 前端課程“1+X”技能點要求

四、融入“1+X”技能點的前端開發課程線上智能實訓平臺的研究

線上智能實訓平臺適用于web前端課程群（含網頁設計類課程、JavaScript程序設計類課程、CSS樣式布局類課程）的上機實訓系統，能對學生上機的操作進行智能化判斷，提高web前端類課程上機實訓的教學質量，提升學生“1+X”考證能力。

1.線上智能實訓平臺的研究現狀

根據“1+X”證書技能的要求，Web前端開發類課程的主要知識點為HTML，CSS，Javascript動態特效、API等，前面所述急需開發的線上實訓平臺主要就是考查學生HTML，CSS及Javascript代碼編寫能力，并對學生的代碼進行智能評價。人工智能評價學生的結果需要的技術復雜，涉及前端網頁測試領域。軟件測試的一個分支就是前端網頁測試，目前研究的主流方向就是自動化測試。2004年，國外就開始了網頁的自動化測試技術的研究。自動化測試在國內的發展較晚，且技術水平較低。文獻最早提出一種網頁系統自動化測試框架和規范，并應用框架開展網頁自動化測試，取得一定成效[4]。文獻應用Selenium技術設計了一種網頁自動化測試平臺，針對個別網頁功能可實現自動化測試[5]。國內研究人員多是基于這些技術開展應用層的研究。而且根據國內研究趨勢來看，前端自動化測試技術朝著更加智能化方向發展，融入人工智能和大數據的前端自動化測試將是今后的發展趨勢。

從中國期刊網上得到的文獻資料和從互聯網公開的資料顯示，目前大多數研究均集中在網頁人機交互自動化測試方面，在web前端課程實訓教學方面尚少人研究，對web前端上機實訓操作結果進行智能評價的目前尚屬空白。根據目前高職教育的崗課賽證發展要求，以及前端實訓課程的迫切需求，研究一款融入企業“1+X”考證內容，使用人工智能技術提升上機實訓教學效率，創新線上線下混合教學模式的線上智能實訓平臺有非常重要的教育意義。

2.線上智能實訓平臺的技術研究

本研究基于phantomJS底層技術，設計開發一個web前端課程線上實訓智能評價的輔學系統，具有開拓性和創新性。該平臺的開發具有很大技術難點。

（1）對傳統上機實訓系統進行解構和重構，實現云端應用，原生支持互聯網+教學

主流的web前端設計課程群上機實訓軟件均為單機PC版，需要在電腦上安裝專用實訓軟件，一般由管理員安裝在機房。本研究的技術難點之一是采用新技術，對上機實訓系統進行解構和重構，采用新一代云計算技術，應用前端最前沿框架技術，對上機實訓所需的功能進行重新實現，實現上機實訓系統云端化應用，只需要瀏覽器便可進行在線上機實訓。

（2）實現上機實訓結果智能評價

傳統web前端類課程的上機實訓都是制作一些動態、動效類的網頁特效，這些特效屬視角領域，這類上機實訓結果往往需要教師進行人工評價。本研究的技術難點之二就是，應用前端自動化測試技術，通過特殊技術，對上機操作產生的結果進行量化，應用最新人工智能技術，對學生上機結果進行智能評價和實時反饋。

該平臺的開發技術架構綜合使用selenium、phantomJS等webdriver前端自動化測試框架，UIKit，HighLight，CodeMirror，Axios，JQuery，EChart，Webpack等前端框架和工具庫，采用B/S架構進行開發，如圖2所示。前端使用ES6 JavaScript、TypeScript設計前端功能，后端采用C.Net動態技能開發服務器腳本，采用MySQL進行數據庫存儲。

圖2

3.線上智能實訓平臺題庫說明

線上智能實訓平臺的題目是教師通過將“1+X”考證內容融入課程教學，設計不同能力層次實訓操作題，調動各個能力層次的學生，學生通過反復、闖關式訓練獲得成就感，達到強化程序編制實際動手能力。教師可以從繁重的輔導中得到解放，開展翻轉課堂教學，把精力放在監控學生的學習情況，實時更新“1+X”技能題庫，調整教學策略上，從而為不同學生提供不同的教學內容，針對不同生源實施精準分層教學?；谙到y構建線上虛擬實訓室，還可以實現互聯網+教學。

線上智能實訓平臺有管理員賬號和用戶賬號，管理員（教師角色）后臺設置題目，查看學習曲線等數據信息，用戶（學生角色）登錄系統選擇相應的題目進行強化訓練。題庫的導航欄是由題目、知識點、難度、分值、狀態和操作六大項組成，知識點是將技能標準的技能知識點融入課程教學內容，將技能點拆分重組為題目設置的知識點，難度是題庫設置了低中高三種難易程度的題目，不同難易程度的題目對應的是不同分值，狀態就是顯示你是否做過這道題，操作就是題目練習入口，如圖3所示。

圖3 線上智能實訓平臺題庫

題庫對“1+X”web前端開發職業技能等級標準里的技能點進行拆分重組，比如JS分解為不同的語法基礎，如類型轉換、表達式、函數等，每個知識點設置不同難度的題由淺入深逐層深化進行實訓，通過三階段學習達到掌握知識點的目標。

結語

本文針對如何實現前端開發課程“崗課賽證”融通教學，開發設計一個線上智能實訓平臺，該實訓平臺是將“1+X”證書的技能點融入設置實訓題目，不僅對學生課上知識進行強化訓練，也對學生知識遷移運用，備戰“1+X”考證有很好的輔助作用，同時也實現了崗課賽證導向教學下的“課證”融通教學。