跳到主要內容

發表文章

目前顯示的是有「browser」標籤的文章

[分享] Node.js server & Github webhook combine

通常 deploy 有許多種方式,最簡單的方式就直接採用 web hook ,特別是在 github 裡面有支援這樣的模式,你只要到 github project -> setting 就可以看到如下圖所示的方式 當然 github 預設提供了許多不同的 hook 方式給予大家做選擇,不過因為我只會最基本的 web hook ,就選用這個方式來進行吧。 設定 endpoint web hook 原理就是, 當開發者 push code web hook 啓動 會觸發某個 endpoint 在 web hook 裡面要設定的欄位就是一個很簡單,可以接收 POST 的 URL。 像這邊,我們可以設定 caesarchi.com/deploy 接著就是伺服器部分的設定了。(可以參考之前的文章 起一個 server and route ,或者參考 Node.js 台灣社群協作電子書 )。 從 github 傳遞的訊息 透過 github webhook 他會透過 POST 的方式傳送資料,會帶過來一個名稱為 payload 的變數。 payload 傳送一串 JSON data 過來,因此可以透過 JSON.parse 還原回來原本漂亮的樣子。 裡面會帶來這次 push 上來的 commit, branch, files 等相關資訊,我們可以透過這些資訊來達到自己的目的。 待會將會提到這個部分。 另外如果自己目前沒有任何 server 但是想要測試 github webhook 丟過去的訊息為何!可以考慮使用 requestb.in ,觀察 webhook 後收到的資訊。 web hook 的啓動 首先,就是在伺服器端需要新增一個 POST Route ,並且可以執行程式伺服器的 shell 程式 。 在 POST 接收到之後,我們可以透過 Node.js child process 的方式啓動另外一個 shell 指令,進行部署動作。 這邊提供一個簡單的 code pattern. 從上面的程式我們可以看到到,透過 JSON parse 的方式,可以把 github payload 還原回 Object 。接下來都可以直接採取 JS ...

Cloud Service 再窮也要玩

cloud service 雲端服務集合,目前開發 Node.js 服務大多需要 express, socket.io ,這兩者服務通常會使用到 MongoDB,Redis,但是如果只是為了架設 prototype 而自己搞了一堆環境,簡直就是搞死自己。用 Amazon 又還不到這個階段,而且沒有信用卡,該怎麼辦? PaaS 以 Node.js 服務來說,目前已經有許多 PaaS 廠商提供免費的服務環境,有底下幾間可以參考。 Nodejitsu dotCloud cloudfoundry heroku 以服務來說,使用經驗上比較推薦使用 Nodejitsu ,首要在於 Socket.io 的支援上,Nodejitsu 可以支援到 Websocket ,另外也提供 https 認證支援,因此不需要特別去買其他的 certification。 另外 Nodejitsu 目前已經是 Joyent ,合作廠商之一,因此 Nodejitsu 的服務器都是架設在 Joyent ,同時支援目前最新版本的 Node.js 版本。

[分享] Blogger 開放行動服務範本

前幾天用手機在看自己文章的時候,還深深厭惡Blogger在手機上的View,今天看到 Blogger正式開放Google行動服務範本 ,這則消息就趕快開起來使用看看。 進入Blogger設計版面後,選擇電子郵件及手機號碼。 選擇, 是,請在行動裝置上顯示行動版的範本。 接著捲到頁面最底下按下儲存,完成開啟手機瀏覽介面了。 趕快開起來看一下我的手機看一下新版面的感覺。 真是太感動了,如此一來就可以跟Tumblr的手機瀏覽感受相同, Google 就甘心耶!~

[筆記] YUI widget Calendar 屬性修改

上次介紹 到YUI有個好用的widget Calendar,而我們可以使用 YUI2 in 3 的方式來使用 ,今天收到一個bug就是『 Calendar未抓取server時間 』,當下我的感覺就是... 為什麼~為什麼~為什麼~ 經過一番討論之後....我..... 屈服了~ 畢竟事情還是要解決,因此採用方法如下: 1. php 輸出資料於頁面上 2. javascript 取得頁面資料 3. 將資料設定在YUI calendar

[CSS] z-index 在不同瀏覽器繼承問題

今天會討論到這個課題,是因為要實做一個Popup dialog,所以我們希望的結果如下圖。 可是在IE7 卻發生了這樣的情況。 Popup不論怎麼設定z-index都無法浮在最上層,我們看一下html架構發生什麼事情。