完整项目.计算机生产实习报告一、理论学习1、设计1）UI基础概念及UI的发展前景2）网站设计规范及流程3）Photoshop软件的基本认识和使用2、前端1）Html5+CSS3技术HTML5相关基础知识，包括HTML5概述、Web开发历史、HTML标签、HTML5文档结构与创建HTML5文档；CSS3概述，CSS选择器，页面元素布局方式（浮动、定位），定义文本、字体与颜色，设计背景、阴影和边框，使用2D、3D变换，设计动画以及CSS3的其他新特性。2）JavaScript语言JavaScript发展、概述，js变量、流程控制、循环、函数、对象等基础语法；利用JavaScript操作浏览器、文档模型，页面动效制作；使用Ajax技术与后台进行异步数据交互；分析和处理数据并进行前台可视化展示3）Nodejs框架制作简Nodejs的发展、概述，使用Nodejs单服务器，用以接收请求读取本地数据文件，4）Echarts可视化插件利用百度Echarts插件进行数据可视化开发，制作可交互的动态图表。2、后端部分1）网络通信概述TCP/IP协议学习，wireshark抓包工具使用，网络通信过程详解2）LinuxLinux操作系统基本命令，系统管理，权限管理，软件安装，Shell脚本编写3）Java核心编程数据类型，流程控制语句，面向对象，IO4）Hadoop分布式文件系统HDFS，并行处理框架MapReduce，Hadoop集群搭建，项目开发项目内容二、项目内容项目名称：海量网站日志的KPI数据分析可视化平台数据分析KPI“海量网站日志的以项目介绍：可视化平台”为主线，包括项目可视化技术、大数据平台后台数据分析，挖掘技术，最终完成该项目，提升学生项目的设计、分析，实施等各项能力，以便适应企业的需求。功能介绍：本次海量日志KPI项目系统采用大数据技术Hadoop，通过搭建Hadoop集群，学习如何运用Hadoop集群里分布式文件系统HDFS存储海量数据，与并行计算处理框架MapReduce完成海量日志的分析。前台使用Photoshop按照网站制作标准对网站进行she激shi先，最主要不包含导航栏、侧导航、今日流量可视化、时间可视化、趋势图可视化、新老访客可视化六个模块。通过HTML+CSS对设计稿进行Web页面实现，同时使用Nodejs搭建服务器，通过JavaScript对后台数据进行请求与处理，将处理好的数据使用Echarts插件将进行可视化展示。直观的通过网站KPI指标的分析，从而对网站的发展运营做出战略性预测。三、项目详细设计1、设计部分模块设计1.1．项目结构主要分为六个模块，分别为导航栏、侧导航、今日流量可视化、时间可视化、趋势图可视化、新老访客可视化。1.2页面细节优化页面主要色调白色和蓝色构成，蓝色色值：#107eee.网站尺寸为1440*900；文字大小14号、16号、18号；文字颜色主要是#333333、#666666；页面应用到的图层样式有投影、描边。2、前端页面及功能的实现2.1HTML+CSS页面布局网站的布局使用HTML进行页面元素的合理分对元素进行布局修饰，以及页面效果CSS3配，的实现。．2.2JavaScript进行数据请求及分析处理JavaScript是一个浏览器脚本语言，用它可以操作页面元素，从而实现页面数据的渲染及更新。使用JavaScript中的Ajax技术可以发送异步数据请求2.3Nodejs进行服务器环境搭建Nodejs是JavaScript的运行环境，可以使JavaScript语言在服务器端运行，由于Ajax必须在服务器环境下运行，所以使用Nodejs搭建web服务器，从而支持ajax技术，以及使用Nodejs中的“文件模块”读取本地文件的内容并将读取到数据返回前台。2.4Echarts插件进行数据可视化展示在网站KPI分析中，有很多数据是需要使用图标进行展示的，如用户每小时PV统计、页面独立IP的访问量统计、用户的访问设备统计等，复杂的图标使用CSS或Photoshop制作时会非常复杂。Echarts是百度一款可视化插件，可以使用代码将数据方便快捷的转化为各类图表。、后台搭建及设计部分3日志分析3.1Nginx每条日志都代表着用一个网站服务器日志中，服务器日户的一次访问，下面就是一条Nginx志：--58.215.204.118GET[18/Sep/2017:06:51:36+0000]/wp-includes/js/comment-reply.min.js?ver=3.60304/1.1blog.fens.me/nodejs-socketio-chat/Mozilla/5.0(WindowsGecko/20100101rv:23.0)5.1;NTFirefox/23.0、访问IP其中包含了多种信息，包含访问者用户名称、访问时间...