# Slack - bot 研究雜記 最近 bot 很夯
再加上公司需要一些自動部署與指令化的一些流程要改善, 所以就來研究一下
剛好我們是用 Slack 所以就先來試試 Slack bot 了
## Intro 先說明下最簡單的指令化處理事件的流程
大致上就是如此
再來說明一下 Slack bot 流程
所以我們需要做兩件事
在 Slack 建立一支 bot
建立 bot client 的程式
在此先說明一下 bot client
Slack bot client 是用 nodejs 寫的, 但基本上會寫 JavaScript 就可以了, 而 bot client 是放在任何可以連上網路的機器, 只要能跑 nodejs 的環境即可, 所以基本上可以先在 local 測完再上到線上的機器
## 建立 Slack bot Bot Users
### 建立 bot Go to url https://<your team name>.
...
# Node.js - 直接執行指令 因為最近要用 nodejs 做一些事, 所以就趕鴨子上架的先把功能做出來再說
然後就立馬遇到問題了…
在 PHP 中要直接執行 command line 是使用 exec
因為之前都用 PHP 寫 Shell Scripts 所以找了一下用 nodejs 要如何寫
先是找到了以下的 code
function run_cmd(cmd, args, callBack ) { var spawn = require('child_process').spawn; var child = spawn(cmd, args); var resp = ""; child.stdout.on('data', function (buffer) { resp += buffer.toString(); }); child.stdout.on('end', function() { callBack (resp); }); } // example run_cmd( "ls", ["-l"], function(text) { console.log (text) ; }); 但是發現如果是要用像是 mkdir 或者要 run shell 就會出 ENOENT 的 error
...
# JavaScript - facebook save to facebook button 2016 F8
Facebook release new function - save to facebook
Then we can use it now
## Step 1 Go to facebook developer Save Button - Social Plugins - Documentation - Facebook for Developers
## Step 2 Build or use facebook application
If you had facebook application can skip this step
If you build facebook application and you can get this code
...
# Google Adsense domain 設置 一點設定 Google adsense 的心得
因為有時會寫一寫筆記或部落格記錄人生
然後因為工作進到跟廣告有點關係的公司, 遇到裡面的一些專家
有人提議說, 既然我有寫文章的習慣, 那也可以放個廣告賺一點錢
但我個人是不太喜歡放廣告, 畢竟大家都知道廣告是拖累網站速度的元凶
但最近想說試試可不可以在自己的網站放個一個版位的廣告, 看能不能抵掉 GCP 維持的費用(應該是不太可能…
所以就在自己寫的 blog 和自己做的一些 service 放上去試試
這紀錄一下一些在用 Google adsense 比較特別的行為與情況
## US 100 才能領出來 我這要等到幾時啊…
## Google adsense 是動態 CPC + CPM 計算價錢 所以沒一定的價格, 似乎有受流量影響
## 眾所皆知, 廣告通常是 by domain 申請, 現在用 subdomain 是不行的 很久以前依據在 subdomain service 的話似乎可以, 但現在不行了
因為我用 logdown 申請說不能用 subdomain 申請…(明明約半年前還可以, 只是當時不知為何一直說我違反他們的協議, 所以一直申請不過
但 Google 自己的 blogger 卻可以, 我試過了因為我有個 blogger, 但 Pixnet 我沒試過(不過 Pixnet 可以跟他們自己申請廣告分潤
...
# JavaScript - DOM object check array & isArray polyfill One day my colleague find a question.
ECMA script isArray is not work when object is DOM element
Array.isArray(document.querySelectorAll('div')); // false And polyfill for old browser
Object.prototype.toString.call(arg) === '[object Array]'; Still fail
Object.prototype.toString.call(document.getElementsByClassName('product-img')); // [object HTMLCollection] Object.prototype.toString.call(document.querySelectorAll('div')); // [object NodeList] So i try to make a polyfill
Array.isArray = function(arg) { var type = Object.prototype.toString.call(arg); if (type === '[object Array]' || type === '[object HTMLCollection]' || type === '[object NodeList]') { return true; } return false; };
...
# Vim - JavaScript auto complete 因為同事幾乎都在用 Vim 但我每次都在看他們一直打字我看了就很痛苦 所以就建議他們用 auto complete 的功能, 但我個人因為很少用 Vim 所以就讓他們自己去找套件(我個人不喜歡在 Vim 上裝套件)
但他們似乎都遇到困難 所以我就找了一下找到個不用裝套件又可用在 Linux 和 Mac 上最簡單的 JavaScript auto complete 的方式, 應該是因為 Vim 已經內建了
只要在 .vimrc 設定
autocmd FileType javascript set omnifunc=javascriptcomplete#CompleteJS 使用就是輸入部分關鍵字後先按 Ctrl + x 再按 Ctrl + o 就可以了
但只支援舊的 JavaScript API
Refer - How to auto-complete JavaScript syntax in Vim
如果要新的得再試別的方法 似乎可以補字庫進去 More
VIM的JavaScript补全
...
# HTML - redirect page from http-equiv ## Intro We can use JavaScript or PHP redirect page, we also can only use HTML redirect page
But not suggest use this way
Note: The value “refresh” should be used carefully, as it takes the control of a page away from the user. Using “refresh” will cause a failure in W3C’s Web Content Accessibility Guidelines.
使用 標籤進行重新導向可能會降低搜尋引擎排名。
## Usage <meta http-equiv="refresh" content="0;url=http://example.
...
# JavaScript - get CSS style Sometimes i want to use JavaScript get dom CSS style.
Use DOM.currentStyle and window.getComputedStyle(DOM)
For IE use DOM.currentStyle
Other use window.getComputedStyle(DOM)
var dom = document.getElementById("target"), style = dom.currentStyle || window.getComputedStyle(dom); console.log(style.marginTop); refer - Window.getComputedStyle() - Web APIs | MDN
refer - currentStyle object (Internet Explorer)
...
# Google Cloud Platform - 空間不足, 設定 swap, kernel 升級 ## kernel 升級, 設定 swap 最近強者我朋友在 Google Cloud Platform 上的 computer engine 上的 VM 升級 kernel 時發現升一升就 GG 了
連不進去了
用快照再開一台試驗還是如此
最後跟另一位大大研究了一下發現說原來是升級時記憶體不足導致整個系統卡住了, 然後又可能剛好 kernel 升級失敗所以就進不去 Lunix
因為是開最小的機器(f1-micro (vCPUs: shared, RAM: 0.60 GB) * does not support local SSD - 10GB storage)
我朋友又有跑許多 service 在上面, 所以記憶體會不足, 所以大大建議掛 swap 上去, 但 computer engine 在開 VM 時沒設 swap 的選項啊, 沒有切 partition 給 swap 的選項啊
...
# CSS4 - 關於 css4 and postcss 的一些想法 ## 前言 在年末才來發這篇文…
在今年大家開始瘋 react(咦? AngularJS 勒…), Babel, postcss
好像沒聽過上述這幾個詞就沒法自稱前端工程師(還好我現在都自稱打字員)
到了最近才有空閒研究 postcss 到底在做啥
一開始聽說可以無痛接軌未來(welcome to feature), 不像 Sass 未來如果要轉換就不好轉換(其實見仁見智啦)
聽起來好潮喔, 但很忙沒時間搭理它
而且這年頭的 tool 都越來越多步驟和許多工具要搞, 除非靜下心來專心研究, 不然哪有時間搞啊(感覺像是逃避的藉口…)
直到了最近自己有些小東西要改, 需要用到變數的功能, 就想到 CSS4 不是有大家夢寐以求的 var() 功能嗎(感覺潮潮的)
就花了點時間研究一下 postcss 這在 github 的專案
一看下去不得了, 包山包海一卡車功能, 還包含了之前聽別人介紹的連 Sass 的部分寫法的功能都有…
看完的瞬間想翻桌, 只是要寫個 CSS, RD 何苦為難 RD 呢, 我不需要那麼多功能啊~
還好有仔細看到主要 CSS4[註] 是用 cssnext 這專案來處理(網站還用回到未來的梗…)
所以我就果斷使用 cssnext 就好了(我真的很討厭用一套工具還要裝許多套件, 然後有的套件還不一定是你需要的不然就是有套件的部分功能是重複的…)
## gulpfile 設定 現在有一大堆 build tool 像是 grunt, gulp, browserify, webpack 等工具
...