harpsword/frontend-learning-map

前端学习路线（TODOs）

前端学习路线

列出需要学习的东西，后续一个一个突破。

夯实基础

• JavaScript 高级程序设计
  • 中文第 4 版
  • English 4th Version
• The Modern JavaScript Tutorial: http://javascript.info/
• JS 权威指南
  • English 7th Version
• HTML 权威指南
  • English Version
• CSS 权威指南
  • English 4th version
• 深入浅出 Node.js
• 拉钩教育学习大纲
• CSS 世界、CSS 选择器世界、CSS 新世界 by 张鑫旭
• CSS 揭秘
• CSS in Depth
• 深入理解 ES6
• Webpack实战：入门、进阶与调优
• JavaScript设计模式与开发实践

官方文档

• https://nodejs.org/en/docs/
• https://webpack.js.org/
• https://eslint.org/
• https://www.typescriptlang.org/docs/handbook/intro.html
• https://babeljs.io/
  • babel release notes: https://babeljs.io/blog/2018/08/27/7.0.0#pure-annotation-support
• https://vuejs.org/
• https://reactjs.org/
• https://lerna.js.org/
• https://vitejs.dev/
• https://expressjs.com/
• https://koajs.com/

熟悉源码

• Vue 源码解析: https://github.com/ustbhuangyi/vue-analysis
• 《深入理解Node.js：核心**与源码分析》: https://github.com/yjhjstz/deep-into-node
• React 源码解析: https://react.jokcy.me/
• https://github.com/KieSun/learn-react-essence
• https://github.com/huyaocode/webKnowledge

勤加练习

• https://github.com/type-challenges/type-challenges

其他学习路线

• https://andreasbm.github.io/web-skills/
• https://github.com/louzhedong/blog

前端面试资料

• https://github.com/lgwebdream/FE-Interview
• https://github.com/haizlin/fe-interview
• https://github.com/youngjuning/react-interview
• https://github.com/ascoders/weekly
• https://lxchuan12.gitee.io/
• https://github.com/yangshun/-end-interview-handbook
• https://github.com/poetries/FE-Interview-Questions
• https://github.com/KieSun/fucking-end
• https://github.com/qianguyihao/Web
• https://github.com/woai3c/Front-end-basic-knowledge
• https://github.com/woai3c/introduction-to-front-end-engineering
• https://github.com/FrankFang/best-chinese-front-end-blogs
• https://github.com/woai3c/Front-end-articles
• https://github.com/febobo/web-interview
• https://github.com/EtherDream/web-frontend-magic
• https://github.com/Molunerfinn/2019-job-hunting
• https://github.com/seognil/fe-foundation
• https://github.com/qiu-deqing/FE-interview
• https://github.com/paddingme/
• https://github.com/huruji/FE-Interview
• Front-end-Web-Development-Interview-Question
• https://github.com/yifeikong/reverse-interview-zh

大佬 & 博客

主要列举目前在知乎、GitHub 等平台活跃的前端大佬，可以定期看看大佬的更新，学习一些新知识

1. 贺师俊: https://github.com/hax, https://www.zhihu.com/people/he-shi-jun
   • 推动国内技术公司加入 TC39 第一人
2. 玉伯: https://www.zhihu.com/people/lifesinger
   • 蚂蚁金服前端 Leader
3. Harttle: https://github.com/harttle
   • 前百度前端搜索 Leader
4. 李松峰: https://www.zhihu.com/people/lisf
   • JS 高级程序设计、深入理解 ES 6 等的译者
5. justjavac: https://github.com/justjavac, https://www.zhihu.com/people/justjavac.com
   • Deno核心贡献者
6. 顾轶灵: https://github.com/Justineo, https://www.zhihu.com/people/justineo
   • vue 的核心贡献者，在百度工作
7. 胖茶: https://github.com/sodatea, https://www.zhihu.com/people/sodatea
   • vue 的核心贡献者
8. antfu: https://github.com/antfu, https://www.zhihu.com/people/antfu
   • vue 的核心贡献者, 著有 slidev, vueuse
9. 谭光志: https://github.com/woai3c, https://www.zhihu.com/people/tan-guang-zhi-19
   • 著有 带你入门前端工程
10. 李玉北: https://github.com/leeight, https://www.zhihu.com/people/li-yu-bei
    • 字节跳动 WebInfra 总负责人
11. egoist: https://github.com/egoist
    • vue 的核心贡献者
    • 很多基础库的开发者，造轮子效率极高
12. 黄子毅: https://www.zhihu.com/people/huang-zi-yi-83, https://github.com/ascoders
    • 著有前端精读周刊
13. 杨健: https://www.zhihu.com/people/hardfist, https://github.com/hardfist
14. HcySunYang: https://github.com/HcySunYang, https://www.zhihu.com/people/hcysunyang
    • vue 的核心贡献者
15. theanarkh: https://github.com/theanarkh, https://www.zhihu.com/people/theanarkh
    • 著有 通过源码分析nodejs原理
16. 杨扬: https://github.com/dexteryy, https://www.zhihu.com/people/dexteryy
    • 字节跳动基础工程大佬，WenInfra 成员
17. 若川视野: https://github.com/lxchuan12, https://www.zhihu.com/people/lxchuan12
    • 若川的博客
18. sshsunlight: https://github.com/sl1673495, https://www.zhihu.com/people/ssh-fe
    • WebInfra 成员，微信公众号「前端从进阶到入院」
19. 黄轶: https://github.com/ustbhuangyi, https://www.zhihu.com/people/huang-yi-50-6
    • Vue 源码解析讲的很不错: https://github.com/ustbhuangyi/vue-analysis
20. 尤雨溪: , https://www.zhihu.com/people/evanyou, https://github.com/yyx990803
    • Vue 创始人
21. 云谦: https://github.com/sorrycc
    • 阿里 umi 维护者
    • 著有 https://github.com/sorrycc/weekly

相关工具

1. https://www.dute.org/keycodes

权威参考

1. https://dev.w3.org/html5/html-author/
2. https://html.spec.whatwg.org/

前端每日一题

督促自己每天完成一个前端打卡题，并在本项目更新~

• 2021-08-31: 防抖和节流
  • 防抖和节流的区别是，防抖一上来就是先等待执行，而节流是先执行了再等待，从代码上可以看到区别，具体适用场景的话，
    • debounce 常用于窗口 resize 和键盘输入，当稳定之后再执行逻辑能够减少资源消耗
    • 如果用户滑到底部发送 API 请求，显然用 throttle 合适，因为 debounce 会对请求进行延迟
• 2021-09-01: 任务队列、事件循环、宏任务、微任务
• 2021-09-04: CSS 居中方案
• 2021-09-05: 开发中常用的 Content-Type
• 2021-09-06: HTTP 2、HTTP 3 有哪些新特性
• 2021-09-07: Vue 的 nextTick 原理
• 2021-09-08: 手写函数式编程代码
• 2021-09-09: React Diff 算法
• 2021-09-10: koa-compose 源码解析
• 2021-09-11: Redux compose 源码解读
• 2021-09-12: css sticky 属性
• 2021-09-13: ES2022: Class static block
• 2021-09-15: canvas 分形
• 2021-09-16: 为什么 esbuild 那么快
• 2021-09-17: update-notifier 源码解析
• 2021-09-19: VSCode WebView 开发架构
• 2021-09-26: validate-npm-package-name 源码解析
• 2021-10-09: create-vue 发布并成为官方推荐
• 2021-10-09: 为什么 React hooks 不能写在 if 判断中