【小前端的自我修养】这系列文章记录的,是一个小前端的成长经验,会不定时的更新修正。
对刚入前端门槛的前端童鞋们或许会有用,经验和姿势丰富的老司机可以路过。
本文主要是走马观花地介绍一下一个前端工程师会接触的到东西,以后会慢慢展开。
前端工程师的日常?
- 切图:将设计稿根据页面功能提取出各种需要的图片、图标。
- 页面编写:html+css页面编写。
- JavaScript编写:实现各种页面动态交互效果。
- 兼容性调试:这占前端工程师的很大一部分时间。
- 性能优化:合并、压缩、CDN等……。
- 用户体验优化。
- 新技术调研。
- node.js后端编写。
- App开发:混合应用。
前端发展过程中,涉及那些知识和概念?
HTML+CSS+JS: 前端最基础的东西。
EDM邮件营销:发送的营销邮件使用html编写,是邮件更赏心悦目。
语义化 :良好的编码习惯,便于阅读和搜索引擎SEO。
SEO:搜索引擎优化。
WAI-ARIA无障碍:通过特定的标签,使网页便于读屏软件阅读,方便视力有障碍的人使用。
CSS Sprites:将多个小图标合并为一张大图,减少请求数。
HTML5
CSS3
响应式:是网站在各种宽度的屏幕小都能良好展示。
CDN。
IconFont: 使用矢量字体代替图标,相应的工具有阿里巴巴图标、icomoon、Font Awesome等……
MVC、MVVM、MVP。
WEBP: 谷歌(google)开发的一种旨在加快图片加载速度的图片格式,WebP 探寻之路。
Retina: 在分辨率极高的设备中,让网页能很好的展示。相关文章: 走向视网膜(Retina)的Web时代。
SPA:单页Web应用(single page web application,SPA),就是只有一张Web页面的应用,是加载单个HTML 页面并在用户与应用程序交互时动态更新该页面的Web应用程序。
Hybrid:Hybrid App(混合模式移动应用)是指介于web-app、native-app这两者之间的app,兼具“Native App良好用户交互体验的优势”和“Web App跨平台开发的优势”。类似工具有:PhoneGap, Ionic。
预处理。紧接着出现各种预处理语言,包括用来编译为css 的less,用来编译为html的jade,用来便以为js的coffee script 等等……
模块化。最为火热的是requireJS, Sea.js. 以及相应的AMD规范, CMD规范, 以及对应得运行于node端的CommonJS规范。
前端组件化。所谓的组件化,值得是把一个比较独立的功能模块的css、js、html还有图片等等相关的资源独立出来,以达到复用的目的。
前端工程化。所谓前端工程化,就是借助工具,管理你的所有前端资源,你可以使用各种预处理语音,模块化工具,最后通过工程化工具将他们打包、压缩(当然不止这些功能)等。简单列举几个使用比较广的:grunt, gulp, webpack, FIS。
混合应用(Hybrid App)。所谓混合应用,就是用前端语言编写,然后通过相关工具比如phonegap等打包成App应用。混合应用的好处就是可以一套代码直接打包到多个平台(Android、IOS),开发成本和效率相对较高。缺点是运行在webview中,性能和体验比原生应用差,而且不是每一个原生应用有的功能它都能实现。
W3C:万维网联盟(外语缩写:W3C)标准不是某一个标准,而是一系列标准的集合。
ECMAScript:Javascript规范。
DOM。
BOM。