说一句
为什么要说Web前端工程师？要知道，Android、Ios开发工程师都属于前端，前端即客户端，是跟用户接触的直接通道
石器时代的前端工程师
写好布局、样式、交互之后直接丢给服务端的同学**“ 绑数据 ”，其他东西几乎不用管**，项目结构也十分简单，无非就是css、js、image这三个文件夹，这属于传统开发
现代前端
以前的网站就叫网站，现在可以说是Web应用，页面复杂度、项目结构复杂度增加，特别是单页面应用的风靡。组件化，工程化，自动化，模块化成了前端发展的趋势
工程、自动、模块
参考文章
前后端分离
这就意味着，前端、服务端职责分离，前端负责所有有关页面的东西，包括**“ 绑数据 ”，而服务端只负责数据的处理**，增删改查等提供接口给前端调用即可。问题来了？How？前端怎么绑数据，主要看你选择那种渲染方式
服务端渲染
服务端渲染，就如同传统开发一样，前端写好模板给服务端的绑数据，如Java的Jsp模板引擎，PHP的Smarty模板引擎，这个工作本来是应该由前端来做的，但是学习成本太高（环境搭建、语言学习…），所以才有了**Nodejs**的出现
Nodejs
Nodejs也是一门服务端语言，相当于把Javascript跑在了服务端上，学习成本很低，让Node直接替换掉Java、PHP吗？如果你是自己玩玩，那么是可以的，Node + 某数据库 + 某模板引擎。如果你公司的核心语言是Java、PHP，又想前后端分离怎么办，让Node做中间层就好
大概就是，客户端Javascript通过Ajax请求Node接口，Node请求Java、PHP接口
客户端渲染
客户端渲染就是所有数据都通过Javascript进行渲染，目前主流的三个SPA框架是**Angular、React、Vue，SPA即Simple Page Application（单页应用），整个项目只有一个入口**，不刷新页面就可以做到跳转，想象一下原生APP，项目的组件化、工程化思想得到了进一步提升，个人推荐新手学习Vue（中文文档、轻便、易懂）
数据驱动
像Angular、React、Vue这些都是MVVM框架，Module、View、ViewModule三层，数据双向绑定，是数据驱动，Jquery这些库其实是DOM驱动，控制隐藏一个元素都是操控DOM的属性而已，拿代码对比一下DOM驱动跟数据驱动
// DOM驱动
document.querySelector('#app').hidden = true;
// 数据驱动
let vm = new Vue({
el: '#app',
data: {
show: true
}
})
数据驱动中，想要隐藏掉#app只需要把show改为false（双向绑定，Module里面改了，View里面跟着改）
vm.show = false
半客户端、半服务端渲染
大家都知道，单页应用的通病就是对SEO很不友好，由于是异步渲染所以爬虫抓取不到页面的内容，因此出现了很多基于SPA框架的服务端渲染框架，如基于Vue的**Nuxt**，又是单页应用，又能做SEO
为什么选择Vue
你学了Vue，你可以写单页(vue)、服务端渲染(nuxt)、小程序(mpvue)、Android跟IOS应用(weex)，同一套语法，可以写这么多端的东西，真的值
你应该掌握的技能
- H5
- css3
- css预处理器，sass
- es6
- mvvm框架的其中一种
- 微信小程序
- nodejs
- 废弃jquery
- 不要再兼容IE6了
- webpack
- gulp
