web前端技术应用 教案 项目一 任务一 认识web前端开发

《Web前端技术应用》教学设计项目一任务一认识WEB前端开发课题认识web前端开发课程名称Web前端技术应用授课班级学时安排1学时执教老师授课形式理实一体教学目标知识1．能描述web前端开发的概念及作用；2．能选择合适的开发工具进行项目开发；3.能明确web前端开发工程师的工作需求；技能能熟练使用开发工具进行web前端开发工作；素养1．通过对各种开发工具的选择，提升自主选择能力；2．养成细致缜密的编程习惯；课程思政通过立足岗位的要求，养成精益求精理论联系实践的务实精神。教学重点Web前端开发所需的技能教学难点Web前端开发所需的技能教学方法分析法、讨论法、演示法、引导式教学。教学环境软件环境：Win7及以上操作系统，HBuilder硬件环境：多媒体教室或软件实训室，计算机教学资源：PPT、微课视频教学过程教学环节教师活动学生活动设计意图新课导入(3分钟)提问：你了解的web前端开发是能做什么的一门课程呢？学生根据自身阅历阐述web前端这门课的相关内容。思考问题，根据自身情况汇总回答问题教学

过渡提升学生表达能力目标展示(2分钟)PPT展示本课题要完成的目标并适当解说观看了解活动1认识响应式网页设计的技术(15分钟)1.web前端开发的知识点学生自主阅读书上相关内容，再次描述什么是web前端开发？学生阅读教材找出web前端开发所涉及到的相关知识点。学生提问：有哪些概念是你不理解的？提问老师或者同学协助回答。Web前端开发是创建Web页面或app等前端界面呈现给用户的过程，通过html、CSS和javascript以及衍生出来的各种技术、框架和解决方案来实现互联网产品的用户界面交互。WEB前端开发主要指网站开发、优化和完善等。2.一名前端开发工程师的需求教师：可以去51job上面去查询一下，web前端开发工程师的招聘条件；教师：通过查询可以发现，web前端开发的css,html,javascript是必须条件，同时还涉及到vue,react等前端开发框架的一个要求，所以在课程的学习中，我们要从这几个基础方面着手。同时，书上的是工作中对一个web前端开发工程师的基础素养和技能要求，也要掌握。观看阅读书上相关知识点Web前端开发的相关内容明确岗位需求，提升学习兴趣。达成教学目标活动2掌握常见的Web前端开发工具（20分钟）阅读书上内容，完成书上任务实施的表。sublimetext下载网址/index2特征：有一个丰富的扩展功能的vim，可实现拼写检查，书签，完整的PythonAPI，Goto功能，还可实现即时项目切换、多选择、多窗口等；Webstorm支持多语言和框架、代码补全、导航、代码质量分析的功能，同时还具有调试、跟踪和测试等功能Hbuilder下载网址https://www.dcloud.io/hbuilderx.html?ivk_sa=1024320u特征：具有代码输入法创新、代码块优化、Emmet集成、快捷键、语法设计、无鼠标操作等便捷应用其他开发工具学生掌握各种开发工具的特点展示评价（3分钟）按生生互评、教师点评的方式评价学生完成的作业情况。完成练习计算正确率回忆

巩固课堂小结(