web开发技术教案.docx
《web开发技术教案.docx》由会员分享，可在线阅读，更多相关《web开发技术教案.docx（128页珍藏版）》请在冰豆网上搜索。
web开发技术教案
广东科学技术职业学院
教案
学院（系、部）
计算机工程技术学院
课程名称
Web开发技术
授课班级
16Oracle1班
主讲教师
职称
讲师
使用教材
广东科学技术职业学院教务处制
二○○六年九月
教案（首页）
课程名称
Web开发技术
课程编号
010501200
总计：
72学时
学分
4学分
讲课：
36学时
实验：
36学时
类别
必修课（√）选修课（）理论课（）实验课（）
任课教师
职称
讲师
授课对象
专业班级：
16级Oracle1班共1个班
教材
参考资料
1、JSP程序设计实例教程）2014年
2、JSP程序设计案例教程2013年
教学方法教学手段
教学方法：
课堂讲授，案例教学。
教学手段：
多媒体教学，学生实际操作、兴趣分组。
考核方式
考核方式：
期末闭卷考试，学生实验成绩。
公式：
平时:
:
期末考试=40%:
60%
学生创新精神与实践能力的培养方法
1、通过讲授网上电子商城相关功能，现实需求，培养学生程序设计的兴趣；
2、通过设计逐步加深的实验题目及实验操作培养，培养学生的基本操作技能及实验的兴趣；
3、通过设计的培养来培养学生的创新精神。
4、通过需求分析，帮助学生分析、理解需求；以及对学生进行分组团队开发，培养学生的动手能力；通过学期末学生项目汇报和演示，提高学生的项目表达能力。
《web开发技术》课程教学单元设计
模块名称：
模块1JSP语言基础模块
授课教师：
授课班级：
单元总学时：
28
教学条件
Eclipse、JDK、Tomcat服务器、一体化教室、多媒体演示软件
教学素材
参考书、课件、视频
教学目标设计
知识目标：
（1）理解eBuy电子商城的基本设计思想
（2）了解Web基础知识
（3）掌握JSP开发环境的搭建
（4）掌握JSP指令元素与动作元素的使用
（5）掌握JSP内置对象的使用
能力目标：
（1）理解eBuy电子商城的基本设计思想
（2）能区分解静态网页与动态网页的不同
（3）能搭建JSP开发环境及使用开发工具
（4）能制作简单JSP页面及实现相关功能
（5）能设计用户登录页面及能模拟实现用户登录功能
（6）能设计网站计数器
教学内容
教学单元1：
eBuy电子商务系统的使用
教学单元2：
Web技术概述
教学单元3：
搭建JSP开发环境
教学单元4：
JSP指令元素和动作元素
教学单元5：
Request和Response-Session对象
教学单元6：
Application对象Cookie对象
教学单元7：
单元实践1
重点：
JSP开发环境的搭建、JSP指令元素与动作元素的使用及JSP内置对象的使用
难点：
JSP指令元素与动作元素的使用及JSP内置对象的使用
课外拓展
（1）如果您所在城市的新华书店需要建立一个名为eBook的网站来实现网上售书，请您根据新华书店图书销售情况从操作系统、Web服务器、数据库管理系统角度考虑，确定开发该网站的方案？
并请说明理由。
（2）比较两种开发工具的优劣
（3）尝试单独对开发环境进行配置
教学过程设计
教学单元1：
eBuy电子商务系统的使用（学时数：
4）
主要
步骤
教学内容
教学方法
教学手段
师生活动
新课
引入
演示eBuy电子商城系统的使用，进而分析该系统的实现方法
演示
提问
多媒体
教师：
讲解演示
学生：
观察思考
任务
分析
实践任务分析
（1）参阅本书中脚本后用SQLServer2000创建eBuy电子商城的数据库和数据表，并往表中添加相应的记录。
（2）参阅系统使用说明，配置好eBuy系统，并运行该系统，查看该系统实现的主要功能。
讲授
多媒体
课件演示
教师：
讲解演示
学生：
观察思考
理论目标分析
（1）分析知识目标
（2）分析技能目标
讲授
多媒体
课件演示
教师：
讲解演示
学生：
观察思考
知识
讲解
——
系统需求分析等
课堂演示
（1）演示系统配置方法
（2）演示eBuy电子商城系统的使用
演示
讲授
多媒体
系统演示
教师：
讲解演示
学生：
观察思考
知识分析
（1）系统概述
●前台购物系统
●后台管理系统
●系统用例图
（2）系统功能模块设计
●注册模块
●登录模块
●商品展示
●商品详情
●购物车
●订单处理
●客户反馈
●后台管理
（3）系统流程分析
讲授
多媒体
课件演示
教师：
讲解演示
学生：
观察思考
交流互动
分组讨论
记录笔记
学生模仿
（1）进入“北京图书大厦网上书店”（
（2）试着搜索书名为“《Java程序设计案例教程》”的图书，并查看该图书的详细信息。
试着搜索作者名为“刘志成”的图书信息，查看该编者编写的图书信息，并进行购买。
（3）分小组讨论北京图书大厦网站的后台管理应包括哪些功能。
（4）教师结合eBuy电子商城系统，对学生模仿过程中的相关操作进行重点评析，加深印象，强化记忆。
实践
练习
模仿练习
教师：
巡视指导
学生：
实践操作
查阅资料
知识
讲解
——
数据库设计及详细设计等
课堂演示
演示eBuy电子商城系统中对数据的操作方法
演示
讲授
多媒体
教师：
讲解演示
学生：
观察思考
知识分析
（1）数据库设计
●相关表的结构介绍
●创建数据库和表的SQL语句
（2）详细设计
●开发文件夹
●页面关系图
（3）系统使用说明
●系统配置
●源程序使用方法
讲授
多媒体
课件演示
教师：
讲解演示
学生：
观察思考
交流互动
分组讨论
记录笔记
学生模仿
参照书中的系统使用说明，进行系统配置和源程序使用配置
实践
练习
模仿练习
教师：
巡视指导
学生：
实践操作
查阅资料
课堂
实践
实践目标分析
（1）各小组选择一台服务器，参考所提供的资源，创建eBuy电子商城的数据库和数据表。
（2）往表中添加数据。
（3）参阅系统使用说明，配置好eBuy系统。
（4）小组成员通过访问小组内的服务器，运行eBuy系统，查看该系统实现的主要功能。
演示
讲授
多媒体
系统开发环境
课程资源
教师：
讲解演示
学生：
观察思考
学生实践
（1）由一名学生在教师机上完成实践任务
（2）其它学生在学生机上完成实践任务
（3）实践目标完成后由学生分组对实践目标进行点评
实践
练习
课堂实践任务单
教师：
巡视指导
学生：
实践操作
查阅资料
教师
点评
教师指出学生实践过程中可能出错和已经出错的知识点，对学生点评不完善的地方进行补充评析，对普遍存在的问题进行重点评析，加深印象，强化记忆。
点评
教师点评
教师：
点评
学生：
整理笔记
课堂
小结
（1）理解eBuy电子商城的基本设计思想
（2）系统数据库设计
（3）系统使用说明
归纳
总结
教师讲授
教师：
总结
学生：
思考总结
课外
拓展
（1）记录一次到超市购物的过程，体会购物车的作用；查看超市提供的购物清单，结合数据库的知识，理解订单和订单详情之间的关系。
（2）选择一个购物网站，完成从注册到购物的流程，体验网上购物的基本过程，并体会每一过程涉及的数据库操作。
（3）根据您对所在城市的新华书店的业务处理流程的了解和分析，参照eBuy电子商城，设计出eBook网站的数据库（BookData）。
教师：
布置作业
提出要求
学生：
拓展实训
教学过程设计
教学单元2：
Web技术概述（学时数：
4）
主要
步骤
教学内容
教学方法
教学手段
师生活动
新课
引入
从我们平常对网页的浏览，导出对静态网页和动态网页的认识，导出对网页制作技术的分析，从而导出JSP动态网页开发技术。
演示
提问
多媒体
教师：
讲解演示
学生：
观察思考
任务
分析
实践任务分析
（1）打开浏览器，在地址栏中输入
（2）打开浏览器，在地址栏中输入
（3）分别使用本地迅雷和Web迅雷下载文件，体验C/S模式和B/S模式的不同。
讲授
多媒体
课件演示
教师：
讲解演示
学生：
观察思考
理论目标分析
（1）分析知识目标
（2）分析技能目标
讲授
多媒体
课件演示
教师：
讲解演示
学生：
观察思考
知识
讲解
——
WEB技术概述
课堂演示
进入中国程序员网站的主页，选择【免费注册】链接，进入注册页面，查看地址栏和网页内容，体验网站中静态网页和动态网页的结合。
演示
讲授
多媒体
系统演示
教师：
讲解演示
学生：
观察思考
知识分析
（1）静态网页与动态网页比较
（2）WEB服务器和网络数据库
（3）JSP与其它动态网页制作语言的比较
讲授
多媒体
课件演示
教师：
讲解演示
学生：
观察思考
交流互动
分组讨论
记录笔记
学生模仿
学生进入中国程序员网站，体验网站中静态网页和动态网页的不同
实践
练习
模仿练习
教师：
巡视指导
学生：
实践操作
查阅资料
知识
讲解
——
C/S结构与B/S结构
课堂演示
进入免费邮箱服务器（如Express从本地计算机实现邮件的发送（Foxmail或OutlookExpress的配置请参阅相关资料），比较两种发送邮件的方式的不同。
演示
讲授
多媒体
教师：
讲解演示
学生：
观察思考
知识分析
（1）C/S结构概述
（2）B/S结构
（3）C/S结构与B/S结构的比较
讲授
多媒体
课件演示
教师：
讲解演示
学生：
观察思考
交流互动
分组讨论
记录笔记
学生模仿
学生进入免费邮箱服务器（如Express从本地计算机实现邮件的发送（Foxmail或OutlookExpress的配置请参阅相关资料），比较两种发送邮件的方式的不同。
实践
练习
模仿练习
教师：
巡视指导
学生：
实践操作
查阅资料
课堂
实践
实践目标分析
（1）各小组选择一名组员的机器充当服务器，安装教学软件“极域多媒体教学系统”教师机程序，其它组员安装“极域多媒体教学系统”学生机程序，记录安装和使用中的问题，体验C/S程序的特点。
（2）使用普通QQ和WebQQ或（本地迅雷和Web迅雷下载文件），体验C/S模式和B/S模式的异同。
（3）如果学院图书馆拟开发一套图书管理系统，根据你对C/S架构和B/S架构的了解，请对该系统的架构提出一个解决方案。
演示
讲授
多媒体
系统开发环境
课程资源
教师：
讲解演示
学生：
观察思考
学生实践
（1）由一名学生在教师机上完成实践任务
（2）其它学生在学生机上完成实践任务
实践
练习
课堂实践任务单
教师：
巡视指导
学生：
实践操作
查阅资料
教师
点评
教师指出学生实践过程中可能出错和已经出错的知识点，对学生点评不完善的地方进行补充评析，对普遍存在的问题进行重点评析，加深印象，强化记忆。
点评
教师点评
教师：
点评
学生：
整理笔记
课堂
小结
（1）静态网页与动态网页的区别
（2）C/S模式与B/S的特点
归纳
总结
教师讲授
教师：
总结
学生：
思考总结
课外
拓展
如果您所在城市的新华书店需要建立一个名为eBook的网站来实现网上售书，请您根据新华书店图书销售情况从操作系统、Web服务器、数据库管理系统角度考虑，确定开发该网站的方案？
并请说明理由。
教师：
布置作业
提出要求
学生：
拓展实训
教学过程设计
教学单元3JSP开发环境配置（学时数：
4）
主要
步骤
教学内容
教学方法
教学手段
师生活动
新课
引入
运行一个最简单的JSP程序，导出JSP的安装方法、配置方法、编辑工具等知识。
演示
提问
多媒体
教师：
讲解演示
学生：
观察思考
任务
分析
实践任务分析
（1）根据本书中提供的下载地址，下载JDK1.6（或JDK1.7），并进行安装和配置。
（2）根据本书中提供的下载地址，下载Tomcat6.0（或Tomcat7.0）安装后，熟悉Tomcat服务器的启动、停止和退出操作。
（3）在Tomcat服务器下建立自己的WEB应用程序目录myweb，并按要求建立和配置好web.xml文件。
（4）使用JCreator、记事本或Dreamweaver编写一个简单的显示“WelcometoJSP”的JSP程序（welcome.jsp），在浏览器中运行该程序，体验JSP程序的编写和运行方法。
讲授
多媒体
课件演示
教师：
讲解演示
学生：
观察思考
理论目标分析
（1）分析知识目标
（2）分析技能目标
讲授
多媒体
课件演示
教师：
讲解演示
学生：
观察思考
知识
讲解
——
JDK的安装
课堂演示-
JDK1.6的安装和配置。
演示
讲授
多媒体
系统演示
教师：
讲解演示
学生：
观察思考
知识分析
JDK的运行环境
讲授
多媒体
课件演示
教师：
讲解演示
学生：
观察思考
交流互动
分组讨论
记录笔记
学生模仿
（1）学生模仿完成JDK的安装工作
（2）教师指出学生安装过程中可能出错和已经出错的知识点，并进行重点评析，加深印象，强化记忆。
实践
练习
模仿练习
教师：
巡视指导
学生：
实践操作
查阅资料
知识
讲解
——
Tomcat的安装与配置
课堂演示
演示Tomcat6.0的安装与配置，熟悉Tomcat服务器的启动、停止和退出操作。
演示
讲授
多媒体
教师：
讲解演示
学生：
观察思考
知识分析
（1）下载Tomcat；
（2）安装与配置Tomcat；
（3）启动与停止Tomcat；
（4）测试Tomcat
讲授
多媒体
课件演示
教师：
讲解演示
学生：
观察思考
交流互动
分组讨论
记录笔记
学生模仿
（1）学生模仿完成Tomcat的安装与配置
（2）教师指出学生模仿过程中可能出错和已经出错的知识点，并进行重点评析，加深印象，强化记忆。
实践
练习
模仿练习
教师：
巡视指导
学生：
实践操作
查阅资料
知识
讲解
——
JSP开发工具
课堂演示
（1）演示JCreator的使用方法
（2）创建第一个JSP程序
演示
讲授
多媒体
教师：
讲解演示
学生：
观察思考
知识讲解
（1）Jcreator；Eclipse；
（2）Dreamweaver；
（3）创建第一个JSP程序
讲授
多媒体
课件演示
教师：
讲解演示
学生：
观察思考
交流互动
分组讨论
记录笔记
学生模仿
（1）学生熟悉各开发工具的使用
（2）教师指出学生模仿过程中可能出错和已经出错的知识点，并进行重点评析，加深印象，强化记忆。
实践
练习
模仿练习
教师：
巡视指导
学生：
实践操作
查阅资料
课堂
实践
实践目标分析
（1）根据本书中提供的下载地址，下载JDK1.6（或JDK1.7），并进行安装和配置。
（2）根据本书中提供的下载地址，下载Tomcat6.0（或Tomcat7.0）安装后，熟悉Tomcat服务器的启动、停止和退出操作。
（3）在Tomcat服务器下建立自己的WEB应用程序目录myweb，并按要求建立和配置好web.xml文件。
（4）使用JCreator、记事本或Dreamweaver编写一个简单的显示“WelcometoJSP”的JSP程序（welcome.jsp），在浏览器中运行该程序，体验JSP程序的编写和运行方法。
演示
讲授
多媒体
系统开发环境
课程资源
教师：
讲解演示
学生：
观察思考
学生实践
（1）由一名学生在教师机上完成实践任务
（2）其它学生在学生机上完成实践任务
（3）程序设计完成后由学生分组对程序进行点评
实践
练习
课堂实践任务单
教师：
巡视指导
学生：
实践操作
查阅资料
教师
点评
教师指出学生实践过程中可能出错和已经出错的知识点，对学生点评不完善的地方进行补充评析，对普遍存在的问题进行重点评析，加深印象，强化记忆。
点评
教师点评
教师：
点评
学生：
整理笔记
课堂
小结
（1）JDK1.6的安装和配置
（2）Tomcat6.0的安装、启动、停止和退出操作，环境的配置
归纳
总结
教师讲授
教师：
总结
学生：
思考总结
课外
拓展
（1）比较向种开发工具的优劣
（2）尝试单独对开发环境进行配置
教师：
布置作业
提出要求
学生：
拓展实训
教学过程设计
教学单元4JSP指令元素和动作元素（学时数：
4）
主要
步骤
教学内容
教学方法
教学手段
师生活动
新课
引入
我们在前面的学习中，经常会遇到JSP程序中的中文显示是乱码的现象，这个问题将怎么解决？
（举例演示，让学生观察。
）
演示
提问
多媒体
教师：
讲解演示
学生：
观察思考
任务
分析
实践任务分析
（1）设计Easy_Buy电子商城网站的首页（index.jsp）框架，要求可以使用中文显示。
首页由三大部分组成：
top.jsp（导航栏）、body.jsp（页面主体）和bottom.jsp（版权信息）。
（2）在Easy_Buy电子商城的首页（index.jsp）中使用设置一个超级链接，使用jsp:
forward转向到时钟页面（clock.jsp），要求在clock.jsp页面中插入一个显示当前时钟的JavaApplet程序。
讲授
多媒体
课件演示
教师：
讲解演示
学生：
观察思考
理论目标分析
（1）分析知识目标
（2）分析技能目标
讲授
多媒体
课件演示
教师：
讲解演示
学生：
观察思考
知识
讲解
——
注释
课堂演示
演示在JSP文件中分别使用输出注释和隐藏注释的方法（课堂演示4.1）
演示
讲授
多媒体
系统演示
教师：
讲解演示
学生：
观察思考
知识分析
（1）输出注释的语法格式
（2）隐藏注释的语法格式
（3）输出注释与隐藏注释比较（区别及各自适应场合等）
讲授
多媒体
课件演示
教师：
讲解演示
学生：
观察思考
交流互动
分组讨论
记录笔记
学生模仿
（1）学生模仿完成课堂演示4.1中的内容
（2）教师指出学生模仿过程中可能出错和已经出错的知识点，并进行重点评析，加深印象，强化记忆。
实践
练习
模仿练习
教师：
巡视指导
学生：
实践操作
查阅资料
知识
讲解
——
声明
课堂演示
演示声明在JSP程序中的运用（课堂演示4.2）
演示
讲授
多媒体
教师：
讲解演示
学生：
观察思考
知识分析
（1）声明的概念
（2）声明的语法格式
（3）多个页面中要用到相同声明的解决方法
讲授
多媒体
课件演示
教师：
讲解演示
学生：
观察思考
交流互动
分组讨论
记录笔记
学生模仿
（1）学生模仿完成课堂演示4.2中的内容
（2）教师指出学生模仿过程中可能出错和已经出错的知识点，并进行重点评析，加深印象，强化记忆。
实践
练习
模仿练习
教师：
巡视指导
学生：
实践操作
查阅资料
知识
讲解
——
表达式
课堂演示
演示表达式在JSP程序中的运用（课堂演示4.3）
演示
讲授
多媒体
教师：
讲解演示
学生：
观察思考
知识分析
（1）表达式的概念
（2）表达式的语法格式（注意：
表达式的返回值和运算顺序）
讲授
多媒体
课件演示
教师：
讲解演示
学生：
观察思考
交流互动
分组讨论
记录笔记
学生模仿
（1）学生模仿完成课堂演示4.3中的内容
（2）教师指出学生模仿过程中可能出错和已经出错的知识点，并进行重点评析，加深印象，强化记忆。
实践
练习
模仿练习
教师：
巡视指导
学生：
实践操作
查阅资料
知识
讲解
——
脚本程序
课堂演示
演示脚本元素在JSP程序中的运用（课堂演示4.4）
演示
讲授
多媒体
教师：
讲解演示
学生：
观察思考
知识分析
（1）脚本程序的概念
（2）脚本程序的语法格式
（3）脚本程序中可以完成的功能
讲授
多媒体
课件演示
教师：
讲解演示
学生：
观察思考
交流互动
分组讨论
记录笔记
学生模仿
（1）学生模仿完成课堂演示4.4中的内容
（2）教师指出学生模仿过程中可能出错和已经出错的知识点，并进行重点评析，加深印象，强化记忆。
实践
练习
模仿练习
教师：
巡视指导
学生：
实践操作
查阅资料
知识
讲解
——
Page指令和Include指令
课堂演示
演示在JSP文件中使用Page指令和Include指令的方法。
（课堂演示4.5）
演示
讲授
多媒体
教师：
讲解演示
学生：
观察思考
知识分析
（1）Page指令
●Page指令的语法格式
●Page指令的属性（以表格形式列出）
●注意：
如果没有使用Page指令设置“charset”为“GB2312”，JSP程序中的中文显示将会是乱码；page指令中只有import属性可以重复设置。
（2）Include指令
●Include指令的语法格式
●注意：
在被包含的文件中最好不要使用、、
、等标签；在包含文件时避免在被包含的文件中定义了同名的变量和方法。
讲授
多媒体
课件演示
教师：
讲解演示
学生：
观察思考
交流互动
分组讨论
记录笔记
学生模仿
（1）学生模仿完成课堂演示4.5中的内容
（2）教师指出学生模仿过程中可能出错和已经出错的知识点，并进行重点评析，加深印象，强化记忆。
实践
练习
模仿练习
教师：
巡视指导
学生：
实践操作
查阅资料
知识
讲解
——
include动作
课堂演示
在JSP文件中使用jsp:
include动作（课堂演示4.6）
演示
讲授
多媒体
教师：
讲解演示
学生：
观察思考
知识分析
（1）Include动作元素的概念
（2）Include动作的语法格式
（3
升级会员 