学习路线
前言javascript
基础决定你可能达到的高度， 而业务决定了你的最低瓶颈php
https://www.w3cschool.cn/kesyi/kesyi-gyms24s3.htmlcss
前端知识导航：http://www.fly63.com/navhtml
HTNL验证网站：https://validator.w3.org/check前端
最全前端汇总：https://www.cnblogs.com/best/p/7837790.htmlvue
Nodejs语言自己来讲适合作微服务，快速交付，快速部署，快速启动，不擅长cpu密集型的操做。html5
面对单进程单线程对多核使用率不高的问题，按照以前的经验，每一个进程各使用一个CPU便可，以此实现多核CPU的利用。Node提供了child_process模块，而且也提供了fork()方法来实现进程的复制(只要是进程复制，都须要必定的资源和时间。Node复制进程须要不小于10M的内存和不小于30ms的时间)。java
1、 技术清单node
包管理工具：npm、 bower、component、spmpython
前端构建工具：grunt、 gulp
模块加载器：requirejs、 webpack 、jspm(systemjs)
前端框架：vue.js 、 react 、angular
后端框架：Express 、 Meteor
代码规范：ES5/ES6/ES7 Common.js 、 AMD
语法糖：Coffeescript、 Typescrit（不少人在使用）、 Dart..
Css预编译器：Sass、 Styluss、 less、 postCSS
浏览器引擎：Webkit、 Gecko、 Trident
模板引擎：handlerbar 、 swig 、 nunjucks、 ejs 、 jade
webAPP: SPA、 Isomorphic
协议：http、 websocket
移动端UI框架：bootstrap 、 AUI（不少css3特性的使用）、 Frozen UI(qq酷炫界面)
先后端交互方式：服务器端渲染、Ajax 、websock
数据请求：axios(项目推荐使用axios封装的fetch)
后端语言：node.js 、python 、 java （推荐使用在node上使用Express框架作后端开发）
完善的HTML模板：HTML5 Boilerplate
微服务框架：Seneca
nginx:一个专一于高并发与低内存消耗的Web服务器。
node进程工具：PM2(管理性能监控、自动重启、负载均衡等)
移动端布局：flex
浏览器兼容
前端测试：Jest方案
ES6:https://coding.imooc.com/class/98.html
桌面应用开发：electron
移动端开发：react native
网页性能优化：https://coding.imooc.com/class/130.html
webpack前端工程化：https://coding.imooc.com/class/171.html
html、css代码规范：https://codeguide.bootcss.com/
js知识点框架图：http://www.lisa33xiaoq.net/1253.html
RESTful API ：http://www.ruanyifeng.com/blog/2018/10/restful-api-best-practices.html
Vue2.5开发去哪儿网App 从零基础入门到实战项目: https://coding.imooc.com/class/203.html
Vue全家桶+SSR+Koa2全栈开发美团网：https://coding.imooc.com/class/280.html
Redux+React Router+Node.js全栈开发: https://coding.imooc.com/class/150.html
React 16.4 开发简书项目 从零基础入门到实战: https://coding.imooc.com/class/229.html
结合基础与实战学习React.js 独立开发新闻头条平台: https://coding.imooc.com/class/83.html
React16+React-Router4 从零打造企业级电商后台管理系统: https://coding.imooc.com/class/179.html
网页性能优化：https://www.imooc.com/article/49244
渲染机制：https://baijiahao.baidu.com/s?id=1593097105869520145&wfr=spider&for=pc
node后端开发：
https://github.com/nswbmw/N-blog
https://github.com/alsotang/node-lessons/blob/master/lesson4/README.md
node调试：https://github.com/nswbmw/node-in-debugging
简历：https://github.com/geekcompany/ResumeSample
画布设计工具：
从零作一个前端开源项目：https://www.imooc.com/article/28240
idea破解
http://www.javashuo.com/article/p-gwhyuxpm-mw.html
node开发知识图谱：http://naotu.baidu.com/file/713825603df750aa9cfafb9c42d9dd00?token=d008a5078079aa29
H5桌面应用程序：https://blog.csdn.net/u013314786/article/details/83278374
如下是简单的使用说明
前端学习路线图：由前端教学经验至关丰富的老师梳理而成，知识由浅入深，按部就班。自学前端，按照这份学习路线图学习就能够了！
视频篇：根据学习路线图搭配了相应的视频、源码资源。部分资源还在玩命更新中，请稍安勿躁，静候更新。
工具篇：精心收集了40多款前端流行框架、开发工具、手册、插件、模板引擎。市场上经常使用的、最新的几乎都在这了！
经验篇：前端前辈的经验之谈，给你的学习助上一臂之力！
面试篇：前端技术面试题汇总+非技术面试题完美解答。今后再也不怕HR的刁难，看过的都说好！
所有资源只赠有缘人，拿走，还不用谢～另外，这份资源会一直更新，须要的同窗持续关注吧！
1、前端学习路线图
2、前端学习路线图——视频篇
| 六大
阶段 |
学完后目标 |
知识点 |
视频资源(附笔记+PPT+模板
+源码) |
密码 |
| 准备篇 |
学习周期：15天
学完后目标： 一、熟悉媒体查询和响应式设计，使得设计有适配不一样的移动; 二、熟悉基础CSS的格式和CSS盒模式; 三、理解网页间是如何连接的、如何设计多列布局，能够处理表单字段和媒体元素; 四、理解如何建立和浏览一个基本的网页。
市场价值： 熟练掌握以后，能够知足市场静态页面布局，可是市场就业工资相对较低，还需继续往下学习。 |
开发工具的安装配置的介绍 sublime、webstorm、Visual Studio Code |
正在玩命更新中 | |
| HTML 理解如何浏览和建立网页、基本的语法规范、经常使用标签及属性、网页之间的连接与跳转、标签节点层级节点 |
pt2p bya5 |
|||
| CSS 基本语法和三种书写位置、选择器和格式化排版、盒模型的高级用法、经常使用布局模型 |
ha3i u7k1 isx8 6scx |
|||
| 基础语法和变量、数据类型和数据类型转换、条件判断、循环语句、函数、数组等内置对象 |
t4bw 3w93 |
|||
| 京东首页实战 CSS代码抽象与复用、 浮动的盒子布局、padding 和 margin 使用、层级的使用、定位特性的各类使用场景 |
正在玩命更新中 |
|||
| 基础篇 |
学习周期：20天
学完后目标： 一、可以基于jQuery实现炫酷效果和复杂的功能模块； 二、能创造或添加自定义效果到网页上； 三、能熟练添加标准的动画效果到网页上； 四、熟练操做DOM模型。
市场价值：8-13K |
JavaScript基础 JS语言的基本构成、变量、数据类型、表达式、选择结构、循环结构、短路语句、函数基础 |
98ef p23z |
|
| DOM + BOM DOM基本结构、节点对象的操做、事件特性及使用、常见的内置DOM对象、常见的BOM功能 |
正在玩命更新中 |
|||
| 网页特效与进阶 在网页特效中经常使用的编程接口、动画编程、事件对象和冒泡、缓动框架封装和旋转木马案例、正则表达式及应用 |
正在玩命更新中 |
|||
| Jquery 选择器、基本操做API、动画API、事件API、插件机制、原理分析、项目实战 |
正在玩命更新中 |
|||
| 核心篇 | 学习周期：20天
学完后目标： 一、可以基于jQueryMobile/Zepto等框架进行移动端js功能开发； 二、可以熟练使用HTML5/CSS3/ canvas进行移动端页面和功能效果开发，而且可以基于原生和框架进行响应式效果开发； 三、可以基于jQuery、bootstrap等框架实现炫酷效果和复杂的功能模块； 四、可以独立制做电商类，企业类网站，以及常见js动态效果。
市场价值：13K-18K |
Html5 + CSS3 语义化结构、多媒体 、本地存储、其余常见API、CSS3 选择器、CSS3 边框、背景、阴影、CSS3 过渡和动画、CSS3 伸缩布局、Canvas |
v53j | |
| 服务端编程 端的概念、Web 服务器的概念、服务器搭建、XML与JSON |
正在玩命更新中 | |||
| PHP基础语法 、PHP服务端编程基础 |
正在玩命更新中 | |||
| AJAX 基本编程接口、异步数据交互、模板引擎的使用、跨域的实现方案、增量加载 |
hj8n | |||
| 移动Web开发 响应式布局、Bootstrap框架深度使用、Zepto.js库、预编译CSS |
n6mi eq37 |
|||
| 进阶篇 |
学习周期：15天
学完后目标： 一、熟练使用闭包、高级函数、当即执行函数(匿名函数)等； 二、熟练使用元编程，解决Callback等； 三、熟悉JavaScript基本语法。
市场价值：18-22K |
面向对象在JS中的体现与实践 面向对象理论、对象的基本概念、对象的属性和方法、经过字面量建立对象 |
nwu6 8x2y |
|
| 开发过程当中经常使用的模式与思想 开闭原则、MVC思想、高内聚低耦合、工厂模式 |
正在玩命更新中 | |||
| JavaScript高级特性 经过构造函数建立对象、原型对象、继承的多种实现方式、原型链、函数的本质以及 Function 构造函数、做用域链、闭包、沙箱模式 |
正在玩命更新中 | |||
| 封装一个本身框架 选择器框架、CSS操做封装、属性操做封装、其余DOM操做的封装、事件框架的封装 |
|
kcv9 |
||
| 高级篇 | 学习周期：20天
学完后目标： 一、了解主流的后台技术和先后端协做方式，从全局角度理解项目的整个生命周期； 二、熟悉nodejs的全栈式解决方案； 三、从前端的全局角度认识相关的框架； 四、熟练使用VueJS，AngularJS等框架完成复杂的前端功能，熟悉前端工做流。
市场价值：22K+ |
前端工做流 自动化流程工具使用、源代码版本控制工具使用、依赖项管理工具、项目模板脚手架 |
正在玩命更新中 | |
| 流行框架 Angular基本使用、Angular高级特性、VueJS基本入门和路由、项目实战：豆瓣电影 |
正在玩命更新中 | |||
| 模块化开发 模块化开发规范、经常使用的模块化开发工具、RequireJS、AMD/CMD、统一规范UMD、SeaJS |
正在玩命更新中 | |||
| NodeJS Node介绍、基本操做、经常使用内置模块、高级特性、经常使用框架 |
正在玩命更新中 | |||
| 移动 APP 开发 |
学习周期：8天
学完后目标： 一、深入理解移动App的开发模式和技术选型； 二、熟练使用各类模式开发移动应用； 三、了解微信企业公共号开发。 市场价值：22K+ |
混合式应用开发 混合式平台架构、混合式开发实践、京东APP端实战 |
正在玩命更新中 | |
| 微信公共号介绍、平台API对接、X5兼容处理、内置接口 |
正在玩命更新中 | |||
| 组件化思想、基本使用、核心特性、JSX、TODOMVC案例 |
正在玩命更新中 |
|||
| 环境与工具、实现思路、经常使用组件、经常使用插件、综合案例：豆瓣电影 |
正在玩命更新中 | |||
| 移动其余APP开发框架 PhoneGap、AppCan、HTML5+、Framework7 |
正在玩命更新中 |
3、前端学习路线图——工具篇
4、前端学习路线图——经验篇
5、前端学习路线图——面试篇
| 前端面试 宝典 |
技术篇 | 大牛教你如何写出优秀的前端工程师简历 | http://bbs.itheima.com/thread-318331-1-1.html | 无 |
| 近期整理前端面试题，供你们参考 | http://bbs.itheima.com/thread-330105-1-1.html | 无 | ||
| 前端开发工程师面试题 | http://bbs.itheima.com/thread-330106-1-1.html | 无 | ||
| 百度2016校招笔试题（含答案、解析） | http://bbs.itheima.com/thread-330107-1-1.html | 无 | ||
| 前端面试常见问答 | http://bbs.itheima.com/thread-330633-1-1.html | 无 | ||
| 超实用的前端面试题 | http://bbs.itheima.com/thread-330627-1-1.html | 无 | ||
| 薪资篇 | 面试官如何评判应聘者的工资 | 无 | ||
| 当HR问“你对薪资有什么要求”时怎么回答 | ||||
| HR指责要薪过高怎么办？ | ||||
| 自我介绍篇 | 如何进行自我介绍？ | 无 | ||
| “你有什么优劣势？” | ||||
| “你为何选择咱们公司？” | ||||
| 项目篇 | 如何介绍简历中的项目？ | http://bbs.itheima.com/thread-330110-1-1.html | 无 | |
| HR贬低项目时你该怎么办“ | ||||
| 项目经验少该怎么办？ | ||||
| 学历年龄篇 | 你学历低，为何要录用你？ | http://bbs.itheima.com/thread-330111-1-1.html | 无 | |
| 你是否是年龄太大了？ | ||||
| 你过小了，你能承担项目吗？ | ||||
| 规划篇 | 你准备在咱们这家单位作多久？ | http://bbs.itheima.com/thread-330112-1-1.html | 无 | |
| 将来五年的规划是怎样的？ | ||||
| 以上资源合并下载 | byn6 | |||
前端小白到大牛的华丽变身，学上面的资源就足够了！
最后分享阮一峰大神的技术总结日志链接：http://www.ruanyifeng.com/blog/javascript/
web前端深刻学习路线
1、高级基础部分
1.ES6/ES7语法和原理实现
2.异步发展过程：callback、promise、generator、co、async/await等异步流程控制(async和await的实现原理)
3.promise设计模式原理及在es6中的应用，手写一个符合promise A+规范的promise实现
4.Node基础与实战
5.Node事件原理和发布定阅设计模式
6.函数式编程
2、模块化的演进
1. JavaScript模块化发展的演进历史 CommonJS、AMD、CMD、ES6模块的演进历史
2. 目前最主流的模块化实现方案: CommonJS 到 ES Module
3. 手写 CommonJS 的简单实现
3、前端工程化构建工具
1.gulp的基本用法以及实现原理
2.经常使用插件(压缩、合并、编译、预览服务、自动注入)
3.node.js中自定义流的高级用法
4.实现自定义插件(auto-prefixer)
5.webpack基本用法以及运行原理
6.常见的loader以及plugin(DllPlugin等)
7.Webpack工做原理分析
8.编写自定义Loader、编写自定义Plugin
9.webpack优化(resolve、模块热替换、压缩、代码分割、可视化工具)
四.React全家桶
1.react
1.为何采用组件化的方式
2.react环境搭建
3.JSX语法的使用(createElement,render的原理实现)
4.JSX表达式的用法
5.JSX的属性(className,htmlFor,style,dangerouslyInnerHTML)
6.组件使用(类声明,函数声明)
7.组件的属性和状态(属性的检验以及setState详解)
8.复合组件
9.组件的声明周期
10.受控组件 非受控组件
11.children属性的使用
12.项目实战留言板
2.redux
1.手写redux库(getState,createStore,dispatch,subscribe,applyMiddlewar
e,combineReducer,compose,bindActionCreators)
3.react&redux
1.高阶组件的原理和使用
2.react高级属性context上下文
3.react-redux实现todoList
4.手写react-redux(Provider和connect原理解析)
4.中间件
● 1.react
● 1.为何采用组件化的方式
● 2.react环境搭建
● 3.JSX语法的使用(createElement,render的原理实现)
● 4.JSX表达式的用法
● 5.JSX的属性(className,htmlFor,style,dangerouslyInnerHTML)
● 6.组件使用(类声明,函数声明)
● 7.组件的属性和状态(属性的检验以及setState详解)
● 8.复合组件
● 9.组件的声明周期
● 10.受控组件 非受控组件
● 11.children属性的使用
● 12.项目实战留言板
● 2.redux
● 1.手写redux库(getState,createStore,dispatch,subscribe,applyMiddlewar e,combineReducer,compose,bindActionCreators)
● 3.reactredux
● 1.高阶组件的原理和使用
● 2.react高级属性context上下文
● 3.react-redux实现todoList
● 4.手写react-redux(Provider和connect原理解析)
● 4.中间件
● 1.手写applyMiddle和compose(中间件原理)
● 2.手写redux-logger,redux-thunk,redux-promise
● 3.手写自定义本地缓存中间件
● 5.reactrouterdom
● 1.HashRouter,BrowserRouter的区别
● 2.Link,NavLink的使用(extact绝对匹配,state带参数跳转)
● 3.Route组件三种渲染方式(component,render,children)
● 4.路由参数以及子路由的使用(params)
● 5.withRouter,PrivateRouter的用法
● 6.Prompt组件阻止跳转
● 7.重定向(Redirect组件)
● 8.手写HashRouter Route等经常使用组件
● 6.ReactTransitiongroup
● 1.react动画的实现原理
● 2.使用React-Transition-group库开发todo动画应用
● 7.项目实战React珠峰课堂1.0
● 1.webpack环境搭建
● 2.底部页签导航
● 3.动画
● 4.redux改变课程分类
● 5.实现头部轮播图
● 6.课程列表列表
● 7.下拉刷新
● 8.上拉加载
● 9.记录滚动条位置
● 10.课程详情页面
● 11.用户注册
● 12.用户登陆
● 13.受保护的个人课程页面
● 14.Redux开发插件
● 8.源码级Vue+React深度解析与实现
● 1.手写Vue双向绑定实现
● 2.Vue虚拟DOM和React虚拟DOM的区别
● 3.如何实现一个 Virtual DOM 算法
● 4.经过源码完全搞明白setState的更新机制
● 5.手写包含虚拟DOM、事件监听、基本组件生命周期等功能的React库
五.node高级
● 1.http深刻和tcp详解
● 1.七层网络协议分析
● 2.TCP链接和Nagle算法
● 3.使用wireshark学习七层网络协议
● 4.DNS服务器详解
● 5.Node静态服务器实现与缓存机制的实现
● 6.HTTP经常使用报文的实际应用
● 7.Node Stream的应用与文件分片上传策略
● 8.RestfulAPI设计和使用
● 9.CDN和OSS的使用
● 10.HTTPS安全通讯过程分析
● 2.Express
● 1.手写express框架
● 2.中间件的实现原理、bodyParser、cookie-parser、static、模板原理
● 3.Koa
● 1.手写Koa框架
● 2.中间件的实现原理、bodyParser、cookie-parser、static、模板原理
● 4.Linux
● 1.Linux介绍
● 2.Linux文件和目录
● 3.Linux用户和组权限
● 4.Linux命令
● 5.Shell脚本
● 5.Mongodb
● 1.Mongodb安装和使用
● 2.Mongodb的系统架构
● 3.Mongodb高级查询
● 4.Mongodb索引
● 5.Mongodb安全与权限
● 6.mongoose模块之Schema
● 7.mongoose模块之Model
● 8.使用Model对文档进行增删改查
● 6.珠峰博客(express+mongodb+mongodb)
● 基于bootstrap+express+mongodb实现一个包括用户管理、文章管理、多看留言、分页查询、 搜索、文件上传、pv留言统计等功能完整的博客系统。使用了express的路由、ejs模板和serve-favicon、 morgan、cookie-parser、body-parser、express-session、connect-mongo、connect-flash、uuid、 async等内置各类中间件以及其它发路径保护等自定义中间件，并扩展了富文本编辑器、markdown和heroku云布署等功能。
● 1.项目初始化
● 2.用户管理
● 3.文章管理
● 4.分页查询
● 5.搜索
● 6.文件上传
● 7.PV留言统计
● 7.珠峰聊天室项目实战(react+socket.io+mongodb)
● 1.什么是实时通讯
● 2.什么是Websocket
● 3.websocket和http的对比
● 4.使用socket.io实现聊天室
● 5.匿名聊天
● 6.有用户名的聊天和用户列表
● 7.用户私聊
● 8.划分不一样的聊天房间
● 9.消息持久化
● 10.支持QQ表情
● 8.MySQL
● 1.MYSQL安装与使用
● 2.MYSQL系统架构
● 3.数据处理之增删改查
● 4.数据类型和约束分页
● 5.索引和慢查询性能分析
● 6.数据库安全之防止SQL注入
● 9.珠峰爬虫(cheerio+request+mysql)
● 1.发出HTTP请求获取指定URL中的内容
● 2.使用cheerio的语法操做网页元素，提取须要的元素
● 3.将数据保存到mysql数据库中
● 4.创建web服务器显示这些数据
● 5.使用计划任务自动执行更新任务
● 6.布署项目到阿里云中并配置反向代理
● 10.Redis
● 1.Redis安装和使用
● 2.5种数据结构及使用场景
● 3.API的理解和使用
● 4.Redis客户端
● 11.Nginx
● 1.nginx的安装和使用
● 2.模块和基本配置
● 3.正向反向代理等应用场景
● 12.Docker
● 1.Docker介绍和安装
● 2.Dockerfile
● 3.存储和镜像仓库
● 4.Dock实战
● 13.单元测试
● 1.测试用例和需求分析
● 2.单元测试框架mocha/ava
● 3.自动化测试之selenium
● 14.集群和负载均衡
● 1.cluster的工做原理和负载均衡算法
● 2.pm2工具
● 15.前端性能监控与性能优化、行为监控与安全防范
● 1.针对重绘重排的优化策略
● 2.如何发现性能短板与各个短板的优化
● 3.前端埋点上报
● 4.前端错误上报
● 5.前端性能上报
● 6.前端行为监控上报
● 7.前端恢复上线与A/B测试
● 8.网络缓存技术分析
● 9.浏览器渲染过程分析(DOM树、RenderObject、绘图上下文)
● 16.项目部署
● 1.npm script工做流
● 2.shell脚本布署
● 17.安全
● 1.XSS的原理与代码实战
● 2.CSRF的原理与代码实战
● 18.功能测试与性能测试
● 1.测试用例和需求分析
● 2.经常使用功能测试框架基础使用(mocha/ava)
● 3.经常使用性能测试框架基础使用(Benchmark)
● 19.全链路优化
● 1.DNS优化
● 2.请求速度优化
● 3.渲染优化之 JS css image html
● 4.缓存优化
● 5.服务器优化
● 6.数据库优化
6、前端设计模式(选讲)
● 建立型设计模式
● 1.工厂模式
● 2.建造者模式
● 3.原型模式
● 4.单例模式
● 结构型设计模式
● 1.外观模式
● 2.适配器模式
● 3.代理模式
● 4.装饰者模式
● 5.组合模式
● 行为型设计模式
● 1.观察者模式
● 2.状态模式
● 3.策略模式
● 4.命令模式
● 5.访问者模式
● 6.中介者模式
● 5.迭代器模式
7、算法&数据结构(选讲)
● 1.时间复杂度
● 2.空间复杂度
● 3.常见排序算法
● 1.冒泡排序、优化
● 2.选择排序
● 3.插入排序
● 4.归并排序
● 5.快速排序式
● 6.计数排序
● 7.桶排序
● 8.基数排序
● 4.链表(链表反转、链表是否有环)
● 5.树(高度、前序、中序、后序、广度优先算法、反转)
● 6.二叉树搜索算法
● 7.青蛙跳台阶问题-动态规划算法
● 8.React虚拟DOM Diff算法实现