web前端技術應用 教案 項目一 任務一 認識web前端開發(fā)

《Web前端技術應用》教學設計項目一任務一認識WEB前端開發(fā)課題認識web前端開發(fā)課程名稱Web前端技術應用授課班級學時安排1學時執(zhí)教老師授課形式理實一體教學目標知識1．能描述web前端開發(fā)的概念及作用；2．能選擇合適的開發(fā)工具進行項目開發(fā)；3.能明確web前端開發(fā)工程師的工作需求；技能能熟練使用開發(fā)工具進行web前端開發(fā)工作；素養(yǎng)1．通過對各種開發(fā)工具的選擇，提升自主選擇能力；2．養(yǎng)成細致縝密的編程習慣；課程思政通過立足崗位的要求，養(yǎng)成精益求精理論聯(lián)系實踐的務實精神。教學重點Web前端開發(fā)所需的技能教學難點Web前端開發(fā)所需的技能教學方法分析法、討論法、演示法、引導式教學。教學環(huán)境軟件環(huán)境：Win7及以上操作系統(tǒng)，HBuilder硬件環(huán)境：多媒體教室或軟件實訓室，計算機教學資源：PPT、微課視頻教學過程教學環(huán)節(jié)教師活動學生活動設計意圖新課導入(3分鐘)提問：你了解的web前端開發(fā)是能做什么的一門課程呢？學生根據(jù)自身閱歷闡述web前端這門課的相關內容。思考問題，根據(jù)自身情況匯總回答問題教學

過渡提升學生表達能力目標展示(2分鐘)PPT展示本課題要完成的目標并適當解說觀看了解活動1認識響應式網(wǎng)頁設計的技術(15分鐘)1.web前端開發(fā)的知識點學生自主閱讀書上相關內容，再次描述什么是web前端開發(fā)？學生閱讀教材找出web前端開發(fā)所涉及到的相關知識點。學生提問：有哪些概念是你不理解的？提問老師或者同學協(xié)助回答。Web前端開發(fā)是創(chuàng)建Web頁面或app等前端界面呈現(xiàn)給用戶的過程，通過html、CSS和javascript以及衍生出來的各種技術、框架和解決方案來實現(xiàn)互聯(lián)網(wǎng)產(chǎn)品的用戶界面交互。WEB前端開發(fā)主要指網(wǎng)站開發(fā)、優(yōu)化和完善等。2.一名前端開發(fā)工程師的需求教師：可以去51job上面去查詢一下，web前端開發(fā)工程師的招聘條件；教師：通過查詢可以發(fā)現(xiàn)，web前端開發(fā)的css,html,javascript是必須條件，同時還涉及到vue,react等前端開發(fā)框架的一個要求，所以在課程的學習中，我們要從這幾個基礎方面著手。同時，書上的是工作中對一個web前端開發(fā)工程師的基礎素養(yǎng)和技能要求，也要掌握。觀看閱讀書上相關知識點Web前端開發(fā)的相關內容明確崗位需求，提升學習興趣。達成教學目標活動2掌握常見的Web前端開發(fā)工具（20分鐘）閱讀書上內容，完成書上任務實施的表。sublimetext下載網(wǎng)址/index2特征：有一個豐富的擴展功能的vim，可實現(xiàn)拼寫檢查，書簽，完整的PythonAPI，Goto功能，還可實現(xiàn)即時項目切換、多選擇、多窗口等；Webstorm支持多語言和框架、代碼補全、導航、代碼質量分析的功能，同時還具有調試、跟蹤和測試等功能Hbuilder下載網(wǎng)址https://www.dcloud.io/hbuilderx.html?ivk_sa=1024320u特征：具有代碼輸入法創(chuàng)新、代碼塊優(yōu)化、Emmet集成、快捷鍵、語法設計、無鼠標操作等便捷應用其他開發(fā)工具學生掌握各種開發(fā)工具的特點展示評價（3分鐘）按生生互評、教師點評的方式評價學生完成的作業(yè)情況。完成練習計算正確率回憶

鞏固課堂小結(