前言

现在的前端同学如果去面试的话，面试的问题肯定会有你了解前后端分离吗，你了解nodejs吗？在没有了解的时候感觉这是个什么东西，好高大上，去网上查了查资料，再多做几个demo，终于对传说中的前后端分离以及nodejs有了一些了解。其实在技术这个行业里面没有什么是绝对好的技术也没有什么是过时的差的技术，只要合适的技术在合适的环境下他就是最好的技术，所以我们在学习一些新技术的时候，也不要觉着只要是新技术，是最新最热门的技术就是最好的，其实它也是通过不同的行业背景行业环境以及一些以往的技术慢慢的衍生过度而来的。

什么是前后端分离？

网上对于前后端分离的言论，简析已经数不胜数，这里我只是谈一谈通过我自己的学习实践之后的一些我的认知，前后端之间使用 JSON 来交流，前端同学和后端同学制定好数据的格式以及接口API进行交互。从此，前端同学就不用再等后台同学制定出接口之后再开发，就可以前后端同步开发，大大的提高了开发的效率。

我们真的需要前后端分离吗？

这个问题就需要具体的业务需求和业务场景了，不过目前大多数网站开发尤其是注重用户体验的网站，都在做前后端分离，我们公司最开始开发官方网站的时候因为为了快速开发，而且最开始的时候用户量比较少，后台压力也比较小，就使用的是jsp，服务端直接渲染，后来因为业务需求改变并且开发了微信端和APP，为了更好的用户体验以及更炫酷的图形界面我们最终采用了前后端分离的开发模式

前后端分离的核心：后台提供数据，前端负责显示

最近前端大热的什么MVC,MVVM框架VUEJS,angularjs，Reactjs了一说就是为了更好的前后端分离开发，难道不用这几个框架就不是前后端分离了吗？当然不是的，只要不是服务端直接渲染的就是前后端分离，比如正常的生产环境之下，后台同学给了我们前端同学一些数据接口我们用Ajax同后台交互然后在前端页面上操作这些数据这就是前后端分离，那为什么vue,angular,react会大热呢，以我自己学习了解之后感觉其实就是俩点。用我比较熟悉的vue框架来举例说明。

1双向绑定

一个所谓双向绑定，用vue举例来说就是vue实例中的data与其渲染的DOM元素的内容保持一致，无论谁被改变，另一方会相应的更新为相同的数据这是框架通过内部的封装机制实现的，在我们日常开发比如这么一个功能用户需要修改一个表单内容而在其下方有个视图是可以实时展示表单内容的，而我们开发的时候就需要写大量的js来互相监听元素的内容和表单的内容是否发生了变化，而vue已经帮我们写好了，只要我们按照它规定的语法进行配置就好了。

2依赖注入

vue内部已经编写好了依赖，只有当路由跳转的时候才会注入需要展示的页面，而其他页面则没有加载，在小型项目中体现可能不是很明显，大型项目的使用中会大大的提高网页的加载效率，性能效率。

Node.js

Node.js的需求

在上面的三大框架流行的同时nodejs也根据需求因势而出，在我们前后端分离做数据交互的时候，是依赖与后台同学的接口地址的，如果后台同学也在开发调试的时候出现bug，或者是我们调试请求接口出现问题就都互相影响，当然我们可以在页面上先写上假数据，等待最后开发完成后再清除掉所有的假数据，一个是当接口调通了之后页面样式还是多多少少有些差距，一个是需要清掉假数据很繁琐，这样nodejs就有了用武之地。我们前端同学就需要一个运行在浏览器端的服务器。

Node.js的概念

简单的说 Node.js 就是运行在服务端的 JavaScript。
Node.js 是一个基于Chrome JavaScript 运行时建立的一个平台。
Node.js是一个事件驱动I/O服务端JavaScript环境，基于Google的V8引擎，V8引擎执行Javascript的速度非常快，性能非常好。

NPM

NPM是随同NodeJS一起安装的包管理工具，能解决NodeJS代码部署上的很多问题，常见的使用场景有以下几种：
1 允许用户从NPM服务器下载别人编写的第三方包到本地使用。
2 允许用户从NPM服务器下载并安装别人编写的命令行程序到本地使用。
3 允许用户将自己编写的包或命令行程序上传到NPM服务器供别人使用。
由于新版的nodejs已经集成了npm，所以之前npm也一并安装好了。同样可以通过输入 "npm -v" 来测试是否成功安装.

使用 npm 命令安装模块

npm 安装 Node.js 模块语法格式如下：
npm install <Module Name>

全局安装与本地安装

npm 的包安装分为本地安装（local）、全局安装（global）两种，从敲的命令行来看，差别只是有没有-g而已，比如
npm install <Module Name> # 本地安装
npm install <Module Name> -g # 全局安装

使用淘宝 NPM 镜像

大家都知道国内直接使用 npm 的官方镜像是非常慢的，这里推荐使用淘宝 NPM 镜像。淘宝 NPM 镜像是一个完整 npmjs.org 镜像，你可以用此代替官方版本(只读)，同步频率目前为 10分钟一次以保证尽量与官方服务同步。你可以使用淘宝定制的 cnpm (gzip 压缩支持) 命令行工具代替默认的 npm: npm install -g cnpm --registry=https://registry.npm.taobao.org
这样就可以使用 cnpm 命令来安装模块了：
cnpm install [name]