# mind-map

**Repository Path**: tasmilen/mind-map

## Basic Information

- **Project Name**: mind-map
- **Description**: VUE3 ES6 脑图
源：https://github.com/jCodeLife/mind-map.git
- **Primary Language**: JavaScript
- **License**: Not specified
- **Default Branch**: master
- **Homepage**: None
- **GVP Project**: No

## Statistics

- **Stars**: 4
- **Forks**: 4
- **Created**: 2021-09-07
- **Last Updated**: 2023-07-10

## Categories & Tags

**Categories**: Uncategorized

**Tags**: None

## README

### 简介

`mind-map` 是个人学习路上的一些小结

当前进度： 

`5/85`

已完成：

[![](https://img.shields.io/badge/ES6-29张-1989fa)](https://github.com/jCodeLife/mind-map/tree/master/ES6)
[![](https://img.shields.io/badge/TS-27张-ff976a)](https://github.com/jCodeLife/mind-map/tree/master/TS)
[![](https://img.shields.io/badge/Vue-101张-ed6a0c)](https://github.com/jCodeLife/mind-map/tree/master/Vue)
[![](https://img.shields.io/badge/Vue3-50张-07c160)](https://github.com/jCodeLife/mind-map/tree/master/Vue3%E6%96%B0%E6%96%87%E6%A1%A3)
[![](https://img.shields.io/badge/React-86张-ffd01e)](https://github.com/jCodeLife/mind-map/tree/master/React)

如何查阅：
1. 点击 `Github` 右上角的 `Fork` 按钮，将仓库 `Fork` 到个人空间
2. 将个人空间中项目 `Clone` 到本地即可查阅


### 更多待办项

标志说明：

- 🔥 表示重要章节
- ⭐️ 表示必学项
- 🉑 表示可选项(类似技术多选一)
- ✅ 已办项（已整理过的）
- 🚫 表示待办项 （未整理的）
- ⏳ 表示有空就学

0. Internet 🔥
- Internet ⭐️🚫
- HTTP ⭐️🚫
- Browsers ⭐️🚫
- DNS ⭐️🚫 
- Domain Name ⭐️🚫
- Web hosting ⭐️🚫
1. HTML 🔥
- 基础 ⭐️🚫
- 写静态页面 ⏳🚫
- 表单和验证 ⭐️🚫
- 最佳实践 ⭐️🚫
- Web accessibility ⏳🚫
- SEO 基础 ⏳🚫
2. CSS 🔥
- 基础 ⭐️🚫
- 布局 ⭐️🚫
- 响应式设计和媒体查询 ⭐️🚫

3. JavaScript🔥
- JS 基础 ⭐️🚫
- DOM 操作 ⭐️🚫
- Ajax、Fetch ⭐️🚫
- [ES 6](https://github.com/jCodeLife/mind-map/tree/master/ES6(29%E5%BC%A0%E5%9B%BE)) 29张 ⭐️✅
- 进一步了解提升、事件冒泡、作用域、原型、影子DOM、严格模式、浏览器如何运作、DNS、HTTP等概念 ⭐️🚫
4. 版本控制系统 🔥
- Git ⭐️🚫
- GitHub ⭐️🚫

5. Web 安全知识 ⏳
- HTTPS🚫
- Content Security Policy🚫
- CORS🚫
- OWASP Security Risks  🚫

6. 包管理工具 🔥
- npm ⭐️🚫
- Yarn ⭐️🚫


7. CSS 体系结构 ⏳
- BEM🚫

8. CSS 预处理器 ⏳
- Sass🚫
- PostCSS🚫

9. 构建工具 🔥
- 9.1 任务执行器 
    - npm Scripts ⭐️🚫
- 9.2 模块打包器
    - Webpack ⭐️🚫
    - esbuild ⭐️🚫
    - Rollup 🉑🚫 
    - Parcel 🉑🚫
    - Vite 🉑🚫
- 9.3 Lint工具和格式化工具
    - ESLint ⏳🚫
    - Prettier ⏳🚫

10. 前端框架 🔥
- 10.1 React ⭐️
    - [React基础](https://github.com/jCodeLife/mind-map/tree/master/React) 86张✅
    - Redux ⭐️🚫
    - MobX 🉑🚫
    - Recoil 🉑🚫
- 10.2 Vue ⭐️
    - Vue 基础✅
        - [Vue](https://github.com/jCodeLife/mind-map/tree/master/Vue(101%E5%BC%A0%E5%9B%BE)) 101张✅
        - [Vue 3 新](https://github.com/jCodeLife/mind-map/tree/master/Vue3%E6%96%B0%E6%96%87%E6%A1%A3) 50张✅
    - Vuex🚫
- 10.3 Angular 🉑
    - RxJS🚫
    - NgRx🚫


11. 现代 css 🔥
- Styled-components ⭐️🚫
- CSS Modules ⭐️🚫
- Styled JSX 🉑🚫
- Emotion 🉑🚫

12. Web components ⏳
- HTML Templates🚫
- Custom elements🚫
- Shadow dom🚫

13. CSS 框架 🉑
- 13.1 CSS in JS
    - Tailwind CSS 🉑🚫
    - Chakra UI 🉑🚫
    - Material UI 🉑🚫
    - Radix UI 🉑🚫
- 13.2 CSS 框架（无JS）
    - Bootstrap 🉑🚫
    - Bulma 🉑🚫


14. 测试 🔥
- Jest ⭐️🚫
- React Testing Library ⭐️🚫
- Cypress ⭐️🚫
- Enzyme ⭐️🚫

15. 类型检查 🔥
- TypeScript ⭐️✅
    - [TS](https://github.com/jCodeLife/mind-map/tree/master/TS%EF%BC%8827%E5%BC%A0%E5%9B%BE%EF%BC%89) 27张 ✅
- Flow ⏳🚫

16. PWAs ⏳

17. 服务端渲染 SSR ⏳
- Next.js 🉑🚫
- Nuxt.js 🉑🚫
- Universal 🉑🚫

18. Graphql ⏳
- Apollo ⭐️🚫
- Relay Modern 🉑🚫

19. 静态网站生成器 ⏳
- Next.js ⭐️🚫
- Gatsby ⭐️🚫
- Nuxt js 🉑🚫
- Vuepress 🉑🚫
- Jekyll 🉑🚫
- Hugo 🉑🚫
- Gridsome 🉑🚫
- Eleventy 🉑🚫

20. 移动应用 ⏳
- React Native ⭐️🚫
- NativeScript 🉑🚫
- Flutter 🉑🚫
- Ionic 🉑🚫

21. 桌面应用 ⏳
- Electron ⭐️🚫

22. WebAssembly ⏳


### 最后

Keep Learning...