笼统的前端

现在前端领域各种框架、库并行，新技术层出不穷，暂且称它为“繁荣”吧。

对一个刚刚走进这个江湖的菜鸟来说，jQuery、Angular、React、Vue、Bootstrap、Node这些经常在各大公司招聘要求以及各大前端论坛信息中的看到词到底是什么，有什么作用，一会儿框架，一会儿库的，还有MVC、MVVM以及npm、gulp、webpack等，就像各大帮派一样，搞得人一头雾水。

链接

我眼中的前端框架jQuery，Angular，React，Vue——以及我看前端架构

浅析angular，react，vue.js，jQuery使用区别

Gulp和webpack的区别，是一种工具吗？

nodejs+gulp+webpack基础实战篇

各路英雄的见解

关于框架

  • 前端框架天下三分：Angular、React 和 Vue
  • 按照时代出场顺序排序：jQuery、Angular、React、Vue
  • jQuery肯定要学的，Angular、React 和 Vue三个先学一个，三个都是比较类似的
  • React，Angular,Vue三个也是没有关联相互独立的框架。使用这三个框架搭建的网站主要特点就是动态刷新，路由控制不通过后端，全是JS完成，每次跳转页面都是动态替换index.html页面root节点的内容
  • Angular、React、Vue是Js框架，本身都是用js原生写的，就是别人把一些js的代码封装了，你调用之后就能用别人写好的方法，会方便很多，也被局限在别人的框架内部了
  • Bootstrap是UI框架
  • vue是国人弄出来的，官方文档都是中文，学起来比较不麻烦
  • 分清楚 库，框架，构建工具、 插件的作用
    • 需要引用或者调用，就可以直接用，并不会对你做太多约束。那么这种大部分都称之为库。如jQuery
    • 需要按照他的标准构建文件结构或者文件夹结构或者代码书写方式那么这东西可以称之为框架，一般框架都是多种组合在一起的，如React+gulp 或者 jQuery mobile
    • 解决开发过程中重复或者需要自动化智能化完成事情，也就是构建工具，如grunt和gulp
    • 基于 库，框架，工具，提供的补充优化的模块就叫做插件

关于工具

  • gulp是工具链、构建工具，可以配合各种插件做js压缩，css压缩，less编译 替代手工实现自动化工作
  • webpack是文件打包工具，可以把项目的各种js文、css文件等打包合并成一个或多个文件，主要用于模块化方案，预编译模块的方案

关于node

一个让我笑半天的回答
mark

node到底是什么？

  • 让Js也可以做后端
  • Node.js 通过用单线程取代多线程，事件驱动 I/O 来解决了高并发，取代了Java 平台的标准
    • 一个运行JavaScript的平台，可以操作文件、创建网络服务等，并用JavaScript来编写后端服务
    • 事件驱动
    • 非阻塞I/O模型
  • 2009年 Ryan Dahl 开发并开源 ，目的是构建高性能服务器，基于Chrome V8
  • 结合Express实现高可扩展的动态Web服务

示例：

1
2
3
4
5
6
var fs = require("fs");
fs.readFile("./testfile", "utf8", function(error, file) {  
     if (error) throw error;  
     console.log("我读完文件了！");
});
console.log("我不会被阻塞！");

上面代码的输出是：

我不会被阻塞！
我读完文件了！

这个输出显然不符合传统的程序执行顺序，这便是Node.js的非阻塞I/O了。即I/O操作不会阻塞程序的执行，也就是在I/O操作的同时，继续执行其他代码（这得益于Node的事件循环机制）。

Express

Node.js的Web框架

  • Express是一个简洁、灵活的Node.js Web应用开发框架, 它提供一系列强大的功能，比如：模板解析、静态文件服务、中间件、路由控制等。
  • 本质上是一个npm包，所以安装：npm install express