大三前端实习日志

大三暑期选择实习：

工作内容：前端web实习
实习地点：武汉光谷
公司规模：创业型公司，前端开发人数为9人，实习生5名

1.实习内容总结：

1.前端html+css页面结构培训

实习内容：为完成UI设计稿到页面的实现。使用Photoshop切图，html+css完成页面制作
实习完成时间：5天
实习过程：

---

前期： 到达公司，完成了基本的人事报到。找到自己座位，连接好电脑。公司中为迎接新人开了一个迎新会，大家各自介绍了自己，说明了这周的工作计划，就散会了。前端带实习的负责人找我进行了一次简单的谈话，问了我从面试以后的学习状况，和对我接下的学习给予一定指导：
1. 学会使用搜索引擎
2. 遇到问题自己先想解决的方法，再与他人交流
3. 学习新的技术多练多想
接到任务，安装工作需要的一些基本软件，
1. 学习使用SVN
SVN（版本控制器）在工作中方便协作和版本控制，基本的使用还算简单，主要学习方式是查看微博
2. 安装Apache
之前浏览页面的都是直接点击制作好的页面，老大让改掉这个习惯，方便后面的开发，还有页面通过服务器端访问可能不一样
3. 前端小工具
EclipsePalette（颜色吸取，查看）
Calipers（像素测量）

---

页面制作：
可以说，在学校有学习HTML+CSS，但是一直不动手写代码。写也只是简单关于一个知识的练习，而这次是一个完整的页面，自己是不知道怎么下手。就和你背了单词，但不一定会写文章。

---

第一次提交：来实习之前就学习了一些bootstrap的基础，就想用bootstrap来写，大概一天半的基本上完成，提交代码，问题：
1. 页面布局没有按照UI 设计来，字体，字号，边距不相符
2. 不许用bootstrap，练习基础最基础。
自我改进方法：
1.1在Photoshop中字体查看:
 (1)如果字体用文字书写，直接点击工具栏中的「T」查看
 
 (2)测试行高，用矩形选择框选择来能行文字
   line-height= 两行文字height-文字（font-size）
1.2切图
 (1) 我使用的是将其转换为智能对象，然后储存为web所用格式，后来在闲的时候学习了相关课程
  前端工程师必备的ps技能

1.3 间距
(1)间距可以使用”标尺”+”参考线”+”矩形选框工具”;
(2)或者使用前面介绍的小工具进行测量
2. 彻底不用bootstrap

---

第二次提交：更改了上述问题，提交后本次问题：
1.css中百分比和像素混用，在本机页面显示正常，到不同分辨率下显示混乱
2.布局不合理，margin和position等胡乱使用
自我改进的方法：
 1.由于制作页面为简单的展示页面，先不必考虑响应式，所以完全采用像素作为单位，另外设置了页面最小宽度
 2.自己之前对布局等还是理解不过，导致胡乱使用，通过查看《精通css 高级Web标准的解决方案》再次学习，更改了页面的不足；
后来学习了相关的课程：
CSS深入理解之margin_张鑫旭
CSS深入理解之absolute_张鑫旭
CSS深入理解之relative_张鑫旭

---

第三次提交 页面从布局上基本可以看得过去了，接下来老大查看了我的代码/(ㄒoㄒ)/~~,一大堆问题:
1. 命名不规范
2. 多类，多不必要的div
3. 注释不规范，代码缩进不合理
4. 兼容性没有考虑
自我改进方法：
 1.命名具有意义，不可以是area1 ，area2，以序号命名。前端命名，书写规范可以查看如下文档：
  前端书写命名规范
  可以最好按照上面的来写，老大说了写代码是要有一些强迫症的
 2.删，通过调试工具来删去不必要的类，精简代码，每个div要有其意义，并且在css中可以使用元素选择器控制的就不要给他在添加格外的类
 3.”代码首先是给人看的，再是给机器看的”—-老大说的
   3.1用一个tab 代表四个空格进行
   3.2注释简明扼要
 4.浏览器兼容性问题还是要靠平时多积累的。这个我遇到的问题也仅仅是：
  IE8不支持html5新的标签，还有margin清除的问题

---

我自己页面到这里算是正式提交完成，老大将其他实习生写的代码给我作为参考学习，自己相对比之下，不得不说自己的代码写的实在有些烂，多改正。

---

实习阶段总结：
1. 勤于动手
  我们看完了书面他人的东西，想要变成自己的内在的知识是需要练习的，如果一直像之前学完，我知道了有这个内容，而不去使用是不会成长的。我们将例子自己动手打一遍，自己再拓展一下才能掌握。前端是需要经验的，而经验的累计是需要靠自己摸索的。背完单词，试着写写文章，才可以说真正理解单词了
2. 代码首先是给人看的，再是给机器看的
  这句话对于前端来说很重要，和服务器的对接，和其他伙伴的合作，符合规范、书写注释都是很必要的，养成良好的习惯，利己利人。
3.多学习
  网上博客，免费的课程都很多，不会了自己多想办法解决。
针对于这段时间的学习，页面制作，可以参考从psd到html学习完感觉对自己帮助很大，知道了页面的布局的一个简单流程

stay hungry stay foolish