# Fronted Study Path

**Repository Path**: Zincox/Fronted-Study-Path

## Basic Information

- **Project Name**: Fronted Study Path
- **Description**: 大前端学习路径 & 资料分享
- **Primary Language**: Unknown
- **License**: AFL-3.0
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 1
- **Forks**: 0
- **Created**: 2020-01-08
- **Last Updated**: 2021-12-18

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

# 学习资料与指南

## 学习路径和学习方法类

-   [最好的交友网站和学习网站](https://github.com/)
-   [免费计算机书籍推荐](https://github.com/justjavac/free-programming-books-zh_CN) 何乐而不为呢
-   [如何正确学习 Node.js](https://github.com/i5ting/How-to-learn-node-correctly)

## 网页三剑客入门

-   [MDN 学习 Web 开发（四星）](https://developer.mozilla.org/zh-CN/docs/Learn) 基础中的基础，权威中的权威。

-   [Google Chrome Dev Tools 官方文档（五星）](https://developers.google.com/web/tools/chrome-devtools) 还在用 `console.log` 调试呢？Dev Tools 了解一下（包含硬核英文，但写的很好很简单）

-   [快餐式的 Google Chrome Dev Tools 视频教程（三星）](https://www.bilibili.com/video/av27548799?from=search&seid=16354635888144276138) 其实也 OK，但有时间还是推荐看一看官方文档，毕竟会一直更新

## JavaScript 核心

-   [阮一峰 JavaScript 核心教程 （五星必学）](https://wangdoc.com/javascript/) JavaScript 基础教程，接地气。掌握要求基础对象、函数、原型链继承、BOM、DOM、事件操作，不要跳过内容。

-   [阮一峰 ECMAScript 6 教程（五星必学）](https://es6.ruanyifeng.com/)] 尽量从头到尾，不要跳过。部分知识需要有 Node 环境，尽量使用 IDE + Node 学习。主要了解 let、解构、Promiseiterator、generator、async、class 和模块化编程

-   [MDN 的 JavaScript 指南（五星）](https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Guide) JavaScript 权威指南，包含 ES6，建议作为 `阮一峰` 辅助资料一同食用。

## JavaScript 高级

-   [JavaScript 数据结构和算法（四星）](https://github.com/trekhleb/javascript-algorithms/blob/master/README.zh-CN.md) 有一点硬核，而且示例有点少，慢慢食用

-   [JavaScript 灵魂拷问（五星）](https://zhuanlan.zhihu.com/p/90017386) 硬核内容，不过非常推荐，非常适合作为*面试题*食用。

## Node 核心

-   [ NodeJS 官方文档（三星）](http://nodejs.cn/api/) 内容较多，建议采用走马观花形式浏览，不要一下子通篇学习。注意各个章节的主要事件和方法，主要需要学习的章节如下：

    -   fs 文件系统
    -   Global 全局变量（在阮一峰教程中有提及）
    -   http 能够简单搭建服务器
    -   Module 懂得模块加载顺序
    -   os 能够对操作系统进行判断
    -   path 对路径拼接，切割路径、获取文件名、获取文件路径
    -   Process env、exit
    -   querystring 在 web 后端经常用于对 url 参数进行解析
    -   stream 比较低级的传输流，类似 Java 内的 Stream，能够使用 stream 传输文件 / 数据
    -   url 对 url 进行操作、获取信息

-   [使用 VS Code 对 Node 进行开发和调试（四星）](https://code.visualstudio.com/docs/nodejs/nodejs-tutorial) 不要老在用 `console.log` 调试啦
-   [语雀 Node.js 专栏](https://www.yuque.com/egg/nodejs)
-   [阮一峰 Node.js 调试](http://www.ruanyifeng.com/blog/2018/03/node-debugger.html)

## WebPack

-   [2020 年再不用 webpack 就不香了（三星）](https://juejin.im/post/5de87444518825124c50cd36)
-   [WebPack 官方指南（四星）](https://www.webpackjs.com/guides/)

## TypeScript

-   [TypeScript 体系调研报告（四星）](https://juejin.im/post/59c46bc86fb9a00a4636f939)
-   [TypeScript 官方文档](https://www.tslang.cn/docs/home.html)

## 前端框架类

### Vue.js

-   [Vue 基础教程](https://cn.vuejs.org/v2/guide/)
-   [Vue 风格指南](https://cn.vuejs.org/v2/style-guide/)
-   [CookBook](https://cn.vuejs.org/v2/cookbook/)
-   [Vue Cli](https://cli.vuejs.org/zh/guide/)
-   [Vue Router](https://router.vuejs.org/zh/)
-   [Vuex](https://vuex.vuejs.org/zh/guide/)
-   [单元测试](https://vue-test-utils.vuejs.org/zh/)
-   [Vue Loader](https://vue-loader.vuejs.org/zh/)
-   [服务端渲染 Nuxt.js](https://nuxtjs.org/)

#### 资源

-   [手摸手，带你用 Vue 撸后台(五星)](https://juejin.im/post/59097cd7a22b9d0065fb61d2)
-   [没有废话的 Vue 高级进阶](https://juejin.im/post/5cd2da7a5188253e8c23baf6)

## 后端框架类

-   [Egg.js](https://eggjs.org/zh-cn/intro/index.html)

## 测试

-   [JavaScript 测试框架 JEST](https://jestjs.io/)

## 闯关学习类

-   [FreeCodeCamp 中文学习](https://learn.freecodecamp.one/) 内容多质量高，学就完了。