Web前端開發課程建設的探索與實踐

龍軍，王家寧

摘要：本文介紹Web前端發展史及相關技術，闡述Web前端開發職業技能等級證書知識體系、考綱和考點，研究Web前端開發課程體系構建，開展教材及課程內容的教學改革實踐，進行計算機相關專業1+X證書教育教學的探索總結。

關鍵詞：1+X;職業證書;前端開發;Web全棧開發

中圖分類號：TN91 1-34? ? 文獻標識碼：A

文章編號：1009-3044（2021）19-0196-03

前端開發指用HTML、CSS、JavaScript及衍生的技術、框架、解決方案創建Web/App前端界面的過程。隨著用戶體驗和交互重要性提升，界面設計更加精美、人性化和個性化，Web前端開發人才需求大，大學生就業前景廣闊。

2019年3月，工信部發布《Web前端開發職業技能等級標準》（簡稱該標準），明確初、中、高三個等級的具體內容和要求。4月教育部、發改委等部門印發《關于在院校實施“學歷證書+若干職業技能等級證書”制度試點方案》，開啟“1+X證書”試點，進行復合型人才培養的改革，拓展技術技能人才就業創業本領。之后教育部發布《關于做好首批1+X證書制度試點工作》，將Web前端開發職業技能等級證書納入首批啟動試點證書。

1 Web前端開發的發展歷史

Web前端開發從網頁制作開始，伴隨互聯網發展逐步壯大。Web1.0時，初期是以圖片和文字為主的靜態網站，隨著ASP、JSP、PHP等交互型技術出現，動態網站開始普及。2005年Web2.0時，類似桌面軟件的Web應用涌現，網頁更加生動、交互更加友好，用戶從瀏覽者發展為參與者和創造者。目前是Web3.0初期，特點是分布式，以網絡化和個性化提供更多人工智能服務，完全基于Web，用瀏覽器即可實現復雜軟件的功能。同時移動互聯網帶來大量高性能的移動終端和無線網絡，移動端開發成為趨勢。

2 Web前端開發核心技術

Web前端開發由美工、瀏覽器兼容、CSS、HTML、交互式設計和視覺設計等組成。

HTML超文本標記語言是Web頁面的主體，用于描述文本結構。HTML5是HTML最新版本，引入多項新技術，增強了對應用的支持，使Web技術接近原生技術。

CSS層疊樣式表用一系列規則美化網頁元素，把網頁內容結構代碼和格式風格代碼分離。

JavaScript是基于ECMAScript規范的直譯式腳本語言。ES6規范泛指2015年發布的JavaScript標準及新增特性。

Apache是開源網頁服務器，能在多數操作系統中運行，可通過API進行擴充。

Node.js是運行在服務端的JavaScript，使用事件驅動、非阻塞式I/O模型。

jQuery是一快速JavaScript庫，簡化HTML文檔節點查找、Ajax互動、事件處理和動畫。

jQueryMobile是移動Web應用框架，用HTML5、CSS3和少量腳本對頁面進行布局。

Bootstrap是推特公司基于HTML、CSS、JavaScript的前端開發框架。

Vue.js是構建交互式的Web界面庫，采用MVVM框架模式，通過API實現響應的數據綁定和組合的視圖組件。

Laravel是開源PHP框架，采用MVC框架模式，重用不同框架的現有組件，設計的Web應用程序更加結構化和實用。

Django是用Python寫的開源Web開發框架，采用MTV框架模式，有眾多第三方插件，具有較強的可擴展性。

3 該標準的考綱

該標準依據專業活動、圍繞專業技能，充分考慮從業人員的職業發展，以職業素養、職業技能、知識水平為主要框架，有HTML、CSS、JavaScript、ES6標準、數據庫應用、項目模塊化開發、復雜交互與優化等知識和能力模塊，能根據技術發展進行靈活調整。標準密切貼合國家、產業、市場和學生就業需要。

主要崗位：Web/App網頁設計與制作，構建響應式頁面，搭建、規劃、設計網站。

職業技能特征：較強邏輯思維能力，良好代碼編寫習慣，溝通能力強，運用色彩搭配、點線面布局來設計較好用戶體驗網站頁面的能力。

考核方式：采用上機形式的閉卷考試，包括理論和實操，兩項成績均合格才能獲得相應級別的職業技能等級證書。

4 該標準的知識體系

該標準分為初、中、高三級，依次具有靜態網頁開發能力、動態網頁設計開發能力、復雜網頁設計開發和網站架構設計規劃能力。

初級證書考查100%初級知識模塊，中級證書考查20%初級和80%中級知識模塊，高級證書考查17%初級、29%中級和54%高級知識模塊。

5 該標準的考點

該標準涵蓋靜態網站、動態網站、移動端靜態網站、移動端動態網站4個工作領域，各級知識能力模塊逐級深化。

6 Web前端開發的課程體系

Web前端開發有HTML5+CSS3、JavaScript+Ajax、PHP+MySQL、RESTful、jQuery/jQuery Mobile、開發框架、移動App、軟件工程等多門課程，由不同教師跨多個學期組織教學，知識點不連貫或重復，學生對課程銜接理解不深。

通過對就業崗位研究，以需求和應用為導向，結合考證，打破課程間的隔閡，用模塊化教學模式，打通Web前端開發人才崗位鏈、能力鏈、技術鏈和知識鏈，將不同課程優化融合成一門課程，建立起循序漸進、螺旋上升的模塊化課程體系。

課程基于分布式應用系統，以Restful為紐帶，將各類應用連接起來，實現不同系統的數據共享，進行Web應用全棧開發。著力培養學生的Web編程技能、工程實踐能力、創新創業素質和職業道德素養，將課程的教育教學與考證結合，加入軟件工程和測試模塊，為培養Web應用全棧工程師奠定基礎。