TopView 大前端暑假学习计划

欢迎加入 TopView 大前端 :kissing:

First of All

遇到问题若解决不了（先google），请在 GitHub 上提交issue :metal:
每天结束之前都要在这个git仓库里面提issue，有例子可看，嗯！是每天。（仓库里面有格式例子哦）:clap::clap:
每周之后，请把每周学习到的东西整理成Mark Down，每周上传自己的学习笔记，也可以把自己写的demo源码上传到本 repo 对应自己创的文件夹. 例子请看 Week1 文件夹。:notes:
注意培养正确的代码规范，具体代码规范参考 this
该学习路线将会花费 4周的时间! 时间自行安排 :smiling_imp:
太长不看

整个学习路线会用到下面的资源:

第一周比较轻松~ 涉及的内容有JavaScript的介绍, 数据类型, 表达式以及运算，以及简单了解下的CSS的flex布局，还有Git。

Source	Tasks
Free Code Camp	Getting Started, HTML5 & CSS, Responsive Design with Bootstrap 部分
FlexboxFroggy	先看这个然后尝试完成flexbox那个网站的题
GRID GARDEN	grid 种菜小游戏
JavaScript高级程序设计	前言, 第1章和第2章
Free Code Camp	`Basic JavaScript` 部分
JavaScript高级程序设计	第3章, 第4章(可以跳过位操作符部分内容)
自己 google	学会调试 JavaScript 。建议使用 Chrome 的 DevTools (开发者工具)
Free Code Camp	Basic Front End Development Projects 部分（选做）
Git	廖雪峰的Git教程

涉及的内容有对象，数组，函数，DOM 以及 jQuery 。

Source	Tasks
JavaScript 高级程序设计	第6章
Free Code Camp	Object Oriented and Functional Programming 部分
JavaScript 高级程序设计	第5章和第7章

看这篇了解一下JS的一些执行机制

可参考例子：todoMVC 。

内容有 Ajax, 正则表达式，window 对象，事件，以及 jQuery:speech_balloon:

涉及了JS模块化，类，继承，ES6(ES2015), 路由, 以及多个小项目。

Source	Tasks
JavaScript 高级程序设计	第6，16，22，24章。这也许是最有技术性的一次阅读了，如果没看懂先跳过:no_good:，日后再看可好
Free Code Camp	Basic Algorithm Scripting 部分（复习 JavaScript）
ECMAScript 6入门	学习 ES2015
null	再次优化你的 Todo 项目。添加新功能，或者重构代码
Free Code Camp	Intermediate Front End Development Projects 前3个

至于模块化：可以了解一下JS史前模块化的实现 AMD(requireJS) 和 CMD(seaJS)，学习现在JS模块化的实现，ES6的Module实现的模块化

关于路由：去google了解一下前端路由的好处和前端路由解决了什么问题。这个东西以后大家都会继续接触，不必着急一时全弄懂。

由于现在前端的技术还不是很成熟，因此发展会日新月异:feet::feet:

所以啊，我们要时刻保持对知识的饥饿感！！！:yum::yum:

Recommend	Type	Description
4	浏览器的兼容	对主流浏览器的兼容
5	JS 框架	React, Angular, Vue 等
5	打包工具	Webpack，Gulp等
5	代码规范	使用eslint等
5	JavaScript	ES2015 (如何使用？`babel`)
4	CSS 预处理器	Sass, Less等
3	服务器语言	Node.js 等
4	计算机网络	HTTP 相关知识
4	微信小程序	`文档` `mpvue`
5	社区	GitHub Trending, Reddit, Medium, 订阅 JavaScript Weekly, 微博 & Twitter & 掘金等