前端设计组知识矩阵高级篇

知识矩阵

一、前端开发库

1. AngularJS

AngularJS是为了克服HTML在构建应用上的不足而设计的。HTML是一门很好的为静态文本展示设计的声明式语言，但要构建WEB应用的话它就显得很吃力，可以使用AngularJs进行改善。
学习社区：
AngularJS中文社区：http://www.apjs.net/
AngularJS英文文档：http://docs.angularjs.cn/api
Mooc教育课程:《使用AngularJS开发下一代Web应用》

2. SeaJS

Sea.js遵循CMD规范，具有以下两个特性：

简单友好的模块定义规范：Sea.js 遵循 CMD 规范，可以像 Node.js 一般书写模块代码。
自然直观的代码组织方式：依赖的自动加载、配置的简洁清晰，可以让我们更多地享受编码的乐趣。

可以实现JavaScript的模块化开发及加载机制,具有良好的兼容性。

Chrome 3+ ✔
Firefox 2+ ✔
Safari 3.2+ ✔
Opera 10+ ✔
IE 5.5+ ✔

具体和更加详细的资料可以参考官方教程 http://seajs.org/docs/

3. React

React起源于Facebook,具有的特性：

3.1只是UI

许多人使用 React 作为 MVC 架构的 V 层。 尽管 React 并没有假设过你的其余技术栈， 但它仍可以作为一个小特征轻易地在已有项目中使用

3.2虚拟DOM

React为了更高超的性能而使用虚拟DOM作为其不同的实现。 它同时也可以由服务端Node.js渲染 － 而不需要过重的浏览器DOM支持

3.3数据流

React实现了单向响应的数据流，从而减少了重复代码，这也是它为什么比传统数据绑定更简单。

3.4 其他特性

对于更加详细地了解可以参考展望2016，React.js 最佳实践 (中英对照版)
React官方网站：http://facebook.github.io/react/
中文社区：http://reactjs.cn/
阮一峰《React入门示例教程》

4.NodeJS

Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。Node.js 使用了一个事件驱动、非阻塞式 I/O 的模型，使其轻量又高效。Node.js 的包管理器 npm，是全球最大的开源库生态系统。
官方网站：https://nodejs.org/en/
中文网站：http://nodejs.cn/
imooc：《进击Node.js》
书籍推荐：《深入浅出NodeJS》、《Nodejs实战》
Node.js的学习资源、教程和工具

5.jQuery

js库，直接参考官方网站：jQuery

6. Vue

官方网站：vuejs官网
一套构建用户界面的 渐进式框架。与其他重量级框架不同的是，Vue 采用自底向上增量开发的设计

二、团队协作

常见的版本控制管理工具有git和svn。
Git是目前最火的分布式版本控制系统，svn则是集中式版本控制系统。
简单说明一下两者的区别：
分布式：每个人的电脑上都是一个完整的版本库，无需联网也可以工作，容灾性能较好。
集中式：版本库集中存放在中央服务器，工作时需要从服务器拉回最新的版本，然后需要推送自己的代码到中央服务器。
更加具体的区别可以参见廖雪峰《集中式vs分布式》

1.Git

关于git的具体使用可以参考《Git使用》

2.svn

关于svn的具体使用可以参考学习笔记：SVN搭建与使用_崔霄
mooc课程资源：版本管理工具介绍---SVN篇

三、响应式设计

响应式设计简单来说就是适配各种终端的网页设计。这里容易混淆的是自适应设计（responsive web design），国内有些人把响应式设计也翻译为自适应设计，二者有着一些差别。网页发展的一种趋势。
bootstrap也有提供一些响应式布局,除了上官网搜索之外，也可以看一下这门课程《响应式布局》
具体可以参考:《响应式设计总结》
参考书籍：《响应式Web设计实践》、《图解CSS3》

四、前端性能优化

为了提高网页的加载性能，优化用户体验，我们需要对网页代码进行优化，对此我们需要对从我们敲下网址回车后到网页最终完整的呈现在我们面前的过程要有一个清晰的了解。
具体过程可以参考：《学习笔记：浏览器加载和渲染html的顺序》
了解了浏览器加载和渲染HTML的顺序，我们可以有针对性地对前端性能进行优化，优化的一些具体步骤可以查看《学习笔记：前端性能优化_王金伟》,网络上也有很多的资料，还有前端性能优化的Yahoo军规，自行去搜索引擎搜索就可以了。

五、前端自动化流程构建

webpack、Yeoman

六、设计模式

《大话设计模式》、《23 种设计模式》

七、HTTP

1. 基本概述

参考链接《HTTP》

2.三次握手和四次挥手

参考链接: 三次握手和四次挥手

3.状态码含义

2XX 成功

200，表示从客户端发来的请求在服务器端被正常处理了。
204，请求处理成功，但是没有资源返回。主要用于在浏览器不转为显示新文档的情况下，对其进行更新（比如刷新一个表单页面）
206，请求处理成功，返回部分内容，响应报文中包含Content-Range指定范围的实体内容。

3XX 重定向

301，永久性重定向。
302，临时性重定向。
303，表示请求的资源存在着另一个URL，应使用GET方法定向获取请求的资源。
304，表示请求的资源没有改变，可以使用客户端上未过期的资源。
307，临时性重定向，不会从POST变成GET。

4XX 客户端错误

400, Bad Request，表示请求报文中存在语法错误。
401, Unauthorized，表示发送的请求需要有通过HTTP认证。
403, Forbidden,表示请求资源的访问被服务器拒绝了。
404, Not Found，表示服务器上没有请求的资源。

5XX 服务器错误

500, Internal Server Error，表示服务器在执行请求时发生了错误。
503, Service Unavailable，表示服务器暂时处于超负载或者正在进行停机维护，现在无法处理请求。

4.状态码含义

参考文章：《缓存》

八、后端知识

不懂后端的前端不是一个好的工程师。我们需要对后端有一定的了解。

1. PHP

课程推荐《PHP入门篇》、 《PHP进阶篇》

2. C#

推荐书籍：《C#入门经典》

3.JAVA

推荐书籍：《Java核心技术 卷Ⅰ》 《Java核心技术 卷 Ⅱ》

九、算法

推荐网站：LeeCode、牛客网
推荐书籍：《算法导论》、《程序员面试金典》

基础算法：

1. 排序算法
   选择排序、插入排序、归并排序、冒泡排序、桶排序、堆排序、快速排序、希尔排序、基数排序
2. 树
   赫夫曼树、平衡二叉树的构建
3. 二叉树
   二叉查找树的构建、插入、删除、查找，二叉树三种遍历遍历、二叉树序列和反序列化
4. 查找算法
   二分查找、平衡查找、散列表
5. 图
   最短路径算法、最小生成树
6. 字符串
   KMP算法、BM查找
7. 链表
   链表的增删改查

十、数据结构

《大话数据结构》
掌握知识要点：链表、队列、堆栈、树、图
常与算法相结合学习

十一、测试

单元测试：Mocha