Web前端实习报告

实习报告学生姓名：

学号：

专业班级：

实习单位：

实习时间：

校外指导教师：

校内指导教师：

成绩：

目录

1实习背景

1.1实习目的

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

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

1.2实习起止时间

➢开始时间：2015年7月12号

➢截止时间：2015年7月18号

1.3实习内容概要

➢学习软件开发的各种模式，重点学习了敏捷开发（专业老师讲授）

➢学习HTML5、CSS、JAVASCRIP技术（形式：观看视频）

➢按照敏捷开发的流程，学员分组，制定每日的站立会议时间

➢观看实习内容例子的视频，分工合作

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

2 实习内容

实习过程

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

➢学习阶段

✧开发模式

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等）。

➢开发阶段

✧开发第一天

站立会议：—

会议内容：小组分工，制定站立会议时间，了解每个人的学习情况，交流学习的内容

任务内容：“打地鼠”网页游戏的网页布局——>HTML5+CSS技术

✧开发第二天

站立会议：—

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

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

✧开发第三天

站立会议：—

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

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