1 快速避坑、解决通用问题的技巧 : 看文档

Github、开源组件的文档

2 代码调试方法 : 小黄鸭调试法

小黄鸭调试法（Rubber Duck Debugging，又称橡皮鸭调试法，黄鸭除虫法）是软件工程中使用的调试代码方法之一。

这里所指的小黄鸭，主要是为了提供一个对于对话、辅助完成对当前问题的思路梳理的工具人，它可以是：可以与你说话的同事、Team Leader、乃至小黄鸭等真玩偶。

此概念是参照于一个来自《程序员修炼之道》书中的一个故事。

传说中程序编程大师随身携带一只小黄鸭，在调试代码的时候会在桌上放上这只小黄鸭，然后详细地向鸭子解释每行代码。

许多程序员都有过向别人（甚至可能向完全不会编程的人）提问及解释编程问题，就在解释的过程中击中了问题的解决方案。一边阐述代码的意图一边观察它实际上的意图并做调试，这两者之间的任何不协调会变得很明显，并且更容易发现自己的错误。如果没有玩具小鸭子也可以考虑向其它东西倾诉，比如桌上的花花草草，键盘鼠标。

类似的，有一种现象叫做cone of answers，这是一个常见的现象。
你的朋友跑来问你一个问题，但是当他自己把问题说完，或者说到一半的时候就想出了答案走了，留下一脸茫然的你。是的，这个时候你就起到了那只小黄鸭的作用。

相似的概念还有不少，例如自白调试、纸板程序员或程序员的假人、想出脑外等等。总的来说，在你试图表述自己的想法的过程中，自然地在促使自己去整理思路，重新考虑问题。

3 最小系统法(抽取核心代码，单独测验)

推荐工具网站

3.1 前端语言

3.1.1 CodeSandBox

Codesandbox

3.1.2 Codepen

Codepen

3.1.3 SnippetsLab [just for MacOS]

SnippetsLab
SnippetsLab - Mac App Store

Snippetslab 不是一款传统意义上的代码编辑器，它的设计从头到尾都透着一股浓浓的为碎片化而生的味道。
它所面向的不是连续的编辑一个完整程序的情景，而是将一个程序组件一个个拆分出来编写的情景。

在这种情景下，你可以非常碎片化的编写程序，并且可以快速的将代码调用到各个其他的程序上。而Snippetslab做的就是将这些代码收集在一起，让你可以快速搜索并调用，将一个个小的程序片段快速的组合。

SnippetsLab 的终极目的就是将你容易遗忘在电脑角落中的各种代码片段收集在一起，构建成你个人的巨大的代码片段库。随着你编写与收集的代码片段越来越多，你的私人片段代码库也就积累的越来越多，你的可用代码也就越来越多，结合它的快速搜索和资料库结构，将能够极大的帮助你的程序构建（虽说网上的代码库肯定更大，但用自己整理的代码不是更方便容易吗）。

同时，SnippetsLab 支持 MacOS、iCloud，这意味着你可以在多台设备上快速同步。

3.2 全能型(前端 + 后端)

3.2.1 MassCode (私有化部署) 【推荐】

3.2.2 Replit (SaaS云服务) 【推荐】

Repl.it

https://repl.it

https://replit.com/~
[https://docs.replit.com/] (官方文档)

Replit（原来是https://repl.it）是一个基于浏览器的云端协同开发平台，可用于构建开发环境、实时协作、托管网络应用等。
Replit提供可创建动态或者静态网站的容器，并会自动生成免费https域名（格式为：项目名.用户名.http://repl.co）。
这代表着任何人都可以试用Replit的云服务器创建自己的网站，或者是其他的服务，而且这一切，都是免费的。

支持的编程语言:
  Python
  Java
  C++ / C
  HTML / CSS / JS
  Ruby
  ...

3.X 代码片段资源网站

Snipplr 【推荐】

snipplr 可以说是世界上最大的代码资源库。在过去的几年中，它发布了大量的代码片段，包括我们网站上的很多文章都引用了snipplr的大量代码。

DZone code snippets

一个综合性质的代码库。拥有25中不同编程语言的代码集合，包含了几千的代码片段。

Jonas John snippet library

一个综合的代码库，包含了php，C#，visual Basic，javascript等。

Code Beach ：Mac开发者的代码库，包含了C，Ruby，C++，Python等代码片段
PHP Snips ：如果你做PHP开发，那么这个网站绝对是你需要的代码库。拥有几百号的免费使用的代码。超值！
WPRecipes：一个专门收集wordpress代码的网站。大约拥有300个独立的代码片段可供用户选择。
Code Codex ：使用wiki方式构建的代码资源网站，拥有丰富的C，C++和Java的代码资源。
CodeKeep ：上万的代码片段，绝对能够找到你需要的代码。包含，C，C++，ASP，VB ，actionscript等
GBin1 jQuery/javascript：这里收集了很多大家可能会常用的jQuery/javascript代码片段，如果你也有自己不错的代码片段，你也可以投递