搜索
上海应用技术大学实训课程任务书课程名称WEB开发实训课程代码B7042632设计题目常用WEB开发程序与课题题目序号1、2、3、4、设计时间2018年6月4日——2017年6月22日系（院）计算机科学与信息工程学院专业计算机科学与技术班级15104111一、课程设计任务（条件）、具体技术参数（指标）1.在指导书提供的实训题目如下：（1）Web前端编辑器（2）简易网站设计（3）JavaScript编程（4）JS网页游戏2.5-7名同学构成1个小组，每组完成4题3.最后提交的课程设计成果包括：（1）带有封面的实训报告（打印）。（2）实训报告电子稿、源程序文件。二、对实训课程成果的要求（包括实训课程说明书、图纸、图表、实物等软硬件要求）（1）要求在设计的过程中，完成清晰的功能设计；（2）要求系统架构合理，模块划分清晰；（3）对于程序设计课题，应编写程序代码，调试程序使其能正确运行；对于操作应用课题，应有清楚明确的执行步骤和过程；（4）提交实训课程报告、相关文档及源代码；三、实训课程工作进度计划：第一天分析需求，设计算法，并绘制流程图；第二天编制程序，实现课题并调试运行；第三天编制程序，实现课题并调试运行；第四天编制程序，实现课题并调试运行；第五天编制程序，实现课题并调试运行；第六天编制程序，实现课题并调试运行；第七天编制程序，实现课题并调试运行；第八天编制程序，实现课题并调试运行；第九天编制程序，实现课题并调试运行；第十天编制程序，实现课题并调试运行；第十一天编制程序，实现课题并调试运行；第十二天编制程序，实现课题并调试运行；第十三天撰写报告，准备答辩；第十四天撰写报告，准备答辩；第十五天答辩。四、主要参考资料[1]《JavaScript+jQuery程序开发实用教程》李雨亭主编，清华大学出版社，2016.1[2]《JavaWeb项目实训教程》,孙道贺、周建锋、张蕊、尉寅玮，清华大学出版社，2016.9[3]《javaWeb整合开发王者归来》,刘京华，清华大学，2010.1指导教师（签名）：舒明磊教研室主任（签名）：李晓丹2018年3月1日2018年3月1日1.实训课程目的和要求1.1目的本实训课程是计算机科学与技术专业重要的实践性环节之一，是在学生学习完《WEB程序开发》课程后进行的一次全面的综合练习。通过实训课程，使学生熟练掌握计算机网络WEB程序设计的基本概念和原理，熟悉了解WEB程序开发的基本技术和技能方法，培养学生的将专业理论知识和工程技术应用有机结合的高级应用能力。通过实训课程，加深学生对WEB程序开发课程内容以及相关技术的理解，并提高学生运用WEB编程理论解决实际问题的能力，使学生具备从事网络程序开发方向的职业的基本素质和技能，提高设计文档的撰写能力。1.2要求(1)分析实训课程题目的要求；(2)要求在设计的过程中，完成清晰的功能设计；(3)要求系统架构合理，模块划分清晰；(4)对于程序设计课题，应编写程序代码，调试程序使其能正确运行；对于操作应用课题，应有清楚明确的执行步骤和过程；(5)设计完成后提交实训课程报告（按学校要求装订）、报告的电子文档和程序源代码文件。2、实训任务内容设计主要内容如下根据任务要求，选择了web前端编辑器、简易网站设计、javascript编程、js网页游戏等题目。其中web前端编辑器要求用几款主流的web前端编辑器实现HelloWorld；简易网站设计要求完成用html语言或其它动态网页编程语言实现一个简易的网站，要求首页导航至少有五个子栏目。；javascript编程要求完成一道问答题：函数防抖动以及快速排序和冒泡排序的代码实现；js网页游戏要求完成贪吃蛇、.视频弹幕、弹球游戏、拼图游戏等。(1)最终提供的主操作界面应该为便于操作和使用，文档结构清晰简洁，内容完整准确。(2)最后提交的实训课程成果包括：a)实训课程报告打印稿；b)实训课程报告电子稿；c)源程序文件；d)可执行文件。3、详细设计3.1web前端编辑器(1)课题内容：1.使用任意两款(Atom除外)编辑器编写Javascript程序，在页面上显示“HelloWorld!”。2.2.使用Atom编辑器编写Javascript程序，在页面上显示“HelloWorld!”(略，详情见电子文档)(2)具体实现或操作流程下载notepad,subline,atom等三款主流编辑器，然后用notepad，sublime和atom三款市面上主流的编辑器编写“HelloWorld!”，实现“HelloWorld!”的页面效果(略，详情见电子文档)3.2简易网站设计(1)课题内容：1.用html语言以及其他的网页动态语言实现简单的网页的编程学习，具体要求导航栏有多个子目录以及清晰简单明了的设计风格。上网查看csdn等博客里面高级程序员设计的代码风格和原生以及框架结构设计一个虚拟酒店网站和虚拟学校的学院的官网。(略，详情见电子文档)(2)具体实现或操作流程该网站设计采用模块化流程设计，将页面布局和网站逻辑分离开来。1.首先对网站进行需求分析，2.然后根据需求分析结果进一步确定模型设计网站逻辑结构和页面布局的设计了，3.最后实现简易网站代码的编写。(略，详情见电子文档)3.3javaScript编程(1)课题内容：1．问答题:函数防抖动2.编程题:编写一个函数，实现将一组数据进行快速排序，并在程序中调用该函数，将原数组和排序后的数组打印输出3.编程题:编写一个函数，实现将一组数据进行冒泡排序，并在程序中调用该函数，将原数组和排序后的数组打印输出(略，详情见电子文档)(2)具体实现或操作流程首先有三个题目，1.首先是函数防抖动的一道问答题，我们首先参考了课本和维基百科的知识和信息，学习函数防抖动的知识，然后完成问题。2.其次利用已经学过的javaScript编写快速排序的函数，并调用函数，将排序后的数组进行打印。3.最后和快速排序同样的是用javaScript编写冒泡排序的函数，调用函数，将排序后的数组进行打印。(略，详情见电子文档)3.4js网页游戏(1)课题内容：用javaScript完成一些趣味小游戏，例如，贪吃蛇、.视频弹幕、弹球游戏、拼图游戏等。(2)具体实现或操作流程1.贪吃蛇：完成贪吃蛇的具体需求分析，然后进一步分析贪吃蛇的具体活动情况，然后将蛇分为一段段组合起来，每个蛇身节点有自己的方向和left和top值，通过和上一节的蛇节点运动方向，来运动，最后分析蛇什么时候碰到墙壁显示游戏结束。2.视频弹幕:完成我首先确定文字层，当我们用鼠标点击发送文字，文本框获取到文字，通过颜色选择器确定颜色，然后逐个往里面添加显示和关闭弹幕的按钮，通过span来控制弹幕的显示和消失。3,4、实训课程设计总结首先我们由衷的感谢老师提供给我们这样一个锻炼自己的机会，经过这四周的学习，本次课程设计即将结束，总的来说，经过这门课的学习收获还是相当大的。回顾这段时间的课程设计，至今我仍感慨万分。的确，从选材到开始制作，从理论到实践，在四周的实训日子里，可以说得是苦多于甜，但是可以学到很多很多的的东西，同时不仅可以巩固了以前所学过的知识，而且学到了很多在书本上所没有学到过的知识。我们的工作是一个团队的工作，团队需要个人，个人也离不开团队，必须发扬团结协作的精神，某个人的离群都可能导致整项工作的失败。实训中只有一个人知道原理是远远不够的，必须让每个人都知道，否则一个人的错误，就有可能导致整个项目失败，团结协作是我们实训成功的一项非常重要的保证。而这次实习也正好锻炼我们这一点，这也是非常宝贵的。透过这次的实训使我们学到了很多，同时也让我们意识到我们要学的更多。从程序的设计到编写、画图、调试、修改、完善、到最后的实训报告，每个人都付出了时间和精力去做好自己的任务帮忙队友，所以团队的合作和队友之间的相互协助十分重要。透过实训让我们更深一步的对自己的专业，对自己的潜力，对自己所学的有正确的认识，并且能在以后的学习工作中不断提高和完善自己。老师为我们安排此次课程设计的基本目的，在于通过理论与实际的结合、人与人的沟通，进一步提高思想觉悟，尤其是观察、分析和解决问题的实际工作能力，以便培养成能够主动适应社会主义现代化建设需要的高素质人才。在这四个星期的课程设计之后，我们普遍感到不仅实际动手能力有所提高，更重要的是通过对软件开发流程的了解，进一步激发了我们对专业知识学习的兴趣，并能够结合实际存在的问题在专业领域内进行更深入的学习。5、参考文献：[1]《《JavaScript+jQuery程序开发实用教程》李雨亭主编，清华大学出版社，2016.1[2]《JavaWeb项目实训教程》,孙道贺、周建锋、张蕊、尉寅玮，清华大学出版社，2016.9[3]《javaWeb整合开发王者归来》,刘京华，清华大学，2010.1