Web前端开发之网页设计 教案 单元1 Web前端开发概述.docx

Web前端开发之网页设计课程教学单元设计教学单元1Web前端开发概述授课教师：授课班级：学时：2教学条件预装Web前端开发工具HBUikier等的计算机；局域网环境；教学广播软件教学素材教材、教学文档、教学课件、案例项目库、教学平台等教学目标设计知识目标：B/S体系架构B/S架构工作原理前端后端的基本概念(4)网站与网页的基本概念(5)静态网页与动态网页的概念(6)浏览器内核工作原理(7)HBui1derX的使用能力目标：了解WEB系统的工作原理以及WEB相关基本概念；了解主流浏览器。了解前端常用技术，以及前端技术的发展前景。(3)了解前端常用开发工具，掌握HBUiIderX的下载、安装及常用快捷键。教学内容B/S体系架构B/S架构工作原理前端后端的基本概念(4)前后端开发技术栈(5)网站与网页的基本概念(6)静态网页与动态网页的概念主流浏览器简介(8)浏览器内核工作原理前端常用技术(10)前端技术发展前景(11)HBUikierX的使用重点：B/S体系架构B/S架构工作原理静态网页与动态网页的概念(4)浏览器内核工作原理前端常用技术(6)HBuiIderX的使用难点：B/S体系架构B/S架构工作原理(3)浏览器内核工作原理(4)HBui1derX的使用教学过程设计任务1-1：Web前端开发概述(2学时)主要步骤教学内容教学方法教学手段师生活动任务引入什么是Web前端开发?什么是Web全栈开发？什么是前端、后端？教师讲授启发引入多媒体教师：问题提问学生：问题讨论知识讲解(1)B/S体系架构B/S架构工作原理(3)前端后端的基本概念(4)网站与网页的基本概念(5)静态网页与动态网页的概念(6)浏览器内核工作原理(7)HBUikIerX的使用启发讲解讨论归纳多媒体课件演示教师：知识讲解学生：记录笔记师生互动交流示范操作操作1：网站内容、样式、交互的演操作2：前后端数据交互演示。问题引导操作演示分析归纳多媒体系统演示老师：操作演示学生：观摩思考老师：归纳总结实战训练实战1区分静态网页与动态网页。实战2：不同浏览器解析的差异。动手实践做中学多媒体系统操作学生：实践操作老师：巡视检查评估讨论(1)展示学生实战任务完成的效果。评估讨论实战任务完成的正确性。评估讨论实战任务完成的规范性；(4)记载学生实战认为完成的考核结果。教师启发讨论归纳分数激励实训项目单学生：演示交流老师：点评激励课堂总结前后端的技术栈区别。浏览器兼容性。教师讲解多媒体课件演示学生：整理笔记老师：引导创新课后作业11在线练习作业练习在线练习平台老师：布置作业提出要求学生：完成作业