與職業(yè)標準銜接的Web前端開發(fā)課程教學探索與實踐

龔蘭蘭,凌興宏

（1．蘇州大學文正學院 計算機工程系，江蘇 蘇州 215104；2．蘇州大學 計算機科學與技術學院，江蘇 蘇州 215006）

0 引 言

互聯(lián)網(wǎng)行業(yè)發(fā)展迅猛,越來越多Web開發(fā)技術的應用出現(xiàn)在我們的生活中。Web應用開發(fā)技術成為計算機專業(yè)學生走上社會、專業(yè)對口就業(yè)不可或缺的一門知識和技術[1]。目前,國內許多高校將Web 開發(fā)技術等相關課程作為計算機專業(yè)學生的專業(yè)必修課。結合社會職業(yè)需求,將職業(yè)能力要求融入到課程體系中[2],進行課程建設的探索和實踐,是當前應用型本科院校提升學生專業(yè)能力的方向之一。

1 Web前端開發(fā)課程現(xiàn)存問題

一個完整的Web應用開發(fā)所需技術一般涉及前端、服務器端和數(shù)據(jù)庫3部分,因此從應用開發(fā)的角度來說,計算機相關專業(yè)的課程設置,不可能單靠某一門課程實現(xiàn)Web應用開發(fā)所需要的所有知識和技能的學習,而是一個課程體系的前后相輔相成。目前實現(xiàn)Web應用開發(fā)至少需要以下幾門課程:前端開發(fā)技術(html,Css,JavaScript),服務器編程(語言類:C#,php,Java,Python),數(shù)據(jù)庫技術(Mysql,Sqlserver),Web應用綜合開發(fā)(框架編程)。前后課程的設置順序和內容,要為最終完成一個Web應用而服務。

目前,許多院校設置的Web開發(fā)相關課程,重點放在服務器端編程的教學,忽略了對于前端技術的重點應用。蘇州大學文正學院之前在計算機專業(yè)的課程設置中,Web開發(fā)類只有一門課程Web應用開發(fā),在該門課程內容中綜合了前端、asp.net和數(shù)據(jù)庫的技術,學生對于前端技術毫無基礎,教學過程中教師大部分的教學重點放在asp.net服務器端編程上,學生雖然能實現(xiàn)一定的功能,但是由于缺少前端課程的學習,最后提交的Web 項目的用戶體驗感不佳。作為Web應用開發(fā)的主要也是首要學習的課程,Web前端開發(fā)已經(jīng)作為一門獨立的課程,該課程目前存在以下的問題。

1.1 課程設置

在課程設置上,Web前端開發(fā)課程與其他課程教學之間互相獨立,不具備前后的連貫性。如前文所說,Web應用開發(fā)需要一系列技術,因此相應的一系列課程的安排首先在時間上要具備合理性,前導和后續(xù)課程之間要具備連貫性。

1.2 課時安排

課時安排不合理,理論課和實踐課的比例最初是3:1,每周3節(jié)理論課1節(jié)實踐課。Web前端開發(fā)是一門實踐性和應用性極強的課程,學習的主要手段就是需要多做、多練,因此這樣的課時安排實踐課時明顯不足。

1.3 實踐環(huán)節(jié)

在實踐教學中,雖然使用了案例演示、任務驅動等教學方式,但案例的選擇一方面大部分來源于教材,僅僅是圍繞某個知識點進行的,各案例之間互不關聯(lián),缺乏連續(xù)性;另一方面案例也比較陳舊。此外,布置給所有學生的任務都是相同的,各任務之間也是相互獨立的,各任務之前缺乏連貫性和整體性。對學生來說,僅僅是完成了幾次分散的作業(yè)練習,不能形成一個完整的項目,而且相同的任務很難避免抄襲現(xiàn)象。

1.4 教學內容

課程內容上,主要的還是傳統(tǒng)的html、Css和JavaScript技術,缺乏對新功能、新版本以及目前主流框架、工具的引入。

1.5 考核方式

考核方式還停留在以期末筆試為主的方式上,Web前端開發(fā)不同于其他語言編程類課程,很多內容需要靠實際運行效果才能判定學生是否掌握了相應的知識和技能,會做題不代表能開發(fā)出好的用戶界面,不是在紙上寫一寫就可以下結論的,因此筆試作為主要的考核手段顯得不合理。

教學效果無法體現(xiàn)學生動手實踐綜合能力和水平,只關注投入,缺乏對產(chǎn)出的重視。很多學生在學期結束后還不能做出一個完整、可用的網(wǎng)頁;在畢業(yè)設計系統(tǒng)的界面設計部分也是無從下手,學生最后提交的Web 項目的用戶體驗感不佳;進入企業(yè)更是如此,基本上課內知識早就忘得差不多,無法滿足職業(yè)能力需求,必須重新培訓上崗。

2 教學探索和實踐

Web開發(fā)技術的逐漸盛行,也隨之引起高校的教學改革,結合社會職業(yè)需求,將職業(yè)能力要求融入到課程體系中,進行課程建設的探索和實踐,是當前應用型本科院校提升學生專業(yè)能力的方向之一。

基于產(chǎn)出的教育(OBE)要求根據(jù)培養(yǎng)目標實現(xiàn)的條件設定畢業(yè)要求,按照畢業(yè)要求的達成設置課程體系,教學活動要支持畢業(yè)要求的達成[3]。更重要的是,畢業(yè)要求主要是要求學生解決問題,特別強調解決復雜工程問題的能力為“主要追求”。

結合社會職業(yè)需求和基于產(chǎn)出教育的理念,對Web前端開發(fā)課程教學從以下幾方面展開探索和實踐。

2.1 社會需求的調研

為更好地了解社會職業(yè)需求,對蘇州22家IT相關企業(yè)從Web應用開發(fā)所需要的知識、技能和能力方面進行了調研。

(1)從開發(fā)類型上,22家企業(yè)中有20家企業(yè)的進行Web應用的開發(fā),可見Web應用的開發(fā)的需求量仍然很大,學習Web開發(fā)技能仍舊是計算機專業(yè)學生走上社會、專業(yè)對口就業(yè)不可或缺的知識和技術;

(2)企業(yè)的崗位需求量最大的是前端開發(fā)工程師(如圖1所示),可見Web前端開發(fā)課程開設的必要性;

圖1 企業(yè)崗位需求數(shù)據(jù)

(3)前端開發(fā)技術中需求最大的是 JavaScript、Html5、CSS如圖2所示,最流行的前端框架是BootStrap、Jquery、Node.js,這為Web前端開發(fā)課程的教學內容調整上提供了很好的參考依據(jù);

(4)開發(fā)語言使用最多的是Java語言;

(5)服務器端框架使用較多的還是針對Java的 SpringMvc、SpringBoot和 Mybatis。

除此之外,還對目前企業(yè)較流行的開發(fā)工具、管理工具以及其他的知識能力等職業(yè)素養(yǎng)要求進行了相應的調研和了解。

2.2 思維的改變

教學的改革首先要求從思維上進行改革,對課程有新的認識,才能有新的計劃,以及與之配套的具體措施。

作為應用型本科院校,計算機專業(yè)人才的培養(yǎng)應借鑒OBE(基于產(chǎn)出的教育)導向的教學理念,以培養(yǎng)滿足社會需求的應用型人才為目標,以學生解決問題,特別是解決復雜工程問題的能力為畢業(yè)要求,課程設置、教學實踐活動都要支持畢業(yè)要求的達成。

作為當前計算機專業(yè)學生走上社會、專業(yè)對口就業(yè)不可或缺的知識和技術,Web前端開發(fā)課程在被設為計算機專業(yè)必修課是非常有必要的。在課程學習伊始,甚至是整個過程中,教師要引導學生對Web應用有清晰、具體的認識,從軟件項目開發(fā)的角度,讓其了解到完成一個應用的開發(fā)需要哪些技術和方法,這些知識和技術由哪些課程或者課程的哪部分知識來完成,以及學習該課程后掌握的技能對未來的就業(yè)、升學等有哪些幫助,即所學習課程的作用和意義,幫助學生樹立起明確的學習目標和動力,摒棄原有的盲目學習和應付交差的學習態(tài)度。

互聯(lián)網(wǎng)思維逐漸興起,深入各行各業(yè),對年輕人來說具備互聯(lián)網(wǎng)思維也成為必備職業(yè)素質,尤其是IT行業(yè)。作為計算機專業(yè)的學生,具備互聯(lián)網(wǎng)思維,不僅能提升學習效率,提高問題解決能力,更是信息技術行業(yè)不可或缺的就業(yè)必備技能[4]。

目前,互聯(lián)網(wǎng)思維主要可以包括9個部分[5],在Web前端開發(fā)課程中主要引入其中5個思維:用戶思維、簡約思維、極致思維、迭代思維和社會化思維。

在教學過程中,教師要把互聯(lián)網(wǎng)思維,潛移默化地灌輸給學生,培養(yǎng)他們自己用互聯(lián)網(wǎng)思維去思考和解決問題的能力。對于計算機專業(yè)的學生,這點尤為重要。

2.3 教學內容的重新設計

首先,根據(jù)企業(yè)調研內容以及當前Web前端開發(fā)的主流技術,可進行如下教學內容的調整:①引入Html5的頁面元素、多媒體技術、定位技術、本地存儲等新功能;②在JavaScript部分加入了BOM、DOM的知識;③加入對Ajax技術、 Jquery的介紹和使用;④對于市場流行的一些前端框架技術,選擇了最受歡迎的Bootstrap,引導學生學習和使用框架進行Web開發(fā)。

其次,注重課程內部各部分內容的銜接。在不同階段的教學案例的選擇上,選擇具有連貫性的案例,經(jīng)過幾個不同案例的完成,最終離一個完整的網(wǎng)站設計越來越近。

第三,加強與其他課程的前后銜接。按照Web前端開發(fā)、數(shù)據(jù)庫和Java(或C#、Python)編程語言、Web應用框架開發(fā)的順序設置前導、后續(xù)課程,保證學生具備相應的課程知識后能進行Web綜合開發(fā),最后能順利地完成畢業(yè)設計的項目。除了時間上的先后順序,在教學素材上的積累也可以進行前后銜接,比如,Web應用框架開發(fā)的課程可以直接在前端開發(fā)課程中做好的網(wǎng)站界面的基礎上迭代,進行服務器端的開發(fā),進行前后端整合,省去了前端的時間,也實現(xiàn)了前期成果的再利用和優(yōu)化,最終形成一個完整的Web項目。這就使學生把不同課程的學習連貫起來,學以致用,提升解決問題的能力。

最后,理論實踐課時的調整。由于Web前端開發(fā)是一門操作性和實踐性極強的課程,教師有再多的理論講解和演示都無法保證學生對知識點和技術的掌握、動手能力的提高,因此可將理論實踐比由原來的3:1,先后調整為2:1和1:1,逐步提高實踐課時的比例。

2.4 教學方式、手段的改變

關聯(lián)性案例教學。案例不再局限于教材,而是根據(jù)當前大多數(shù)網(wǎng)站通用的一些功能和效果(如下拉式菜單、圖片輪播等),從網(wǎng)絡、企業(yè)、個人項目等多方面收集案例資源;不同于以往的多個分散獨立的案例,教師選取一些具有關聯(lián)性的案例(可以來自于同一個項目的不同部分)進行相應知識點的演示教學,當所有的案例完成后,基本可以完成一個Web項目前端的主要部分。

迭代式項目教學以項目為主導,任務為驅動。根據(jù)迭代思維,不要求學生一次性做到完美。迭代思維就是一種循序漸進的開發(fā)方法,它允許產(chǎn)品有所不足,允許不斷試錯,在持續(xù)迭代中完善產(chǎn)品。在教學任務設計時,可以從簡單、基本的任務開始,然后逐步迭代,循序漸進,增加任務難度和復雜度,允許小步、快跑、試錯,讓學生在循序漸進完成任務的過程中逐步掌握知識和技能。

互聯(lián)網(wǎng)思維下的任務式驅動,是將一個完整的Web項目拆分成多個子任務,每個任務對應相應的教學知識點,鼓勵學生用用戶思維,從用戶角度去思考需求和功能,進行設計、實現(xiàn);按照簡約思維,用戶界面設計要盡量外觀簡潔,操作流程簡化,提高使用效率;用極致思維去完成每一個細節(jié),功能不求多復雜,但是要簡約、好用,哪怕一個按鈕,也不能隨便敷衍了事。

2.5 工程實踐

首先,將實踐課的上課時間由原來每2周1次、每次2課時調整為集中1周全天實訓,便于學生集中精力專注于項目開發(fā)。

其次,引入企業(yè)講師,與校內教師聯(lián)合指導項目開發(fā),同時引入企業(yè)真實項目案例作為實訓任務:一方面,讓學生了解、補充課外的行業(yè)一線技術知識,體驗企業(yè)項目開發(fā)流程,加深職業(yè)認知,為以后的就業(yè)做好準備;另一方面,也能讓校內教師及時有效地和企業(yè)工程師進行學習交流、掌握當前社會需求,努力做到不與行業(yè)脫節(jié)。

第三,基于OBE教學理念,目標是培養(yǎng)具有分析問題解決問題能力的應用型人才,實踐環(huán)節(jié)無疑是培養(yǎng)學生全面解決復雜工程問題能力最好的環(huán)節(jié)。過去,項目實踐基本是由教師對整個Web項目進行分析、設計,然后進行某一功能模塊的具體操作演示,接下來學生依葫蘆畫瓢完成剩下的部分,雖然最后能夠完成任務,但是學生缺乏對項目整體的分析、設計的鍛煉,只能進行執(zhí)行層面能力的鍛煉。

不同于過去的模仿式執(zhí)行任務,現(xiàn)在在任務驅動的項目化教學下,更多的是給學生布置任務,讓學生自己去分析要完成任務必須解決哪些問題,然后進行模塊設計,最后具體實施。在整個過程中遇到問題、困難的時候求助于老師。學生最后提交的成果不僅僅有自己的Web項目,更要包含開始的需求分析文檔和最后的實踐總結報告。這樣的實踐方式,不僅能夠提升學生動手做的能力,更能夠鍛煉學生的整體設計、解決問題的能力。

2.6 考核方式

鑒于Web前端開發(fā)較強的實踐性,逐漸降低筆試成績的比例,以實踐考核成績?yōu)橹鳌?/p>

考核內容主要是學生的Web項目成果演示和答辯,由實際展示效果和問答情況檢測學生對Web前端開發(fā)技能的掌握情況。如前文所述,基于OBE教學理念,能夠分析問題、設計方案、解決問題的綜合應用解決能力的培養(yǎng)是目標。因此,除了考核學生做的成果,需求分析、實踐報告也是考核的部分,以此檢測學生的整體解決問題的能力。

考核方式不再是期末一錘定音,而是進行迭代式、階段性考核,根據(jù)教學進展,在一個學期不同階段設置4～5個考核點,每次考核通過一個功能性任務檢測學生掌握情況。幾次考核任務的選擇上,具有關聯(lián)性和連貫性,經(jīng)過幾次階段性考核任務的完成,學生基本上也是完成了一個Web項目。這樣的考核方式,一方面更加合理,另一方面也能給督促學生注重平時的鍛煉和學習,避免期末抱佛腳突擊復習過關的僥幸心態(tài)。

3 結 語

與職業(yè)標準銜接,培養(yǎng)獨立解決問題的能力是Web前端開發(fā)課程改革的目標,從思維認知、教學內容、教學方式、工程實踐和考核方式等多方面進行了探索和實踐。

Web前端課程的教學不僅僅是某些語言、工具的使用,更重要的是思維,是解決問題能力的鍛煉和提升。不僅要求教師注重自身知識儲備、技能的更新,還要求教師自身對課程體系有比較清晰的認識,加強學生對行業(yè)的認識、職業(yè)認知的引導,同時在教學過程中,不拘泥于現(xiàn)有資源,積極引入其他有效教學資源,如網(wǎng)絡在線課程,企業(yè)技術人員等,只要有利于學生學習知識,掌握技能,提高解決問題的能力,都可以合理利用。

結合社會職業(yè)需求,解決復雜問題能力的培養(yǎng),還處于探索和初步實踐階段,還需要更多的嘗試、努力和實踐,筆者接下來會繼續(xù)從教師和學生以及社會多方面進行繼續(xù)探索和實踐,也期望看到更加有效和實際的改善。