(word版)假期web前端实习报告(DOC)

实习报告

学生姓名：

学 号：

专业班级：

实习单位：

郑州轻工业学院

1 / 161

(word版)假期web前端实习报告(DOC)

2 / 162

实习时间：

校外指导教师：

校内指导教师：

成 绩：

(word版)假期web前端实习报告(DOC)

目录

1实习背景 1

实习目的 1

实习起止时间 1

2

实习内容概要 1

实习内容.................................................... 1

实习过程 1

实习内容 5

3

主要成果 6

总 结 6

网页游戏的认识 ..........................................................................................................................6

实习的自我评价

..........................................................................................................................7

3 / 163

(word版)假期web前端实习报告(DOC)

1实习背景

实习目的

了解软件开发的各种模式，开发流程，以及各种形式的建模

详细学习敏捷开发的各个流程，并通过实习来体会敏捷开发所带来的效率 掌握HTML5、CSS、JAVASCRIPT等技术

实习起止时间

开始时间：2021年7月12号 截止时间：2021年7月18号

实习内容概要

学习软件开发的各种模式，重点学习了敏捷开发〔专业老师讲授〕 学习HTML5、CSS、JAVASCRIP技术〔形式：观看视频〕

按照敏捷开发的流程，学员分组，制定每日的站立会议时间 观看实习内容例子的视频，分工合作

提交实习成果，老师检查打分

4 / 1

(word版)假期web前端实习报告(DOC)

2

实习内容

实习过程

可以以周为时间单位概述实习各阶段所从事的主要工作等；

5 / 165

1

(word版)假期web前端实习报告(DOC)

学习阶段

开发模式 软件生命周期

同任何事物一样 ,一个软件产品或软件系统也要经历孕育、诞生、成长、成熟、 -衰

亡等阶段，这一般称为软件生命周期。 软件开发生命周期

(SDLC)是指软件开发的全部过程、活动和任务的结构框架。

SDLC的一般步骤包括：确定问题、可行性分析与开发方案、收集需求、分析与设计、

编码开发、测试、安装、维护。

软件生命周期模式

典型的几种生命周期模式包括：瀑布模式、演化模式、螺旋模式、快速原型模式、喷

泉模式和混合模式等。 敏捷开发

敏捷开发〔Agile〕是一种关注价值、消除浪费、以人为核心、迭代、循序渐进的开

发方法。

特点：

a) 是一种开发方法学〔 Methodology〕，可以应对客户快速变

更的需求。

强调以人为核心，采用迭代的方式，循序渐进地开发软件。

在敏捷开发过程中，软件工程被划分成多个相互联系但也能运行的子工程。 每个子工程在开发、测试直至完成的过程中一直保持可使用的状态。

这个过程就是要形成开发过程中团队之成员之间更加有效的合作关系，使其灵活性更高，以适应不断变化的需求。

技术讲解

1)

2)

讲解内容：HTML5、CSS、JAVASCRIPT技术

HTML5

HTML5是一个描述用于帮助开发者创立下一代网站

HTML、CSS和

6 / 166

(word版)假期web前端实习报告(DOC)

和应用的

JavaScript规格的涵盖性术语。这个定义中最显眼的三7 / 167

HTML、CSS和

2

个局部是：

(word版)假期web前端实习报告(DOC)

JavaScript。他们定义了开发者如何使用优化标记， 风格更丰富的性能，以及新JavaScript API来制作最新的网络开发功能。简单而言， HTML5=HTML+CSS+JavaScript 特性：

。

语义特性〔Class：Semantic〕

本地存储特性〔Class:OFFLINE&STORAGE〕 设备兼容特性(Class:DEVICEACCESS) 连接特性〔Class:CONNECTIVITY〕 网页多媒体特性(Class:MULTIMEDIA)

三维、图形及特效特性〔Class:3D,Graphics&Effects〕 性能与集成特性〔Class:Performance&Integration〕

CSS3特性(Class:CSS3) CSS

CSS(层叠样式表)是一种用来表现 HTML〔标准通用标记语言的一个应用〕 或XML

〔标准通用标记语言的一个子集〕等文件样式的计算机语言。

CSS使用方法：

外联式Linking〔也叫外部样式〕：将网页链接到外部样式表。 嵌入式Embedding〔也叫内页样式〕：在网页上创立嵌入的样式表。 内联式Inline〔也叫行内样式〕：应用内嵌样式到各个网页元素。 CSS布局特点：

精简代码，降低重构难度 网页访问速度 SEO优化

浏览器兼容性根底语法：

CSS规那么由两个主要的局部构成：选择器，以及一条或多条声明。 b) c)

元素。 3

选择器{宣言1;

宣言2;... 宣言N}

选择器通常是您需要改变样式的 HTML8 / 168

(word版)假期web前端实习报告(DOC)

每条声明由一个属性和一个值组成。

e) 属性〔property 〕是您希望设置的样式属性〔 styleattribute 〕。每个属性

有一个值。属性和值被冒号分开。 选择器{property:value} JAVASCRIPT

JavaScript 一种直译式脚本语言，是一种动态类型、弱类型、基于原型的语言，

内置支持类型。它的解释器被称为 JavaScript 引擎，为浏览器的一局部，广泛用于 客户端的脚本语言，最早是在 HTML〔标准通用标记语言下的一个应用〕网页上使用， 用来给HTML网页增加动态功能。

组成

ECMAScript，描述了该语言的语法和根本对象。

文档对象模型〔DOM〕，描述处理网页内容的方法和接口。 浏览器对象模型〔BOM〕，描述与浏览器进行交互的方法和接口。

特点

a) 是一种解释性脚本语言〔代码不进行预编译〕

。

主要用来向HTML〔标准通用标记语言下的一个应用〕页面添加交互行为。 可以直接嵌入HTML页面，但写成单独的js文件有利于结构和行为的别离。

跨平台特性，在绝大多数浏览器的支持下，可以在多种平台下运行〔如 Windows、Linux、Mac、Android、iOS等〕。

开发阶段 开发第一天 站立会议：—

会议内容：小组分工，制定站立会议时间，了解每个人的学习情况，交流学习的内容 任务内容：“打地鼠〞网页游戏的网页布局—— >HTML5+CSS技术

开发第二天 站立会议：—

会议内容：小组分工，完成情况，了解每个人的进度，交流学习的内容

9 / 169

(word版)假期web前端实习报告(DOC)

10 / 1610

4

(word版)假期web前端实习报告(DOC)

任务内容：“打地鼠〞网页游戏的功能实现

开发第三天 站立会议：—

会议内容：小组分工，完成情况，查漏补缺，测试软件，寻找 bug，交流学习的内容

任务内容：“打地鼠〞网页游戏的软件测试，寻找缺乏，确认无误，提交实习结果

实习内容

工程介绍

“打地鼠〞网页游戏是安卓版“打地鼠〞游戏的进一步开发，可以实现在网页中构建游戏的所 有功能，并且不用下载安装既可以用的游戏，网页版游戏的市场前景潜力无限，国内逐渐开展

起来一批喜欢网页游戏的用户群，并且网页游戏属于中小型的工程，易于开发，应用于敏捷开 发的流程，效率十分高。

我的任务

“打地鼠〞网页游戏网页布局的调整，以及“打地鼠〞之所谓“打〞的动画实现，还有最后的

“软件测试〞。

软硬件平台

DREAMWEAVERCS6，MOZILLA FIREFOX浏览器，PHOTOSHOPCS6 使用技术 HTML5

CSS JAVASCRIPT

浏览器中的开发人员调试 PHOTOSHOPCS6的图片处理技术 JAVASCRIPT的进阶——>JQERY技术

11 / 1611

(word版)假期web前端实习报告(DOC)

12 / 1612

5

(word版)假期web前端实习报告(DOC)

主要成果

“打地鼠〞网页游戏的成功开发，根本功能：打地鼠的动画，游戏的时间，统计分数，开始游 戏，暂停游戏，结束游戏，走马灯介绍等等。但是在实际测试的时候仍然出现了一些 BUG，比方动画的

缓慢〔主要是因为动画的缓冲没有做好〕 候及时的

，还有一些分数的统计不甚合理，这在我们应用的时

发现，并且处理了这样的问题。 3

总 结

网页游戏的认识

网页游戏又称 无

Web游戏，无端网游，简称页游。是基于 Web浏览器的网络在线多人互动游戏，

需下载客户端，不存在机器配置不够的问题，最重要的是关闭或者切换极其方便，尤其适合上班族。 在那个网络高速扩张的年代，在那个大量菜鸟网民拥入网络的年代，在那个文字 MUD已

经逐渐衰退而网络游戏又尚未兴起的年代，这种新颖玩意儿的推出，无疑让很多人为之惊艳。仅仅

通过

简单注册，就可以边玩游戏边泡论坛。尽管只有简陋的游戏界面、一堆文字、几张图片，游戏方式也不

过是刷新页面而已，但 的爱恨

WebGame却带来了无限的乐趣和遐想，同时还演绎了让无数人刻骨铭心

情仇。如今网络游戏百花争鸣， 去的岁月吗？

到处充满着唯美的人物和绚丽的光影。 你会偶尔缅怀那些逝

至少在我心底，一直有数款难以忘怀的 WebGame。

WebGame，顾名思义就是基于 概

Web浏览器的网络在线多人游戏。从诞生开展至今， WebGame大

分为三种类型：一是基于 Web浏览器，使用 PHP/ASP/Perl等解释语言建设的虚拟社区；二是基于 Web

13 / 1613

(word版)假期web前端实习报告(DOC)

浏览器，使用 戏。

网页游戏尽管 弱

Flash/JAVA技术制作的游戏；三是需要下载客户端并连接专用效劳器运行的游EBS将国内WebGame的开展往前推了一把，但是一段时间后，这类 WebGame的

WebGame供网民免费游玩的站点，由于质量和管理不过关、效劳器

WebGame华美N倍的网络游戏兴起后， WebGame自然就逐渐

点逐渐暴露出来。一些架设 负载过

大，丧失了不少玩家。同时，比 没落了。

传统意义上的 WebGame依然为少局部热爱者延续至今，而且游戏性与游戏素材比以前丰富许多。

6

14 / 1614

(word版)假期web前端实习报告(DOC)

前景分析

网页游戏的市场潜力巨大，与其他类型网游相比有着强劲优势

网页游戏的用户群逐渐培养起来，极有可能成为未来网游用户的一支主力军避大型网游之锋芒，坚持走游击路线。坚持和中小站长合作针对用户群大胆创新，敢于突破固有模式

游戏特点 混搭式类型成主流

策略游戏不断丰富

游戏内容多样化 消费群体不断成熟

市场集中度提高 游戏跨形态融合

产品结构渐丰富 步入全球化运作

企业品牌意识增强

实习的自我评价

这次实训充分利用了课堂所学，掌握了许多关键技术，例如模版技术， CSS样式，使得制作过程方

便了很多。在完成根本要求得根底上，文件夹、文件命名标准；文件存放位置合理； 制作完成之后进

行过现场清理：没有无用的文件、文件夹，没有断链 (外部链接不算 丰富、自己

)；工作量饱满：内容较

设计制作的素材应用多； 色系、布局合理美观、考虑用户访问方便； 采用各种特效、并且运用合理。 不

过也有些缺乏，比方一开始没有把几个人制作的文件夹分开，导致后面汇总时比拟麻烦。还有就是文件

名字开始中文命名，有的时候链接错误。这次的作业随说我是在网上找了很多做好的模板但是我还是很

15 / 1615

(word版)假期web前端实习报告(DOC)

有成就感，觉得自己很不错。 不过总的来说，对这次的作品相当满意， 喜欢的内容，

不仅选择了我们自己

而且在我们的水平上把它做的很精美。 在这个过程中我们意识到了自己在相关技术上的缺乏，通过学习，

知道了如何改良我们的缺点，相信在以后的应用中，我们会做的更加完美！

16 / 1616

7