前端开发桌面程序
1、Electron - https://electronjs.org/docs 可以开发.exe的桌面程序
https://www.jianshu.com/p/57d910008612
UI框架
一、Bootstrap中文网：http://www.bootcss.com/
二、Bootstrap Table API: http://bootstrap-table.wenzhixin.net.cn/zh-cn/getting-started/
http://www.cnblogs.com/gamehiboy/p/5176618.html
三、Vue UI:
1、layUI框架: http://www.layui.com/
页面中加载layui
<script src="lib/layui.js"></script>
<script src="mian.js"></script>
main.js
layui.use(['laydate'], function(){ // laydate 调用日期插件
var laydate = layui.laydate;
var oD = document.getElementById("dateInput");
var start = {
elem: oD,
min: laydate.now(),
max: '2099-06-16 23:59:59',
istoday: false,
choose: function(datas){
end.min = datas; // 开始日选好后，重置结束日的最小日期
end.start = datas // 将结束日的初始值设定为开始日
}
};
laydate(start);
});
饿了么vue PC端框架 : http://element.eleme.io/#/zh-CN/resource
四、React UI:
蚂蚁金服React ui框架https://ant.design/
react native https://github.com/ant-design/ant-design-mobile/blob/master/README.zh-CN.md
https://mobile.ant.design/docs/react/introduce
React UI: http://rsuite.github.io/#/?_k=1me3ji
React 图表: BizCharts:http://bizcharts.net/products/bizCharts/demo
微信UI
UI库 http://vue.ydui.org/
移动端UI
阿里移动端框架 mui: http://m.sui.taobao.org/
饿了么vue ui移动框架: http://mint-ui.github.io/#!/zh-cn
flexible移动端rem转换: http://caibaojian.com/flexible-js.html
JS库
1、jQeruy
2、underscore: http://www.css88.com/doc/underscore/
3、zepto: http://www.bootcss.com/p/zeptojs/
日期类
1、jquery DateTimePicker: http://www.jq22.com/jquery-info332
2、Bootstrap DataPicker: http://www.bootcss.com/p/bootstrap-datetimepicker/
3、laydate: http://laydate.layui.com/
JS框架
1、VueJS
2、AngularJS
vue-strap：http://yuche.github.io/vue-strap/
3、React
4、ReactNative
Mock数据
1、mock：http://mockjs.com/ // 生成随机数据，拦截 Ajax 请求
2、RAP: http://rap.taobao.org/org/index.do
复制一个字段名，然后新建一个字段粘贴，在按ctrl+回车，就会将他下面所有的数据都复制过来，对于层级很复杂的比较好用
chrome 插件
EditThisCookie 设置cookie
PostMan post请求
3、在线编辑代码: https://jsfiddle.net/
NodeJS
Exporess: http://www.expressjs.com.cn/
egg阿里nodejs框架:https://eggjs.org/zh-cn/basics/middleware.html
移动端的Sass框架
yo: https://github.com/doyoe/Yo#bugs-and-feature-requests
icons
http://www.iconfont.cn/ // 阿里图标收集
http://www.fontawesome.com.cn/
https://icons8.com/icon/new-icons/all
http://emojipedia.org/ 小图片
其它插件
1、socket: https://github.com/sockjs/sockjs-client
2、二进制转换库: protobuf.js bytebuffer.js long.js
3、纯前端将table导出Excel文件 http://www.jianshu.com/p/74d405940305
js-xlsx: https://github.com/SheetJS/js-xlsx 用来读取和写文件，
暴露一个XLSX全局对象
读取数据XLSX.reder()，读取文件XLSX.readerFile()
写数据 XLSX.write()，写文件XLSX.writeFile()、写流文件XLSX.stream
utils对象
fileSaver: https://github.com/eligrey/FileSaver.js/blob/master/FileSaver.js
4、axios - ajax封装 https://github.com/axios/axios#cancellation
5、iScroll: http://cubiq.org/iscroll-5 http://www.360doc.com/content/14/0724/11/16276861_396699901.shtml
6、Swipper: http://www.swiper.com.cn/
http://www.jq22.com/ jquery插件网
日期
1、momentjs: http://momentjs.cn/ // 日期格式化
####
chalk: https://github.com/chalk/chalk // 可以设置终端log的显示颜色
前端打包工具
1、gulp
2、webpack
3、grunt
调试工具
1、browsersync: http://www.browsersync.cn/ // 浏览器同步测试工具
http://www.browsersync.cn/docs/command-line/
产品类
http://www.sketchcn.com/
omniGraffle
管理工具
Confluence 用于团的wiki，和日常工作流程
JIRA 产品版本 产品需求 - 技术开发 - 测试
Stash git 仓库
/** 工具类 */
查看chrome的DNS缓存对应表: chrome://net-internals#dns
Sublime Text
http://blog.csdn.net/u013861109/article/details/53106074
1、安装package control
https://packagecontrol.io/
Control + `（mac） 或 Ctrl+～ （win） 调出console 输入下面命令，查看是否安装成功 Perferences->package settings中看到package control这一项，则安装成功
import urllib.request,os; pf = 'Package Control.sublime-package'; ipp = sublime.installed_packages_path(); urllib.request.install_opener( urllib.request.build_opener( urllib.request.ProxyHandler()) ); open(os.path.join(ipp, pf), 'wb').write(urllib.request.urlopen( 'http://sublime.wbond.net/' + pf.replace(' ','%20')).read())
2、安装编辑器主题
按下Ctrl+Shift+P，输入install，选择Package Control: Install Package，然后输入Spacegray，选择Theme: Spacegray.
在菜单栏中选择Preferences->Settings-User，复制以下代码，覆盖打开的文件内容，保存即可应用主题：
{
"theme": "Spacegray.sublime-theme",
"color_scheme": "Packages/Theme - Spacegray/base16-ocean.dark.tmTheme"
}
3、设置代码行间距、字号
需要个性哪个就直接在preferences -> settings user 中的配置添加
{
"color_scheme": "Packages/Theme - Spacegray/base16-ocean.dark.tmTheme",
"theme": "Spacegray.sublime-theme",
"font_size": "16",
"line_padding_top": 2,
"line_padding_bottom": 2
}
4、安装常用插件
安装：command + shift + p 输入 ip 回车
卸载：command + shift + p 输入remove 回车
1) px转rem插件 https://github.com/flashlizi/cssrem
1）emmet：html、css快速编写
如果emmet插件失效：http://www.jianshu.com/p/0862e754cf15
2）syncedSideBar：侧栏与主界面的颜色相同
3）babel：ES6、JSX、React
4）AngularJS
5）jQuery：jQuery提示
6）Html5：html5捆
7）Less：一个Less语法高亮插件
8）Sass
9）JsFormat：js 格式化插件
10）SublimeLinter：行内高亮语法
11）SideBarEnhancements：一个左边栏增强
12）SublimeCodeintel：一个代码智能提示引擎
13）Alignment：Js代码对其插件
14）BracketHighlighter：代码对其线高亮
15）Git：git的支持插件
16）Prefixr：Prefixr Api支持，Prefixr是一个生成css3兼容性的api
17）LiveReload：网页浏览器页面重新加载插件
18）Tag：格式化代码排版
Mac OS X: Command-Option-Shift-F
Windows: Control-Alt-Shift-F
19) HTML-CSS-JS Prettify 代码格式化插件 cmd+shift+h
20）cssrem：sublime的px转rem的插件 https://github.com/flashlizi/cssrem 需要手动下载放到packages中，配置cssrem.sublime文件指定px_to_rem的值
21）MarioRicalde-SCSS SCSS的代码提式和高亮
react插件 http://www.jianshu.com/p/ecf6c802fdc5?open_source=weibo_search
emmet快捷方法
http://www.w3cplus.com/tools/emmet-cheat-sheet.html
http://www.iteye.com/news/27580
webStorm
1、格式化代码: format command + option + L
2、install plugins 安装插件
webstorm/plugins => 插入插件名，然后添加
atom
用于开发react
atom-react-autocomplete 组件名及状态的自动补全
http://blog.csdn.net/crper/article/details/52196675
vs-Code
安装插件： ext install 插件名
https://marketplace.visualstudio.com/VSCode
1、vue-beautify: vue格式化
2、vue: 语法高亮
3、html-snippets：H5 提示
4、vscode-html-css: 写class可以搜索到所有引用class的值
5、jquerysnippets: jquery提示
6、vscode-JS-CSS-HTML-formatter: html/css/js文件格式化 使用方法: ⌘ + P 输入formatter
7、path-intellisense: 路径自动提示
8、npm-intellisense: 使用require提示
9、vscode-eslint: 语法验证
10、Bootstrap:
11、vscode-icons: 编辑器菜单中对应文件前加图标 输入icon 选择 File icon Theme
vscode-icon-theme:
12、ReactSnippets: ReactJS jsx文件内 输入 rcc 就可以创建一个react组件的初始代码
https://marketplace.visualstudio.com/items?itemName=xabikos.ReactSnippets
13、vscode-node-readme: 可以查看node reuqire中引用的node-module的包内容
14、auto-close-tag: 可以将文档未闭合标签自动加关闭 输入close tag
15、px转rem插件 https://github.com/Maroon1/px2rem
16、主题类
Atom One Dark Theme
vsc-material-theme
Material Theme
切换主题 ⌘ + shift + p => 输入 them 选择颜色主题在列表中在选择
17、guides: 高亮缩进基准线 ext install guides
18、常见问题
1) HTML GB2312的乱码问题：code - 首选项 - 设置 在右侧来设置此属性 files.autoGuessEncoding": true
-------------------
1、⌘ + p 搜索插件
2、⌘ + shift + p 命令
3、⌘ + , 打开settings.json配置
4、^(control) + ` 打开vscode自带的终端
5、miniMap的配置 在settings.json中加入 "editor.minimap.enabled": true 配置
6、|http://www.jianshu.com/p/819fc0f7f3b2 配置
7、http://www.cnblogs.com/huaxingtianxia/p/5481493.html 快捷键
8、整行粘贴 sb是⌘+D, vscode是光标在当前行 ⌘+C, 然后在⌘+V
9、多行光标
ALT+鼠标
ALT+上下方向键
关键词被选中/高亮后，CTRL+D
{
"workbench.iconTheme": "vscode-icons",
"workbench.colorTheme": "Atom One Dark",
"files.autoGuessEncoding": false,
"window.zoomLevel": -1,
"editor.fontSize": 13, // 文字大小，也可以command +
"editor.tabSize": 2, // tab空格数
"editor.formatOnType": false,
"editor.formatOnSave": false,
"editor.wordWrap": "on" // 代码自动换行
}
gitBook
https://segmentfault.com/a/1190000005859901
http://www.chengweiyang.cn/gitbook/introduction/README.html
markdown
https://sspai.com/post/25137
使用工具
1、sFTP - 可视化拖拽上传服务器，也命令行
2、SecureCRT - 纯命令行上传服务器
3、Navicat Premium - Mysql 可视化工具
4、Studio 3T - MongoDB 可视化工具
5、Sourcetree - Git工具
6、VSCode、Sublime、Atom、WebStorm - 前端开发工具
7、
国内查看评论需要代理~