Motto
多写多练多思考
Step
- element 组件 upload 源码
使用 input="file" 和 XMLHttpRequest 实现，触发 input 选择文件后获取节点 e.target.files 文件列表信息，利用 formData 格式 post 请求发送到服务器
- 点对点实时聊天 https://github.com/cenmen/chat
- node 文件上传 https://github.com/cenmen/upload-server
- upload 组件(纯 javaScript 实现, webpack 可打包输出) https://github.com/cenmen/uploader
- 阅读 events 源码输出精简使用版 https://github.com/cenmen/events
- chrome 扩展程序 - 文章纯净器 https://github.com/cenmen/cleaner-extension
- chrome 扩展程序 - B 站斗鱼虎牙弹幕自刷器 https://github.com/cenmen/barrage-extension
- chrome 扩展程序 - 12306 自动抢票器 https://github.com/cenmen/12306-ticket-extension
- select 组件(纯 javaScript 实现) https://github.com/cenmen/multiple-select
- modal 弹窗组件(Web Components) https://github.com/cenmen/modal
- PC 端脚手架 https://github.com/cenmen/react-pc
- h5 端单页面脚手架 https://github.com/cenmen/react-h5
- h5 端多页面脚手架 https://github.com/cenmen/react-multiple-h5
- B 站视频 & 音频下载工具 https://github.com/cenmen/bilibili-media-download
- PC 端脚手架(Vue3.x) https://github.com/cenmen/vue-pc
- 个人歌单记录助手(小程序) https://github.com/cenmen/musics
TodoList
-
- create-react-app 脚手架源码阅读 & 优化旧版项目架构
-
- 使用 mongodb + nestjs + vue3.x 实现图书馆管理系统
-
- 使用 mongodb + nestjs + react + react-router6.x + pubsub + redux + antd 实现图书馆管理系统
-
- vite
-
- gitbook 整理个人技术
源码仓库阅读
Repository
- awesome-javascript 许多受欢迎的技术仓库分类
- javascript-questions JS 问题
- clean-code-javascript 中文版 代码风格指南
- javascript 代码风格指南
- 30-seconds-of-code 许多有意思的函数
- weekly 前端精读文章
- common-regex 常用简单正则
- front-end-knowledges 优质文章
常用工具集录
webpack
- loader
- plugins
nodejs
Features
顺序 = 重视程度，百分比 = 掌握度（相对）
<style> label { width: 100px; } .item { display: flex; margin-top: 15px; } .progress { height: 20px; width: 300px; display: flex; border: 2px solid #409eff; } .filled { width: 240px; background-color: #409eff; color: white; text-align: right; } .percent { margin-right: 15px; } </style>
HTML：
85%
CSS：
85%
JavaScript：
75%
React：
55%
Vue：
50%
微信小程序：
60%
Node.js：
15%
TypeScript：
30%
React Native：
0%
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent