XXX學院《Web前端基礎(chǔ)技術(shù)》課程教學大綱一、課程基本信息課程名稱Web前端基礎(chǔ)技術(shù)WebFront-EndBasicTechnology課程代碼適用專業(yè)/開課學期軟件工程/第學期學分/學時學分/48學時學時分配48理論學時32實驗（實踐）學時16實訓（含上機）/實習/其他/課程類別大類通識課程專業(yè)教育課程實踐教育課程公共基礎(chǔ)課大類平臺課通識通選課專業(yè)基礎(chǔ)課專業(yè)主干課專業(yè)拓展課實驗課集中實踐課√課程性質(zhì)必修()選修()考核方式考試()考查()開課院（部）信通學院課程負責人課程團隊授課語言中文對先修的要求《程序設(shè)計基礎(chǔ)》對后續(xù)的支撐《Web前端框架技術(shù)》大綱撰寫與審定撰寫人審核人審定人修訂時間課程簡介及課程目標本課程是一門軟件工程專業(yè)的專業(yè)必修課，具有較強的實踐性。通過本課程的學習，使學生系統(tǒng)性掌握HTML、CSS和JavaScript等前端開發(fā)的相關(guān)知識，并最終可以開發(fā)出具有良好交互性的前端頁面；同時在本階段培養(yǎng)學生具備獨立的Web開發(fā)能力，掌握Web開發(fā)的基本流程和方法，熟悉標記語言、樣式語言以及腳本語言的基本語法、語句，建立面向?qū)ο笏季S方式和方法，熟練使用軟件開發(fā)工具，高效完成定制任務。Thiscourseisaprofessionalessentialcourseforsoftwareengineeringmajors,whichisstrong.Throughthestudyofthiscourse,studentscansystematicallygrasptherelevantknowledgeoffront-enddevelopmentofHTML,CSS,andJavaScript,andfinallydevelopthefront-endpageswithgoodinteraction;Thebasicprocessesandmethodsofwebdevelopmentarefamiliarwiththebasicgrammarandsentencesoflabellanguage,stylelanguage,andscriptlanguage,establishobject-orientedthinkingmethodsandmethods,proficientinsoftwaredevelopmenttools,andefficientlycompletecustomizedtasks.課程目標：1.了解Web前端開發(fā)的基本概念和開發(fā)流程，掌握Web前端開發(fā)的核心內(nèi)容，包括HTML、CSS和JavaScript，能按照需求完成開發(fā)任務。2.具備綜合運用Web前端核心技術(shù)能力，能使用前端技術(shù)用于解決實際項目開發(fā)問題。三、課程目標及對畢業(yè)要求觀測點的支撐序號畢業(yè)要求支撐畢業(yè)要求觀測點課程目標11.掌握軟件生命周期中涉及的工程基礎(chǔ)和專業(yè)知識，以及相關(guān)的數(shù)學、自然科學知識，并能夠?qū)⑵鋺玫杰浖嵺`中，解決復雜軟件工程問題。2.問題分析：能應用數(shù)學、自然科學和與軟件工程相關(guān)的基本原理，識別、表達、并通過文獻研究和借助仿真軟件等手段，分析軟件系統(tǒng)及其相關(guān)領(lǐng)域的復雜工程問題，進行識別、表達和分析，以獲取有效結(jié)論。5.能夠針對軟件工程及其相關(guān)領(lǐng)域的復雜工程問題，開發(fā)、選擇與使用恰當?shù)募夹g(shù)、資源、現(xiàn)代工程工具和信息技術(shù)工具，包括對復雜工程問題的預測與模擬，并能夠理解其局限性。觀測點1.2了解軟件工程專業(yè)知識、方法和技術(shù)在該領(lǐng)域的應用背景、發(fā)展現(xiàn)狀和趨勢；能選擇恰當?shù)哪Ｐ陀糜诒硎鰪碗s軟件工程問題；且能將其應用于復雜軟件工程問題的建模和求解。觀測點2.3能夠針對具體的軟件工程領(lǐng)域復雜工程的多種可選方案，運用基本原理，借助文獻研究，分析過程的影響因素，并獲得有效結(jié)論。觀測點5.3能夠針對具體的對象，開發(fā)或選用滿足特定需求的現(xiàn)代工具，模擬和預測專業(yè)問題，并能夠分析其局限性。目標123.設(shè)計/開發(fā)解決方案：能夠針對軟件工程及其相關(guān)領(lǐng)域復雜工程問題設(shè)計提出設(shè)計方法或解決方案，并針對特定系統(tǒng)需求設(shè)計滿足用戶需求的解決方案，包括軟硬件功能設(shè)計、系統(tǒng)架構(gòu)設(shè)計、組件設(shè)計和數(shù)據(jù)庫設(shè)計等，并能夠在設(shè)計環(huán)節(jié)中體現(xiàn)創(chuàng)新意識，考慮社會、健康、安全、法律、文化以及環(huán)境等因素。4.研究：能夠基于軟件工程的基本原理并采用科學方法對復雜工程問題進行研究，包括搜集與整理資料、系統(tǒng)設(shè)計、設(shè)計實驗、分析與解釋數(shù)據(jù)、并通過信息綜合得到合理有效的結(jié)論。觀測點3.1掌握軟件工程設(shè)計和產(chǎn)品開發(fā)全周期、全流程的基本設(shè)計/開發(fā)方法和技術(shù)，了解影響設(shè)計目標和技術(shù)方案的各種因素；掌握軟件需求分析、設(shè)計、實現(xiàn)、測試、維護以及過程與管理的方法和技術(shù)。觀測點4.1能夠基于科學原理，通過文獻研究或相關(guān)方法，調(diào)研和分析復雜軟件工程問題的解決方案。目標2

四、教學內(nèi)容及進度安排序號教學內(nèi)容（包含重點、難點和思政點）課程目標達成途徑（應寫清楚運用何種教學模式實現(xiàn)）課內(nèi)學時支撐課程目標理論實踐1內(nèi)容：Web開發(fā)前端綜述與HTML基礎(chǔ)了解相關(guān)的Web前端開發(fā)技術(shù)；Web頁面執(zhí)行流程；開發(fā)工具介紹；第1個HTML文檔；文檔結(jié)構(gòu)分析；文檔編寫規(guī)范重點：HTML文檔結(jié)構(gòu)難點：理解Web執(zhí)行流程思政點：分析Web開發(fā)的技術(shù)棧，明確學習目標和職業(yè)規(guī)劃。通過課堂講授，使學生：1）了解Web前端開發(fā)技術(shù)2）靜態(tài)和動態(tài)頁面執(zhí)行流程3）熟悉HTML基本語法，創(chuàng)建HTML頁面20目標12內(nèi)容：HTML基礎(chǔ)格式化文本標記；段落與排版標記；分行、水平線標記；超鏈接和圖像；列表和表格、表單重點：HTML標記的含義和使用。難點：使用HTML實現(xiàn)排版思政點：以“J20”研發(fā)為例，引出對技術(shù)基礎(chǔ)積累的重要性。通過課堂講授，使學生：1）掌握字體標記和屬性2）掌握段落標記和屬性3）區(qū)分段落和換行4）超鏈接與圖片使用5）掌握列表布局、表格定位與表單元素作用通過作業(yè)練習，使學生：創(chuàng)建HTML文檔及實現(xiàn)基本排版樣式；掌握創(chuàng)建使用列表和表單實現(xiàn)排版的頁面；掌握表單制作，熟悉各類表單元素的標記84目標13內(nèi)容：CSS基礎(chǔ)CSS選擇器；CSS語法；盒子模型；div和span標記；CSS樣式屬性；單位、字體、顏色和列表樣式重點：選擇器；格式化文本樣式難點：盒子模型思政點：以HTML不足而引入CSS為例，培養(yǎng)創(chuàng)新精神。通過課堂講授，使學生：1）掌握5種選擇器的使用2）使用CSS進行格式化對象通過作業(yè)練習，使學生：創(chuàng)建基于CSS排版的的HTML頁面42目標14內(nèi)容：CSS布局與CSS3頁面布局的方法；導航列表菜單設(shè)計；CSS3新特性。重點：頁面布局；導航列表菜單設(shè)計；轉(zhuǎn)換和過渡；難點：頁面布局；導航列表菜單設(shè)計思政點：以CSS炫酷網(wǎng)站為例，弘揚“大國工匠“精神。通過課堂講授，使學生：1）掌握三列橫線和縱向布局的設(shè)計方法2）掌握水平和垂直導航列表菜單的設(shè)計方法通過作業(yè)練習，使學生：創(chuàng)建基于CSS的頁面布局的頁面，并能添加導航菜單84目標15內(nèi)容：JavaScript基礎(chǔ)JavaScript基礎(chǔ)語法；變量、表達式、函數(shù)、程序結(jié)構(gòu)重點：基本語法難點：函數(shù)定義與使用思政點：以語法規(guī)則為例，做個遵紀守法的好公民。課堂講授，使學生：掌握JavaScript基礎(chǔ)語法通過作業(yè)練習，使學生：使用JavaScript基礎(chǔ)語法解決一般數(shù)學問題22目標16內(nèi)容：JavaScript應用事件分類、響應與處理；HTML元素查詢、添加、移除、修改；動態(tài)改變樣式重點：事件響應編程難點：事件響應編程思政點：以華為5G技術(shù)為例，引出“掌握核心技術(shù)，掌控未來“的理念。通過課堂講授，使學生：1）掌握常用事件的捕獲與響應2）掌握查詢元素的各種方法3）熟悉元素的編輯操作及動態(tài)樣式的實現(xiàn)通過作業(yè)練習，使學生：結(jié)合CSS，能夠制作包含輪播圖、進度條的HTML頁面42目標17內(nèi)容：JavaScript綜合運用DOM與BOM；數(shù)據(jù)存儲WebStorage的使用；購物車實現(xiàn)。重點：基于DOM節(jié)點的操作難點：數(shù)據(jù)儲存和獲取思政點：三者融合，弘揚協(xié)作精神。通過課堂講授，使學生：1）理解DOM和BOM概念2）掌握基于DOM操作的方法3）頁面數(shù)據(jù)傳遞的方法42目標1，目標2

課程考核及評價序號課程目標考核內(nèi)容評價方式及成績比例(%)成績比例(%)平時成績（體現(xiàn)過程性考核）30%-60%期末考核平時考勤課堂實驗課堂互動...1了解Web前端開發(fā)的基本概念和開發(fā)流程，掌握Web前端開發(fā)的核心內(nèi)容，包括HTML、CSS和JavaScript，能按照需求完成開發(fā)任務。（支撐畢業(yè)要求觀測點1.2；2.3；5.3）掌握HTML基本標記使用，包括文字、段落格式化、圖片、表格和表單等元素；掌握使用CSS進行文本、段落格式設(shè)置、界面布局；掌握使用JavaScript基本語法、元素查詢和屬性設(shè)置并能設(shè)計出具有簡單交互頁面的頁面。316160802具備綜合運用Web前端核心技術(shù)能力，能使用前端技術(shù)用于解決實際項目開發(fā)問題。（支撐畢業(yè)要求觀測點3.1；4.1）能綜合運用前端技術(shù)解決實際項目開發(fā)問題。3611020比例3070100課程目標達成度計算方法：1.課程分目標達成度=課程分目標下各評價方式：“學生實際平均成績*權(quán)重之和”/“分目標分值*權(quán)重之和”。2.整體課程目標達成度：各課程分目標達成度的最小值。六、教材及參考資料1.教材《Web前端開發(fā)基礎(chǔ)（HTML+CSS+JavaScript）》鮑小忠著中國鐵道出版社2021.062.主要參考書《Web前端開發(fā)技術(shù)-HTML5、CSS3、JavaScript(第3版)》儲久良編著清華大學出版社2018.7七、課程考核評分標準課程目標平時考勤評分標準權(quán)重（%）90-10080-8970-7960-690-59優(yōu)秀良好中等及格不及格目標1課堂考勤：全勤，不遲到，不早退。課堂考勤：正常全勤，1次請假，無早退或遲到。課堂考勤：正常全勤，1次請假或有早退或遲到現(xiàn)象。課堂考勤：多次請假、早退或遲到現(xiàn)象。課堂缺勤超過3次，或多次有早退或遲到現(xiàn)象。3目標2課堂考勤：全勤，不遲到，不早退。課堂考勤：正常全勤，1次請假，無早退或遲到。課堂考勤：正常全勤，1次請假或有早退或遲到現(xiàn)象。課堂考勤：多次請假、早退或遲到現(xiàn)象。課堂缺勤超過3次，或多次早退或遲到現(xiàn)象。3課程目標實驗報告評分標準權(quán)重（%）90-10080-8970-7960-690-59優(yōu)秀良好中等及格不及格目標1課程實驗能在規(guī)定時間完成，實驗結(jié)果完全滿足要求；無抄襲；實驗報告撰寫認真、格式良好。課程實驗能在規(guī)定時間完成，結(jié)果很好滿足要求；無抄襲；提交報告格式較好。課程實驗能在規(guī)定時間完成，結(jié)果較好滿足要求；提交報告格式較好。課程實驗不能在規(guī)定時間完成，質(zhì)量一般。不提交實驗報告或抄襲他人實驗報告。16目標2課程實驗能在規(guī)定時間完成，實驗結(jié)果完全滿足要求；無抄襲；實驗報告撰寫認真、格式良好。課程實驗能在規(guī)定時間完成，結(jié)果很好滿足要求；無抄襲；提交報告格式較好。課程實驗能在規(guī)定時間完成，結(jié)果較好滿足要求；提交報告格式較好。課程實驗不能在規(guī)定時間完成，或質(zhì)量一般。不提交實驗報告或抄襲他人實驗報告。6

課程目標課堂互動評分標準權(quán)重（%）90-10080-8970-7960-690-59優(yōu)秀良好中等及格不及格目標1非常積極參與課堂互動、并能準確回答老師在課堂提出的問題。能積極參與課堂互動；較為準確回到老師在課堂提出的問題。不怎么參與課堂互動，但回答問題正確。不參與課堂互動，回答問題需要提示才能勉強完成。不參與課堂互動，不能正確回答課堂提問。1目標2非常積極參與課堂互動、并能準確回答老師在課堂提出的問題。能積極參與課堂互動；較為準確回到老師在課堂提出的問題。不怎么參與課堂互動，但回答正確。不參與課堂互動，回答問題需要提示才能勉強完成。不參與課堂互動，不能正確回答。1課程目標期末考核評分標準權(quán)重（%）90-10080-8970-7960-690-59優(yōu)秀良好中等及格不及格目標1對Web前端開發(fā)的相關(guān)概念清楚；熟悉開發(fā)工具使用和代碼調(diào)試技巧；完全掌握Web前端開發(fā)基礎(chǔ)的核心內(nèi)容。對Web前端開發(fā)的相關(guān)概念清楚；熟悉開發(fā)工具使用和代碼調(diào)試技能；很好掌握Web前端開發(fā)的核心內(nèi)容。對Web前端開發(fā)的相關(guān)概念基本清楚；對開發(fā)工具的使用和代碼調(diào)試有一定的掌握；對Web前端開發(fā)的核心內(nèi)容掌握程度一般。對Web前端開發(fā)的相關(guān)概念基本清楚；不能很好的掌握Web前端開發(fā)的核心內(nèi)容。對Web前端開發(fā)的相關(guān)概念不清楚；沒有掌握Web前端開發(fā)的核心