步遥情感网
您的当前位置:首页Web前端实习报告

Web前端实习报告

来源:步遥情感网


实 习 报 告

号: 绩:

可修编

学生:学专业班级:实习单位:实习时间:校外指导教师:校指导教师:成

目 录

1实习背景1

1.1实习目的1

1.2实习起止时间1

1.3实习容概要1

2实习容1

2.1实习过程1

2.2实习容5

2.3主要成果5

3总结6

3.1网页游戏的认识6

3.2实习的自我评价7

可修编

1实习背景

1.1 实习目的

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

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

1.2 实习起止时间

➢ 开始时间:2015年7月12号 ➢ 截止时间:2015年7月18号

1.3 实习容概要

➢ 学习软件开发的各种模式,重点学习了敏捷开发(专业老师讲授) ➢ 学习HTML5、CSS、JAVASCRIP技术(形式:观看视频) ➢ 按照敏捷开发的流程,学员分组,制定每日的站立会议时间 ➢ 观看实习容例子的视频,分工合作 ➢ 提交实习成果,老师检查打分

2 实习容

2.1 实习过程

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

➢ 学习阶段

 开发模式

1) 软件生命周期

同任何事物一样,一个软件产品或软件系统也要经历孕育、诞生、成长、成熟、 -衰亡等阶段,这一般称为软件生命周期。

软件开发生命周期(SDLC)是指软件开发的全部过程、活动和任务的结构框架。 SDLC的一般步骤包括:确定问题、可行性分析与开发计划、收集需求、分析与设计、编码开发、测试、安装、维护。 2) 软件生命周期模式

典型的几种生命周期模式包括:瀑布模式、演化模式、螺旋模式、快速原型模式、喷泉模式和混合模式等。 3) 敏捷开发

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

特点:

a) 是一种开发方法学(Methodology),可以应对客户快速变 更的需求。 b) 强调以人为核心,采用迭代的方式,循序渐进地开发软件。

c) 在敏捷开发过程中,软件项目被划分成多个相互联系但也能运行的子项

目。

d) 每个子项目在开发、测试直至完成的过程中一直保持可使用的状态。 e) 这个过程就是要形成开发过程中团队之成员之间更加有效的合作关系,使其

灵活性更高,以适应不断变化的需求。

 技术讲解

1) 讲解容:HTML5、CSS、JAVASCRIPT技术 2) HTML5

HTML5是一个描述用于帮助开发者创建下一代和应用的HTML、CSS和JavaScript规格的涵盖性术语。这个定义中最显眼的三个部分是:HTML、CSS和JavaScript。他们定义了开发者如何使用优化标记,风格更丰富的性能,以及新JavaScript API来制作

可修编

最新的网络开发功能。简单而言,HTML5=HTML+CSS+JavaScript。

特性:

a) 语义特性(Class:Semantic)

b) 本地存储特性(Class: OFFLINE & STORAGE) c) 设备兼容特性 (Class: DEVICE ACCESS) d) 连接特性(Class: CONNECTIVITY) e) 网页多媒体特性(Class: MULTIMEDIA) f)

三维、图形及特效特性(Class: 3D, Graphics & Effects)

g) 性能与集成特性(Class: Performance & Integration) h) CSS3特性(Class: CSS3)

3) CSS

CSS(层叠样式表)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。

CSS使用方法:

a) 外联式Linking(也叫外部样式):将网页到外部样式表。 b) 嵌入式Embedding(也叫页样式):在网页上创建嵌入的样式表。 c) 联式Inline(也叫行样式):应用嵌样式到各个网页元素。 CSS布局特点:

a) 精简代码,降低重构难度 b) 网页访问速度 c) SEO优化 d) 浏览器兼容性 基础语法:

a) CSS 规则由两个主要的部分构成:选择器,以及一条或多条声明。 b) 选择器 {宣言1; 宣言2; ... 宣言N }

c) 选择器通常是您需要改变样式的 HTML 元素。 d) 每条声明由一个属性和一个值组成。

e) 属性(property)是您希望设置的样式属性(style attribute)。每个属性有一个

可修编

值。属性和值被冒号分开。 f)

选择器 {property: value}

4) JAVASCRIPT

JavaScript一种直译式脚本语言,是一种动态类型、弱类型、基于原型的语言,置支持类型。它的解释器被称为JavaScript引擎,为浏览器的一部分,广泛用于客户端的脚本语言,最早是在HTML(标准通用标记语言下的一个应用)网页上使用,用来给HTML网页增加动态功能。

组成

a) ECMAScript,描述了该语言的语法和基本对象。 b) 文档对象模型(DOM),描述处理网页容的方法和接口。 c) 浏览器对象模型(BOM),描述与浏览器进行交互的方法和接口。 特点

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

b) 主要用来向HTML(标准通用标记语言下的一个应用)页面添加交互行为。 c) 可以直接嵌入HTML页面,但写成单独的js文件有利于结构和行为的分离。 d) 跨平台特性,在绝大多数浏览器的支持下,可以在多种平台下运行(如

Windows、Linux、Mac、Android、iOS等)。

➢ 开发阶段

 开发第一天

站立会议:8.00—8.15

会议容:小组分工,制定站立会议时间,了解每个人的学习情况,交流学习的容 任务容:“打地鼠”网页游戏的网页布局——>HTML5+CSS技术  开发第二天

站立会议:8.00—8.15

会议容:小组分工,完成情况,了解每个人的进度,交流学习的容 任务容:“打地鼠”网页游戏的功能实现  开发第三天

站立会议:8.00—8.15

可修编

会议容:小组分工,完成情况,查漏补缺,测试软件,寻找bug,交流学习的容 任务容:“打地鼠”网页游戏的软件测试,寻找不足,确认无误,提交实习结果

2.2 实习容

➢ 项目介绍

“打地鼠”网页游戏是安卓版“打地鼠”游戏的进一步开发,可以实现在网页中构建游戏的所有功能,并且不用下载安装既可以用的游戏,网页版游戏的市场前景潜力无限,国逐渐发展起来一批喜欢网页游戏的用户群,并且网页游戏属于中小型的项目,易于开发,应用于敏捷开发的流程,效率十分高。 ➢ 我的任务

“打地鼠”网页游戏网页布局的调整,以及“打地鼠”之所谓“打”的动画实现,还有最后的“软件测试”。 ➢ 软硬件平台

DREAMWEAVER CS6,MOZILLA FIREFOX浏览器,PHOTOSHOP CS6

➢ 使用技术

 HTML5  CSS  JAVASCRIPT

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

2.3 主要成果

“打地鼠”网页游戏的成功开发,基本功能:打地鼠的动画,游戏的时间,统计分数,开始游

戏,暂停游戏,结束游戏,走马灯介绍等等。但是在实际测试的时候仍然出现了一些BUG,比如动画的

可修编

迟缓(主要是因为动画的缓冲没有做好),还有一些分数的统计不甚合理,这在我们应用的时候及时的发现,并且处理了这样的问题。

3 总 结

3.1 网页游戏的认识

网页游戏又称Web游戏,无端网游,简称页游。是基于Web浏览器的网络在线多人互动游戏,无需下载客户端,不存在机器配置不够的问题,最重要的是关闭或者切换极其方便,尤其适合上班族。

在那个网络高速扩的年代,在那个大量菜鸟网民拥入网络的年代,在那个文字MUD已经逐渐衰退而网络游戏又尚未兴起的年代,这种新颖玩意儿的推出,无疑让很多人为之惊艳。仅仅通过简单注册,就可以边玩游戏边泡论坛。尽管只有简陋的游戏界面、一堆文字、几图片,游戏方式也不过是刷新页面而已,但WebGame却带来了无限的乐趣和遐想,同时还演绎了让无数人刻骨铭心的爱恨情仇。如今网络游戏百花争鸣,到处充斥着唯美的人物和绚丽的光影。你会偶尔缅怀那些逝去的岁月吗?至少在我心底,一直有数款难以忘怀的WebGame。

WebGame,顾名思义就是基于Web浏览器的网络在线多人游戏。从诞生发展至今,WebGame大概分为三种类型:一是基于Web浏览器,使用PHP/ASP/Perl等解释语言建设的虚拟社区;二是基于Web浏览器,使用Flash/JAVA技术制作的游戏;三是需要下载客户端并连接专用服务器运行的游戏。

网页游戏尽管EBS将国WebGame的发展往前推了一把,但是一段时间后,这类WebGame的弱点逐渐暴露出来。一些架设WebGame供网民免费游玩的站点,由于质量和管理不过关、服务器负载过大,丢失了不少玩家。同时,比WebGame华丽N倍的网络游戏兴起后,WebGame自然就逐渐没落了。传统意义上的WebGame依然为少部分热爱者延续至今,而且游戏性与游戏素材比以前丰富许多。

➢ 前景分析

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

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

可修编

 混搭式类型成主流  策略游戏不断丰富  游戏容多样化  消费群体不断成熟  市场集中度提高  游戏跨形态融合  产品结构渐丰富  步入全球化运作  企业品牌意识增强

3.2 实习的自我评价

这次实训充分利用了课堂所学,掌握了许多关键技术,例如模版技术,CSS样式,使得制作过程方便了很多。在完成基本要求得基础上,文件夹、文件命名规;文件存放位置合理; 制作完成之后进行过现场清理:没有无用的文件、文件夹,没有断链(外部不算);工作量饱满:容较丰富、自己设计制作的素材应用多;色系、布局合理美观、考虑用户访问方便;采用各种特效、并且运用合理。 不过也有些不足,比如一开始没有把几个人制作的文件夹分开,导致后面汇总时比较麻烦。还有就是文件名字开始中文命名,有的时候错误。这次的作业随说我是在网上找了很多做好的模板但是我还是很有成就感,觉得自己很不错。不过总的来说,对这次的作品相当满意,不仅选择了我们自己喜欢的容,而且在我们的水平上把它做的很精美。在这个过程中我们意识到了自己在相关技术上的不足,通过学习,知道了如何改进我们的缺点,相信在以后的应用中,我们会做的更加完美!

可修编

因篇幅问题不能全部显示,请点此查看更多更全内容