Wetoria/Resources

Collect resources

Resources

个人编码资料收集总结仓库，因为很多文章都是存储过才进行整理的，大多数链接为我的印象笔记中存储的笔记链接，笔记中包含原地址链接，若原链接打不开，笔记也算是一个备份

部分开始转为原链接，尊重作者，原有记录不做更改

---

• 前端进阶必备，github 优质资源整理分享！ - 掘金

• JavaScript 工具函数大全（新） - 掘金

• 【译】2019年前端必备资源 - 掘金

• 一名【合格】前端工程师的自检清单 - 掘金

• 知识点

• 面试时面试官想要听到什么答案（关于一些vue的问题） - 掘金

• web前端面试总结(自认为还算全面哈哈哈哈哈！！！） - 掘金

• 面试官：请实现三栏布局，尽可能多的方式。 - 掘金

• 跨域的正确打开方式 - 掘金

• 【 学 ES6 ？】 先看看这篇文章，还清ES5的帐吧！ - 掘金

• 1.5万字概括ES6全部特性(看图就能记下，值得收藏) - 掘金

• 一分钟说完JSONP请求，面试满分答案ヾ(≧▽≦*)o - 掘金

• (建议收藏)原生JS灵魂之问, 请问你能接得住几个？(上) - 掘金

• JS 原生面经从初级到高级【近1.5W字】 - 掘金

• 面试官：你能实现多少种水平垂直居中的布局（定宽高和不定宽高） - 掘金

• 一道网红面试题（腾讯、百度面试中都出现过） - 掘金

• 装饰你的敲门砖，离大厂更进一步 - 掘金

• Web 安全总结(面试必备良药) - 掘金

• 听说会做这道题的人后来都进了头条？ - 掘金

• 通过 20 个棘手的ES6面试问题来提高咱们的 JS 技能 - 掘金

• 【前方高能】新手到高级前端攻城狮都用的上的前端面试题库，备战明年金三银四 - 掘金

• 面向面试编程，面向掘金面试 - 掘金

• 栈、堆、队列深入理解，面试无忧 - 掘金

node & npm

• 前端工程化（5）：你所需要的npm知识储备都在这了

• Node入门

• 从零开发一个node命令行工具 - 腾讯新闻前端团队 - SegmentFault 思否

• 迷茫时学习Node.js最好的方法

• Node中没搞明白require和import，你会被坑的很惨 - 腾讯Web前端 IMWeb 团队社区 | blog | 团队博客

• 如何正确的学习Node.js

• Node环境变量 process.env 的那些事儿 - JS那些事儿 - SegmentFault 思否

• 当我们学习 Node.js 时，我们在学习什么？ - 前端 - 掘金

• What's the difference between a tilde (~) and a caret (^) in a npm package.json file? / Michael Lee

• 【手把手】15分钟搭一个企业级脚手架 - 掘金

nvm

• 使用 nvm 管理不同版本的 node 与 npm

Webpack

• 深入浅出 Webpack

• 通用、封装、简化 webpack 配置 - 深予之 - SegmentFault 思否

• 彻底解决Webpack打包慢的问题 - Jarvis - SegmentFault 思否

• vue.js - webpack中的一个疑惑 - SegmentFault 思否

• webpack-dev-server使用方法，看完还不会的来找我~ - JSer - SegmentFault 思否

• 【译】十五分钟，学习 Webpack - 掘金

项目管理

• 【译】Google 官方文章——如何去做code review - 掘金

• Emergencies

• 28个顶级的React UI组件库，请查收！

• Monorepo——大型前端项目的代码管理方式 - Haohong 的前端专栏 - SegmentFault 思否

• 前端代码质量-圈复杂度原理和实践 - 掘金

• 谈谈前端组件化 - 掘金

• 前端框架用vue还是react？清晰对比两者差异 - 掘金

• 5 分钟撸一个前端性能监控工具 - 掘金

• [手把手系列之] Jenkins+Docker自动化部署vue项目 - 掘金

• 一张Web性能优化参考图 - 掘金

前端

• 从 0 到 1 再到 100, 搭建、编写、构建一个前端项目 - 深予之 - SegmentFault 思否

• 前端进阶（2） - 目录结构优化 - 深予之 - SegmentFault 思否

• 前端项目如何管理 - 深予之 - SegmentFault 思否

• 前端开发与项目管理

• 前端重构方案了解一下 - IT程序猿

• 前端框架有哪些

• 手摸手，带你用vue撸后台 系列

• 制定自己团队的前端开发规范 - 掘金

• Code Guide by @AlloyTeam

• if 我是前端团队 Leader，怎么制定前端协作规范? - 掘金

• 【中高级前端必备】手摸手教你撸一个脚手架 - 掘金

• 前端开发技术栈推荐 - 掘金

前端异常处理

• 如何优雅处理前端异常？ | Fundebug博客

代码优化

• 我在工作中是如何优化代码的 - 掘金

• JS 的5个不良编码习惯，现在就改掉吧 - 掘金

单元测试

• JavaScript单元测试框架 - 掘金

• (47 条消息) 怎么为大中型的vue.js项目编写e2e测试？ - 知乎

• 搭建自己的前端自动化测试脚手架（三） - 随记 - SegmentFault 思否

Vue

• 7个有用的Vue开发技巧 - 掘金

• The correct way to force Vue to re-render a component - Michael Thiessen

• 在vue中使用jsx语法 - 掘金

• vue项目中配置favicon图标 - XuM222222的博客 - CSDN博客

• Vue插槽，你想了解的都在这里! - 掘金

• 构建Vue.js组件的10个技巧 - 掘金

• Vue 实用开发技巧 - 掘金

• 撸一个 Vue 自定义指令实现一键 Copy的功能 - 掘金

• 从一次性能优化看Vue的一个“feature” - 掘金

• vue全家桶开发的一些小技巧和注意事项 - 掘金

• Vue3 中的数据侦测 - 掘金

• Vue 开发必须知道的 36 个技巧【近1W字】 - 掘金

• Vue开发中怎么去处理多人协作开发(一) ---- 路由篇 - 掘金

• vue 自定义右键样式 - 掘金

• VS Code 调试vue项目 - 掘金

• 构建大型 Vue.js 项目的10条建议 - 掘金

• 基于 Vue 的两层吸顶踩坑总结 - 掘金

3.0

• 为什么Vue3.0使用Proxy实现数据监听？defineProperty表示不背这个锅 - 掘金

性能优化

• vue性能优化小结 - 掘金

• vue使用中的内存泄漏 - 掘金

• Cookbook：优化 Vue 组件的运行时性能

• Vue.js应用性能优化一

• Vue.js应用性能优化二

• Vue.js应用性能优化三

坑

• vue+element 键盘回车事件导致页面刷新的问题 - 邵阳肖敏的博客 - CSDN博客

Element-UI

• 优雅的使用 element-ui 中的 table 组件 - 掘金

• elementUI中dialog踩坑 - 台部落

Vuex

• vuex在vue项目中的使用 - kirinlau的专栏 - CSDN博客

缓存

• vue-router 之 keep-alive - 前端 - 掘金

• Vue 全站缓存之 keep-alive ： 动态移除缓存 - 掘金

• 解决 Vue 相同路由参数不同不会刷新的问题 - oZhangBi的博客 - CSDN博客

React

• 用好React，你必须要知道的事情 - 老干部的大前端 - SegmentFault 思否

• Pass props to a component rendered by React Router

• 关于React v16.3 新生命周期 - 掘金

• React入门---react脚手架 - 掘金

• 21个让React 开发更高效更有趣的工具 - 掘金

• Build your own React in 90 lines of JavaScript - DEV Community 👩‍💻👨‍💻

• React 组件件通信2——非父子组件间通信 - 简书

• 团队 React 代码规范制定 - 掘金

• 简单易懂的 React useState() Hook 指南（长文建议收藏） - 掘金

• 如何对 React 函数式组件进行优化 - 掘金

• 21个React性能优化技巧-InfoQ

坑

• 中文輸入法與React文字輸入框的問題與解決方案

Angular

• Angular 实现输入框中显示文章标签 - 掘金

移动端

• 关于移动端适配，你必须要知道的 - code秘密花园 - SegmentFault 思否

• 9102了，你还不会移动端真机调试？ - 掘金

Electron

• 如何正确地下载electron

• electron原来这么简单----打包你的react、VUE桌面应用程序 - 个人文章 - SegmentFault 思否

• React + Electron 搭建一个桌面应用 - 掘金

• 结合React创建Electron桌面应用

• Node.js Electron windows下安装与打包成 exe - oiKen的博客 - CSDN博客

• 使用create-react-app构建Electron应用 - 众成翻译

• Using FS in CRA + Electron · Issue #6782 · facebook/create-react-app

• Electron App 在 MacOS 下 申请摄像头及麦克风权限踩坑指南 - 掘金

HTML & CSS & JavaScript

HTML

• contentEditable的Change判断 | 临水照影的博客

• javascript – 在contentEditable中禁止行/段落 - 代码日志

• 自定义H5 video 播放器 - 掘金

CSS

• 小tip:CSS vw让overflow:auto页面滚动条出现时不跳动 « 张鑫旭-鑫空间-鑫生活

• 你所不知道的 CSS 负值技巧与细节 - 掘金

• 【前端词典】这些功能其实不需要 JS，CSS 就能搞定 - 掘金

• css-layout-hack.js

• 关于带有"显示更多"按钮的多行文本截断思考😲 - 掘金

• 您或许需要扩充可点击区域的范围⛅ - 掘金

• [译] CSS 小妙招：CSS 变量 —— 如何轻松创建一个🌞白色/🌑暗色主题 - 掘金

• 能让你受益匪浅的10个css使用技巧 - 掘金

• 响应式布局方法总结 - 掘金

JavaScript

• JS获取div高度的方法

• [译]带你理解 Async/await - 码力全开 - SegmentFault 思否

• JavaScript：函数防抖与函数节流 - 前端开发随笔 - SegmentFault 思否

• JS 中的require 和 import 区别 - 山高我为峰 - 博客园

• 轻松理解JS函数节流和函数防抖 - 掘金

• JS 中有趣的事实 - 掘金

• 什么时候不使用箭头函数 - 掘金

• 利用"交叉观察者"这个小宝贝儿，轻松实现懒加载、吸顶、触底 ❗ - 掘金 [ ]

• JS异常函数之-箭头函数 - 掘金

• 25个JavaScript代码简写技巧(下篇) - 掘金

• 浏览器的一些“滚动”行为鉴赏 - 掘金

• js es6 promise 中 resolve 如何传递多个参数? - T_one的回答 - SegmentFault 思否

• 你真的完全掌握了promise么？ - 掘金

• JS中一切都是对象吗？看这一篇就知道了 - 掘金

• 使用js实现局部打印页面 - zoro的博客 - CSDN博客

• JS实现页面打印

• Window.print()打印整个网站中的部分内容，打印后，原网页保持不变 - 北堂棣的随记 - SegmentFault 思否

• 使用JavaScript打印页面的技巧和要点

• 《前端实战》之变量提升，函数声明提升及变量作用域详解 - 掘金

• 7道简单的 JavaScript 面试题，三个月没招到一个人 - 掘金

• html2canvas-实现页面截图 - 掘金

• 基于html2canvas实现网页保存为图片及图片清晰度优化 - 小云朵 - SegmentFault 思否

• 有道题，得细说（一道异步相关的面试题） - 掘金

• 数组扁平化 Array.flat() 替代方案 - 掘金

• 可能是最全的 “文本溢出截断省略” 方案合集 - 掘金

• 最后一次学习 JavaScript 函数式编程 - 掘金

• 判断JS数据类型的四种方法 - 一像素 - 博客园

• [js行为研究] 对象作为对象的键会发生什么？ - 掘金

• 多维数组转一维数组（降维的多种方式） - 掘金

• 隐藏实力的 JSON.stringify，原来还可以这么用！ - 掘金

如何编写高质量的代码

• 前端进阶（3） - 怎样提升代码质量 - 深予之 - SegmentFault 思否

• 前端开发变量命名系列 - JavaScript篇 - wujie520303 - SegmentFault 思否

• 如何编写高质量的 JS 函数（1） -- 敲山震虎篇 - vivo互联网技术 - OSCHINA

• 如何编写高质量的 JS 函数（2） -- 命名/注释/鲁棒篇 - vivo互联网技术 - OSCHINA

• 如何编写高质量的 JS 函数（3） --函数式编程[理论篇] - vivo 互联网技术 - SegmentFault 思否

JS

• 两个代码优化的例子 - 掘金

• 实用Javascript调试技巧分享 - 半路出家老菜鸟 - SegmentFault 思否

Eslint

• eslint + pre-commit检测代码

• webpack引入eslint详解 - 前端周分享 - SegmentFault 思否

• 制定自己团队的前端开发规范之 eslint - 掘金

• 为create-react-app配置ESLint - 掘金

CSS

• BEM命名规范入门及常用CSS class 命名 - 掘金

• 实现一个成熟的底层毛玻璃效果（纯CSS） - 个人文章 - SegmentFault 思否

浏览器调试技巧

• 分享一些 Chrome 浏览器的前端调试技巧 - 掘金

• 灵活使用 console 让 js 调试更简单 - 终身学习者 - SegmentFault 思否

• 使用chrome开发者工具中的performance面板解决性能瓶颈 - 小火柴的蓝色理想 - 博客园

• 很好用的 UI 调试技巧 - 掘金

• 怎样让后台小哥哥快速对接你的前端页面 - 掘金

编辑器

• 在用VSCode? 看完这篇文章, 开发效率翻倍!最后一条厉害了~

• vue Eslint 自动修复 in Vscode - 掘金

Java

• 为什么阿里巴巴禁止开发人员使用 “isSuccess” 作为变量名？

DB

SQL Server

• Java连接SQL Server教程全 - HelloWorld, GraspWorld! - CSDN博客

MyBatis

• 30分钟入门MyBatis

日志

• log4j中的MDC和NDC - 程欢 - 博客园

RESTful

• 阮一峰——RESTful API最佳实践

• 微软 RESTful-API设计指导

设计模式

前端

• 前端设计模式 - a running snail - SegmentFault 思否

项目

• Web聊天工具的富文本输入框 - 掘金

• 用Node+wechaty写一个爬虫脚本每天定时给女(男)朋友发微信暖心话 - 掘金

浏览器

• 在浏览器地址栏按回车、F5、Ctrl+F5刷新网页的区别

• URL中“#” “？” &“”号的作用 - jihite - 博客园

• 超越 Cookie：当今的客户端数据存储技术 - 疯狂的技术宅 - SegmentFault 思否

• 《前端实战总结》如何在不刷新页面的情况下改变URL - 掘金

IE

• 高版本IE中弹出窗口不显示IE地址栏的解决方法 - 小马菜菜的专栏 - CSDN博客
  • IE添加受信站点会导致网页对话框中不显示浏览器地址。

IE插件开发

• 小工具开发笔记—IE自动填表器—第零篇：序 - Miles Chen - 博客园

• 小工具开发笔记—IE自动填表器—第一篇：你好，世界 - Miles Chen - 博客园

• 小工具开发笔记—IE自动填表器 -- 第二篇：执行一段JavaScript脚本 - Miles Chen - 博客园

跨域

• 不要再问我跨域的问题了 - 个人文章 - SegmentFault 思否

• 浏览器同源政策及其规避方法 - 阮一峰的网络日志

• 跨域资源共享 CORS 详解 - 阮一峰的网络日志

• 跨域技术（上） - 掘金

缓存

• 你应该知道的浏览器缓存知识 - 韩小平的博客

• 彻底理解浏览器的缓存机制 - 前端 - 掘金

• 看完这篇还不清楚缓存，求你打我😈（有彩蛋） - 掘金

权限

• http无状态和鉴权解决方案:cookie、session、token、oauth2及JWT

• 使用jwt完成sso单点登录

奇淫巧技

• 十分钟学会 tmux - 猫哥_kaiye - 博客园

• 一些 实用的 git 小技巧 - 掘金

• 你可能不知道的 Markdown *操作 - 掘金

• Markdown-图片设置（大小，居中） - quanwei的博客 - CSDN博客

• markdown折叠内容语法

• 我背着女朋友，用 Python 偷偷抓取了她的行踪

• 1小时搞定卡片拖拽、自动排列交换位置、拖拽数据存取 - 掘金

• 十分钟学会 tmux - 猫哥_kaiye - 博客园

• 21 个VSCode 快捷键，让代码更快，更有趣 - 掘金

  • EBS

Mock

• 纯手工打造前端后端分离项目中的mock-server

• Mock.js

面试

• 前端 100 问：能搞懂 80% 的请把简历给我 - 掘金

3D

• 一步步带你实现web全景看房——three.js - 掘金

git

• git 子模块的使用姿势

• Git 中 HEAD 游离的原因与解决方法 - 掘金

• 你知道 Git 是如何做版本控制的吗？ - 掘金

• 通过 41 个 问答方式快速了解学习 Git - 掘金

GitHub

• GitHub 上能挖矿的神仙技巧 - 如何发现优秀开源项目 · Issue #45 · biaochenxuying/blog

• 提交代码到GitHub，"小绿格"却不增加 - 掘金

网络

• 浅析 URL - 掘金

Linux

• web 前端用 linux 应该知道的知识 - 掘金

正则表达式

• 正则表达式中i,g,ig,gi,m的区别和含义

• 练完这篇就会写正则 - 掘金

• 常用JS正则大全(2019年9月16日更新) - 掘金

• 正则大全

持续集成

• 持续集成是什么？ - 阮一峰的网络日志

Curry

• 三行代码实现 JS 柯里化 - 掘金

• JavaScript 专题之函数柯里化 - 掘金

• 「前端进阶」彻底弄懂函数柯里化 - 掘金

• 编程范式 —— 函数式编程入门 - 掘金

• Partial & Curry - 函数式编程 - 掘金

• 函数式点滴--partial&curry - 掘金

• js的curry和函数组合 - 掘金

• 「前端发动机」从 bind 聊到 curry （柯里化） - 掘金

富文本

• Tinymce - 宇宙第一富文本编辑器？[1] - 掘金

• Vue之富文本tinymce爬坑录 - 掘金

Clean Architecture

• 前端架构-让重构不那么痛苦（译） - 掘金

  • 在前端开发中，可以把业务逻辑和前端表现给抽取出来。

Hexo

• 怎么用hexo上传一个README.md到github?（Ubuntu） - 知乎

• hexo设置跳过渲染某个文件或文件夹(20180522亲测通过)-四个空格

AppleScript

AppleScript

网络协议

• 99%的人理解错 HTTP 中 GET 与 POST 的区别 - OSCHINA

• 互联网协议入门（一） - 阮一峰的网络日志

Flutter

• Flutter中的本地存储 | Flutter开发者

Read

• 如何写出没有BUG的代码

• 即使是你烂熟于心的技术，也可以给你带来不同的思考——懒人在思考

• 从 React Native 到 Flutter，移动跨平台方案的真相 - LeanCloud 官方专栏 - SegmentFault 思否

• “我是技术总监，你干嘛总问我技术细节？”

• Study-For-StuQ

• 没有定力的人，越聪明就越平庸 - 炼己者 - 知乎专栏

• 程序员你为什么这么累？

• 趣谈个人建站

• 前端开发工程化探讨--基础篇（长文） - Coding 博客

• 如何学会阅读源码

• 前端程序员必知：单页面应用的核心

• 程序员如何成为编程高手，并以此创业

• JWT究竟是什么呢? | Fundebug博客

• 这可能是我见过的最好的编程指南

• 从自己写代码到带人写代码，角色转变应该关注的10个角度

• 离开华为三年，我才真正认同狼性文化

• 操作系统Unix、Windows、Mac OS、Linux的故事 科普篇 - zhanghow的博客 - CSDN博客

• 别人都在做自己喜欢的工作，为什么你不可以！

• 这是我见过的把开发人员学习路线总结的最清晰的四张图了

• 拥抱B端 | 做惯了C端的人到底不适应在哪里？

• 一个程序员的五年总结，给你不一样的角度 - 掘金

• 解密初、中、高级程序员的进化之路（前端） - 掘金 [ ]

• polyfill为何物 - 掘金

• 每个程序员都可以「懂」一点 Linux - 掘金

• 关于 Git 的 20 个面试题 - 疯狂的技术宅 - SegmentFault 思否

• 前端工程师如何才能不焦虑？ - 掘金

• Linux上的Shebang符号(#!) – 笑遍世界

• VS Code为什么能这么牛？

• 公司不重视前端怎么办？ « 张鑫旭-鑫空间-鑫生活

• Product Manager vs Project Manager: How to Avoid Confusion?

• Writing a small static site generator - Thea Flowers

• 面试官: 100万个成员的数组取第一个和最后一个有性能差距吗? - 掘金

• Web验证的过去现在与未来 - 掘金

• 不要肆无忌惮地在你的项目中使用 ES78910 了～ - 掘金

• 如何优雅的使用javascript递归画一棵结构树 - 掘金

• 网络协议的几个概念 - 掘金

• 函数式编程

• 「用技术解决问题」将你日常操作的时间复杂度从 O(n) 降到 1 - 掘金

• 🚀揭秘vue/react组件库中🤚5个"作者不造的轮子" - 掘金

• 做好以下四点，拒做 “ 空心 ” 程序员 - 掘金

• 浏览器和Node中的JavaScript是如何工作的? 可视化解释 - 掘金

• 【译】Google 官方文章——如何去做code review - 掘金

• 从实际出发，前端如何解决需求问题！ - 掘金

• 「前端进阶」从多线程到Event Loop全面梳理 - 掘金

• 10分钟彻底搞懂前端页面性能监控 - 掘金

• 面试分享：两年工作经验成功面试阿里P6总结 - 掘金

• 前端 101：给不了解前端的同学讲前端 - 掘金

• 给2019前端的5个建议 · Issue #11 · camsong/blog

• What every computer science major should know

• kamranahmedse/developer-roadmap

• Typescript版图解Functor , Applicative 和 Monad - 掘金

• 堆栈向上增长和向下增长的深入理解 - 时光漫走 - CSDN博客

• 理解RESTful架构 - 阮一峰的网络日志

• UI组件库从1到N开发心得-单元测试篇 - 掘金

• 写给新手前端的各种文件上传攻略，从小图片到大文件断点续传 - 掘金

• 前端初级新人，如何撕去菜鸟标签 - 掘金

• [-] Google 搜索的即时自动补全功能究竟是如何“工作”的？ - 掘金

• 面试官，不要再问我三次握手和四次挥手 - JVM从小白学成大佬 - SegmentFault 思否

• [-] Axios 源码分析之拦截器和请求取消 - 前端 - 掘金

• 常用配置文件格式

• 深入对比TOML，JSON和YAML - sunsky303 - 博客园

• 要进大厂？前端灰度发布必须要知道 - 掘金

• 我不想成为不懂 GUI 的 UI 开发者 - 掘金

• [技术翻译]9个可以让你在2020年成为前端专家的项目 - 掘金

• 运营商劫持狠起来，连json都改 - 掘金

• 量化交易之股票数据的获取——Pandas API接口 - Python量化交易 - SegmentFault 思否

• (1 封私信 / 50 条消息) 随着计算机发展，有2进制、8进制、16进制，为什么没32进制、64进制？ - 知乎

• 前端安全常识面试题学习笔记 - 掘金

• 我的前端成长之路 · 语雀

• 【Canvas真好玩】从黑客帝国开始 - 掘金

• 中文字体网页开发指南 - 阮一峰的网络日志

• 下一站，开启新的篇章 - 掘金

• 前端该如何准备数据结构和算法？ - 掘金

• 最近程序员频繁被抓，如何避免面向监狱编程！？ - 掘金

• 大学生活这样过，校招 offer 飞来找 - 掘金

• 战五渣程序员的五项必备技能 - 掘金

• 27 个提升开发幸福度的 VsCode 插件 - 掘金

• 如何成为公司独当一面的工程师 - 掘金

• 高效学习习惯分享 - 掘金
  • 一旦...就...
  • 以有益的事（读书），替换打发时间的事
  • 提高专业能力。

• 我为什么建议前端将Python 作为第二语言？ - 掘金

• 「前端进阶」深度解析瀑布流布局 - 掘金

• ARGB透明度换算 - 简书