前端框架那些事儿

自 2010 年开始到现在, 都有过哪些前端的框架, 有哪些是名噪一时的, 哪些是到现在还有良好的发展和活跃性的?

现在比较活跃的框架, 各自都有哪些优势, 特点是什么.

怎么从代码上, 一眼就看出来是用的那个框架进行开发的?

前端的生态系统都有哪些, 比如用什么样的插件管理工具(npm, yarn, yo?), 自动编译工具(gulp, grunt, webpack?)

本来这些问题是邀约一个大牛朋友来写一下的, 但是近来抽不得空, 所以个人小总结一下, 十分抽象:

前端框架

VueJS(https://cn.vuejs.org/), AngularJS, ReactJS(http://react-china.org/)/ReactNative, Redux(Flux)…

参考: http://todomvc.com/

前端工具

• yeoman，项目结构模板
• webpack，代码打包工具 https://webpack.js.org
• grunt/gulp, 流程构建工具，和 webpack 有一定交集，但是定制性更强

参考: https://www.cnblogs.com/zs-note/p/7093339.html

前端模块管理器

• Bower: 管理模块(类似 npm 有自己仓库, 也可以类似 go 加载 git) https://bower.io/
• Browserify: 将服务器代码编译成前端代码 http://browserify.org/
• Component: 将页面需要的 js/css/img/font 放到一个目录下
• Duo: 借鉴 Browserfy 和 Component, 支持 js 和 css 编译.

参考: http://www.ruanyifeng.com/blog/2014/09/package-management.html

前端的 CSS 演变

CSS, SASS(SCSS), LESS…

SASS(SCSS)教程: https://www.w3cplus.com/sassguide/syntax.html