chrome代理插件 SwitchySharp

react调试工具

  • chrome插件可以直接看到节点的结构

fiddle autoresponder

PAC代理配置

使用pac的地方
- 百度代理 内搜搜索代理 http://pac.internal.baidu.com/bdnew.pac
- shadowshocks代理配置
- chrome插件 switchysharp
- fiddle的路由是不是呢?可以测试下看

使用express做代理服务器

PAC代理和express服务器结合制作本地测试

  • mac使用terminal设置pac: networksetup -setautoproxyurl “Wi-Fi” “http://somedomain.com/proxy.pac
  • 获取代理地址: networksetup -getautoproxyurl “WI-FI”

Macbook Pro外接显示器分辨率问题

最字符串最后一个字符 str.slice(-1);

brew

安装nvm

shadowsocks

vim编辑器

mac下配置zsh

  • 将bash切换为zsh: chsh -s /bin/zsh
  • which定位zsh: which zsh
  • 切回bash: chsh -s /bin/bash
  • 下载oh-my-zsh: git clone git://github.com/robbyrussell/oh-my-zsh.git ~/.oh-my-zsh
  • 备份已有的zshrc(一般不需要) cp ~/.zshrc ~/.zhrc.orig
  • 替换zshrc: cp ~/.oh-my-zsh/templates/zshrc.zhs-template ~/.zshrc

webstrom好处

  • 自动保存
  • 查看文件编辑历史vcs->Local History -> Show History(快捷键:ALT+~ -〉7)

mac 快捷键MAC苹果系统:

查找相关

command + shift + o 根据文件名查找文件
command + f 查找当前文档
command + r 替换当前文档

代码相关

command + d 副本当前行或选中的区块
command + option + t 将代码以某种格式包括起来
command + option + l 将代码格式化
command + shift + u 切换大小写
shift + return 在任意位置换行
shift + F6 高级修改,可快速修改光标所在的标签、变量、函数等

定位相关

option + f1 在左侧文件树中定位到当前打开文件
command + g 跳转到文档的某一行某一列
command + w 选中当前单词、行、区块等
command + y 删除整行
command + [ 移动光标到代码块前
command + ] 移动光标到代码块尾
command + -> 光标移到行尾
command + <- 光标移到行头
option + -> 以单词为单位移动光标
option + <- 以单词为单位移动光标
command + shift + [ 切换到上一个Tab页
command + shift + ] 切换到下一个Tab页

其他

command + + 折叠区块
command + - 展开区块
command + shift + + 折叠所有区块
command + shift + - 展开所有区块
command + p 显示参数信息
command + mouseover 显示主要信息
control + shift + f find in path
control + shift + j 合并行
control + shift + r replace in path
option + delete delete to word start
option + fn + delete delete to word end

快捷键windows平台

查找/代替

  • ctrl+shift+N 通过文件名快速查找工程内的文件(必记)
  • ctrl+shift+alt+N 通过一个字符快速查找位置(必记)
  • ctrl+F 在文件内快速查找代码
  • F3 查找下一个
  • shift+F3 查找上一个
  • ctrl+R 文件内代码替换
  • ctrl+shift+R 指定目录内代码批量替换
  • ctrl+shift+F 指定目录内代码批量查找
  • ctrl+R 文件内代码替换

    界面操作

  • ctrl+shift+A 快速查找并使用编辑器所有功能(必记)
  • alt+[0-9] 快速拆合功能界面模块(分屏)
  • ctrl+shift+F12 最大区域显示代码(会隐藏其他的功能界面模块)
  • alt+shift+F 将当前文件加入收藏夹
  • ctrl+alt+s 打开配置窗口
  • ctrl+tab 切换代码选项卡(还要进行此选择,效率差些)
  • alt+<-或-> 切换代码选项卡
  • ctrl+F4 关闭当前代码选项卡

    代码编辑

  • ctrl+D 复制当前行
  • ctrl+W 选中单词
  • ctrl+<-或-> 以单词作为边界跳光标位置
  • alt+Insert 新建一个文件或其他
  • ctrl+alt+L 格式化代码
  • shift+tab/tab 减少/扩大缩进(可以在代码中减少行缩进)
  • ctrl+Y 删除一行
  • shift+enter 重新开始一行(无论光标在哪个位置)

    导航

  • esc 进入代码编辑区域
  • alt+F1 查找代码在其他界面模块的位置,颇为有用(左侧文件树)(必记)
  • ctrl+G 到指定行的代码
  • ctrl+]/[ 光标到代码块的前面或后面
  • alt+up/down 上一个/下一个方法

    建议配置版本控制快捷键

  • ctrl+C 提交代码
  • ctrl+p 向远程版本库推送更新
  • ctrl+G 到指定行的代码
  • ctrl+]/[ 光标到代码块的前面或后面
  • alt+up/down 上一个/下一个方法

PAC代理配置

  • 主要函数 FindProxyForURL

    1
    2
    3
    4
    5
    6
    7
    function FindProxyForURL(url,host)
    {
    // 支持javascript,可以使用正则表达式进行处理
    if(host=="http://www.domain.com/") return "DIRECT";
    return "PROXY myproxy:80;PROXY myotherproxy:8080;DIRECT";
    }
  • 返回值

    • “DIRECT” : 不做处理,直接返回
    • “PROXY host:port” 发送到代理服务地址
    • “PROXY host:port;host:port;DIRECT” 多个代理服务地址,自动按顺序请求
  • 其他函数
    • isPlainHostName(host) 判断是否是本地主机
    • dnsDomainIs(host,domain) 判断是否属于某个域
    • localHostOrDomainls(host,””) 判断是否属于某个域或者域名
    • shExpMatch(host,””) 主机名匹配判断
    • url.substring(0,n)
    • dnsResolve(host) 域名ip解析
    • myIpAddress() 本机ip
    • dnsDomainLevels(host)
    • weekdayRange(“WED”,”SAT”,”GMT”) 星期几

示例:匹配test.com到localhost:3000

1
2
3
4
5
6
7
8
9
10
11
12
function FindProxyForURL(url, host) {
if (shExpMatch(host, '*.test.com*')) {
return "PROXY localhost:3000";
}
// 或者使用正则表达式
if (/test\.com/.test(host)){
return "PROXY localhost:3000";
}
return "DIRECT";
}

《移动Web手册》读书笔记

nodejs process.env.NODE_ENV 配置

>
process.env is a reference to your environment, so you have to set the variable there.
To set an environment variable in Windows:
SET NODE_ENV=development

on OS X or Linux:
export NODE_ENV=development

在百度开放云中可以通过app.conf配置环境变量
https://bce.baidu.com/doc/BAE/GUIGettingStarted.html#.E9.85.8D.E7.BD.AEapp.conf

多行文字最后显示省略号及更多

  • 单行文字省略号text-overflow: ellipsis;

    1
    2
    3
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
  • 多行文字省略号-webkit-line-clamp: 2;

    1
    2
    3
    4
    5
    overflow : hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  • jquery.dotdotdot插件计算省略号和显示更多 http://dotdotdot.frebsite.nl/

html5 history操作访问历史

  • history.length // 长度
  • history.back()
  • history.go()
  • history.forward()
  • history.pushState({page: 1}, “title 1”, “?page=1”);
  • history.replaceState({page: 3}, “title 3”, “?page=3”);
  • history.state
  • popstate事件
  • history.js

location.replace函数

jquery生成二维码插件 qrcode

vue.js介绍

webpack 入门指南

轻松入门React和Webpack

node的版本管理工具n和nvm

服务器环境

  • github
  • gitlab
  • gogs

ide客户端

  • sourcetree
  • git for window

代码托管

https://github.com
https://coding.net/

常用命令

git clone
git pull git fetch + git merge
git fetch 更新缓存到本地
git checkout -b local-branch origin/remote-branch

git branch -a 分支列表

git stutus 修改文件列表
git diff 查看修改内容
git log 查看提交记录

git add . 将修改文件加到提交内容列表区
git commit -m ‘msg’ 提交修改到本地缓存区

git merge

git push
git reset HEAD^ 重置,^代表恢复一次提交

git使用

  • git config –global user.name “wirelessqa”
  • git config –global user.email wirelessqa.me@gmail.com
  • push失败,failed to connect to github port 443: timed out
    删除用户名,密码,代理
    删除代理
    git config –unset (–global) http.proxy

gitignore

1
2
/dest/*
!/dest/css/ #不忽略文件
  • 假如已经有内容加入到git中,再添加到gitignore将不起作用

git errors

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
error: RPC failed; result=22, HTTP code = 411
fatal: The remote end hung up unexpectedly
fatal: The remote end hung up unexpectedly
Everything up-to-date
If you attempt to push a large set of changes to a Git repository with HTTP or HTTPS, you may get an error message such as error: RPC failed; result=22, HTTP code = 411. This is caused by a Git configuration default which limits certain HTTP operations to 1 megabyte.
To change this limit run within your local repository
git config http.postBuffer *bytes*
where bytes is the maximum number of bytes permitted. For exmaple:
git config http.postBuffer 524288000
For 500MB (thanks @Hengjie)

event事件参数时效性

如下代码,在触发事件后,我们进行了其他操作,比如ajax和setTimeout等,过段时间,虽然还是同一个变量,但是其中的currentTaget就不见了.假如要延迟使用currentTarget属性,必须先存储下来,避免被消除掉.
1
2
3
4
5
6
7
function mouseclick(e){
console.log(e.currentTarget);
//ajax setTimeout等
setTimeout(function(){
console.log(e.currentTarget);
},1000);
}

js总结

js优化

js知识点

  • hasOwnProperty
  • instanceOf

#js数组

  • join 所有元素转为字符串,默认使用连接符逗号”,”
  • reverse 颠倒数组中的元素顺序(修改原数组)
  • sort 元素排序(修改原数组)
  • concat 链接数组
  • slice 返回子串(负数表示倒数第几个元素)
  • splice 从数组中删除元素、插入元素(修改原数组)
  • push和pop push尾部添加元素,pop头部删除元素
  • unshift和shift unshift头部添加元素,shift头部删除元素
  • toString和toLocalString

#js数组 ECMAScript5中的方法

  • forEach
  • map
  • filter
  • every和some
  • reduce和reduceRight
  • indexOf和lastIndexOf

#js函数

#jquery

  • 事件
    • live已取消
    • delegate/undelegate
    • bind: click,mouseover,input,prototypechange
  • 动画
    • fadeIn/fadeOut
    • slideDown/slideUp
    • animate({params},speed,callback)

#ajax:XMLHttpRequest

  • open
  • send
  • abort

#js模块加载器

  • requirejs(AMD)
  • seajs
  • commonjs

#js 片段

  • 滚动加载
    var clientHeight = window.document.body.clientHeight;
    var scrollTop = window.document.body.scrollTop;
    if ((clientHeight + scrollTop) > window.document.body.scrollHeight - 20) {
        return false;
    }
    //动态实现内容
    

canvas

  • 使用canvas制作动画时,注意清除之前绘制内容,不然容易影响以后绘制的内容。(产生锯齿)