2019前端练级攻略

2019 前端练级攻略

对于前端的学习和提高,我的基本思路是这样的。首先,前端的三个最基本的东西 HTML5、CSS3 和 JavaScript(ES6)是必须要学好的。这其中有很多很多的技术,比如,CSS3 引申出来的 Canvas(位图)、SVG(矢量图) 和 WebGL(3D 图),以及 CSS 的各种图形变换可以让你做出非常丰富的渲染效果和动画效果。

ES6 简直就是把 JavaScript 带到了一个新的台阶,JavaScript 语言的强大,大大释放了前端开发人员的生产力,让前端得以开发更为复杂的代码和程序,于是像 React 和 Vue 这样的框架开始成为前端编程的不二之选。

我一直认为学习任何知识都要从基础出发,所以我会有很大的篇幅在讲各种技术的基础知识和基本原理,尤其是如下的这些知识,都是前端程序员需要一块一块啃掉的硬骨头。

  • JavaScript 的核心原理。这里我会这里重点需要掌握的知识点而不是书。
  • 浏览器的工作原理。这也是一块硬骨头,我觉得这是前端程序员需要了解和明白的东西,不然,你将无法深入下去。
  • 网络协议 HTTP。也是要着重了解的,尤其是 HTTP/2,还有 HTTP 的几种请求方式:短连接、长连接、Stream 连接、WebSocket 连接。
  • 前端性能调优。有了以上的这些基础后,你就可以进入前端性能调优的主题了,我相信你可以很容易上手各种性能调优技术的。
  • 框架学习。我只给了 React 和 Vue 两个框架。就这两个框架来说,Virtual DOM 技术是其底层技术,组件化是其思想,管理组件的状态是其重点。而对于 React 来说,函数式编程又是其编程思想,所以,这些基础技术都是你需要好好研究和学习的。
  • UI 设计。设计也是前端需要做的一个事,比如像 Google 的 Material UI,或是比较流行的 Atomic Design 等应该是前端工程师需要学习的。

原文链接给出的都是要看的文章或图书, 我这里整理各个知识点
程序员练级攻略(2018):前端基础和底层原理 666

JavaScript 的核心原理

变量

  1. 数据类型、判断方法
  2. 执行上下文
  3. 变量对象、活动对象
  4. 原型、原型链 javascript原型
  5. 作用域、作用域链 js作用域链和闭包 再谈js作用域 静态作用域与动态作用域
  6. 闭包、垃圾回收机制
  7. this 指向 javascript中this指向由函数调用方式决定
  8. 类和模块
  9. 继承
  10. 函数式编程
  11. 同步异步 JavaScript-的-async-await async-function-await 使用Promise
  12. JS 正则表达式
  13. 事件模型 js事件处理
  14. Ajax、跨域访问 前端的网络请求方式和http
  15. DOM
  16. BOM
js函数 js的数组

CSS3

HTML

浏览器的工作原理

这个文章说的总纲 从输入URL到页面加载发生了什么
chrome的console功能

网络协议 HTTP

http3xx重定向状态码 CDN原理 DHCP原理

前端性能调优

框架学习

React

react-router-v4 react-router React项目结构和组件命名之道 travis配置文件的编写 tsconfig-json配置解析 webpack简单入门

UI 设计

总结下不同实际项目开始的准备, 不用 CLI

比如用 typescript 和 webpack 来写 react 项目.

prettier代码格式美化

其他

docker: docker的简单使用

git: git入门中 常用git命令总结

参考

程序员练级攻略(2018):前端基础和底层原理 666
2019-TODO-list
JavaScript 完全手册(2018版)这网站真的很不错6666666