2016年4月4日 星期一

三月份的閱讀心得

最近好少寫文章,其實工作上大量的閱讀關於 Angular 的文章,不過一時也吸收得太多,我也不知道該怎麼一鼓作氣整理所學的內容,再加上回家也累了,我期待 Angular 2 出來的時候再看看有沒有動力寫 Angular 技術文好了...

不過值得記錄的是最近看的幾篇文,幾本書:

如何讓馬飛起來

Books書籍資訊。

如何讓馬飛起來,是物聯網 (Interner of Things, IoT) 這個詞的發明者 Kevin Ashton 的第一本著作,老實說他沒出書我還真的不知道這號人物...,作者是麻省理工 Auto-ID 中心主任。任職過很多家公司,物聯網這個概念跟他在 K&G 工作時為了瞭解唇膏的銷售狀況有關 (看書就知道了 Xd)

這本書雖然看的有點吃力(我有一種在看歷史的感覺 XD),但是仔細看,他其實點出很多過去關於發明, 創意的例子,以及"阻力",還有一些創造過程中的盲點。

我覺得有趣的點在於,很多事物的發明原因,在這本書都有提到一些細節,有幾個故事確實會讓人恍然大悟,有些事情,也許在我們這個年代,會覺得是基本常識,但是在過去,或許是經過好多人奮鬥, 被孤立, 被抓去關, 被憂鬱症慢慢爭取, 發現而來的。

人們嘴巴上說接受創新,卻又害怕改變,很矛盾吧
?!

還有,原來香草這種香料,這麼難種,過去歐洲很多皇室都很寵愛這種香料,但因為太難種植,困擾農民很多年,厲害的是,一個非洲奴隸男孩發現了如何幫香草蘭授粉。

三月份的數位時代雜誌

有一次在誠品逛呀逛,在等朋友吃飯,順手就買來看,上班通車的時候也看。
這期我特別注意的是成長駭客的內容,網站上有個簡單的版本,有興趣可以看看 http://www.bnext.com.tw/article/view/id/38809。

不過這期對於成長駭客的內容還是太少,當然如果是想要 brief 瞭解一下的話是 ok,關於成長駭客可以看范冰出版的成長駭客。 其實這本雜誌有些地方也有提到是參考范冰這本書的內容。

另外有趣的是某一章提到 Airbnb 如何發起的行銷手法。Airbnb 早期的對手是 craigslist, 為了吸引用戶,只要在airbnb發布自己的租屋資訊,就會幫 user 也發布到 craigslist, 不過 craigslist 根本沒有這有這種API 可以讓 airbnb 去 call, 結果就是硬刻這個功能(我猜應該是去爬Dom 抓selector, 幫user塞值再post吧),還好效果不錯,不然這種利己利他的行銷方式,技術成本應該蠻高的…

airbnb 這個例子,讓我想到以前也有朋友跟我提過,他想做二手拍賣網站,結果案主希望把後台做得像主流拍賣網站的後台,因為他認為 user 已經熟悉主流網站的的介面很久了,如果自己試圖創新, 改善出一套新的流程,很難吸引顧客。你說,到底要不要創新?! 如果你是一位 UX,你會接受把自己的介面做得像別人一樣嗎? :P


實在的力量
實在的力量是 Delta 榮譽董事長講述他的成長, 創業過程。因為這本書寫的方式比較偏口述,所以讀起來非常快速。看完終於大概比較了解 Delta 在做的是什麼哪些產品,在我心中,我覺得這是一家很低調的公司,可是做的版圖其實是非常大的。

自從年初看過鋼鐵人馬斯克之後,真心覺得潔淨科技是很值得發展的事業,愛地球嘛! 能環保的事業,本來就很值得發展。不過 Elon Musk 這本書,我真的很推薦去看一下! (怎麼離題了XD)


給回來的旅行者

這算是一本尋求心靈某種層次的書籍吧,我沒什麼特別的感覺耶 >////< 可能我現在對生活很滿意。 我想我還是適合看現實層面的書籍,或是商管, 資訊類的 XD

這本書雖然在書店裡是暢銷排行榜上,不過我發現我愛的書路,大部份都不在暢銷排行榜上面,所以說... 看書還是要看自己有興趣的 XD


大概是這樣....,最近我漸漸迷上看雜誌了,多看一些趨勢, 新知,好像也挺好的 (不過我今年想要看完100本書的目標依然沒有改變)。像我今天早上才在看去年9月份的30雜誌,提到未來的三塊主要發展內容,分別是 VR(虛擬實境), AI(人工智慧), 還有 IoT(物聯網)。雖然虛擬實境在過去曾經有一段時間跌到比較低谷 (2000年左右,因為當時的設備跟應用環境都不到位),但後來又發起了。越來越多的硬體設備想要接上人類身邊使用的 Device,以工程師的角度來說,應該會有很多主題可以做...,但我最近真的覺得,同時要兼顧程式能力跟學習新知是很難,這是取捨,我只能盡可能用我可以付出的時間... 多換一點新知來....

2016年3月28日 星期一

CSS table border-radis Table 要有圓角的效果

source from: http://stackoverflow.com/questions/628301/css3s-border-radius-property-and-border-collapsecollapse-dont-mix-how-can-i

這個超連結的解法 試了之後,覺得這個解挺方便:
作者是: cmrd.Kaash (32 vote 的那個解答)
table {
    border-collapse: collapse;
    border-radius: 30px;
    border-style: hidden; /* hide standard table (collapsed) border */
    box-shadow: 0 0 0 1px #666; /* this draws the table border  */ 
}

td {
    border: 1px solid #ccc;
}

2016年3月25日 星期五

Docker 出現 Error response from daemon: 404 page not found ....

網路上找到一堆奇奇怪怪的結法在我mac上都不適用

最後重開就好了

docker-machine stop && docker-machine start

不過唯一一個差別就是,404 page not found 的時候,我用 docker version 指令,只看得到,看起來是因為只剩client而導致404:
Client:
 Version:      1.10.2
 API version:  1.22
 Go version:   go1.5.3
 Git commit:   c3959b1
 Built:        Mon Feb 22 22:37:33 2016
 OS/Arch:      darwin/amd64
Cannot connect to the Docker daemon. Is the docker daemon running on this host?

而重啟之後,client 跟 server 都回來了:
Client:
 Version:      1.10.2
 API version:  1.22
 Go version:   go1.5.3
 Git commit:   c3959b1
 Built:        Mon Feb 22 22:37:33 2016
 OS/Arch:      darwin/amd64

Server:
 Version:      1.10.2
 API version:  1.22
 Go version:   go1.5.3
 Git commit:   c3959b1
 Built:        Mon Feb 22 22:37:33 2016
 OS/Arch:      linux/amd64


額外參考:

2016年3月22日 星期二

[小記] 把 D3 的Collapsible Tree 範例改成 vertical 垂直顯示

原本想要使用的 sample: http://bl.ocks.org/robschmuecker/7880033  (有拖拉)  http://bl.ocks.org/mbostock/4339083 (不含拖拉),

目標: 改成垂直顯示 (水平轉垂直)。

因為有點難 google 到現成的 sample,後來我發現只要把程式中有關  transform 的參數,只要有 x, y 的,把順序對調。

拖拉的 function 也是 x, y 對調,如 centerNode 的 x, y, updateTempConnector, .on('drag') 的 x,y 。

另外 projection 的地方也要對調。

不知道該不該說自己是 D3 新手..明明好一陣子有看書... 只是沒用,都忘了。


參考:
1. http://bl.ocks.org/d3noob/8326869
2. http://bl.ocks.org/mbostock/3184089
3. http://stackoverflow.com/questions/18099430/how-to-change-orientation-of-a-d3-tree-layout-by-90-degrees
4. https://github.com/mbostock/d3/wiki/Tree-Layout
5. http://jsfiddle.net/augburto/YMa2y/
6. http://stackoverflow.com/questions/17558649/d3-tree-layout-separation-between-nodes-using-nodesize


2016年3月21日 星期一

[angular] 修正 controller 重複呼叫 function

有使用 $routeProvider, 發現網址指過去的 controller,在瀏覽頁面的時候會重複呼叫,方法之一是檢查 $routeProvider,之二是,$routeProvider 已有指定 templateUrl,所以如果你 template 有 Div(或其他 HTML ) 的 attr 有指定 ng-controller 要拿掉。

(說真的我也不知道為什麼這樣解得掉)

搜尋關鍵字:  Double calling controller in Angular JS.

2016年3月15日 星期二

Eclipse 加入 tomcat server installation directory

如果是用 homebrew 安裝的 Tomcat
雖然路徑是 usr/local/Cellar/tomcat/X.X.XX
但是在 Eclipse 的 New Server Runtime Environment 時要改寫:
/usr/local/Cellar/tomcat/X.X.XX/libexec


在 eclipse 加入 tomcat server:
1. Window -> Preferences -> Server -> Runtime environment 然後按 Add
2. 環境選擇 apache tomcat
3.


4. Finish

我猜了好久的 path, 原本 Next> 一直不能按,直到 google 到這篇。

另外也可參考:
https://github.com/OneBusAway/onebusaway/wiki/Setting-Up-a-Tomcat-Server-in-Eclipse

2016年3月12日 星期六

最近看的一本書,華爾街之狼從良記


華爾街之狼從良記

上週末偶然在書店看到的一本書,剛好他也沒有打折但我很有興趣,買回家看看,非常喜歡這本書,作者描述他在華爾街上班之後的人生,以及之後跟巴菲特共進一餐,身邊遇到一些良師的過程。

不知道該不該推薦給大家,只是我很喜歡看這種調性的書,而且也因為這本書,我才知道基金, 債卷的世界太複雜,這本書的描述,讓我覺得華爾街是個不缺人才的地方,每個人學歷都不差,卻是滿滿的競爭世界,既不像是團結,反而像是想辦法從投資人身上賺到錢的高材生,可是手段卻不一定是良的...

前面兩三個章節我覺得挺精彩的,後面就稍微平淡一點,但也是有特別的地方,包含作者經營自己的公司,持有一些基金,遇到的一些錯誤,另外他也有分享一些他做投資的幾種原則。

後繼有列出一些作者提供的書單,我覺得還不錯,他列的書不一定都是跟經濟 金融有關,有幾本我也很有興趣!


心得就是,金錢的遊戲應該不是我這種平凡之人能夠玩得起的,但是引以為鑒,有很多做事的方法,也通用在其他工作內容上.

2016年3月11日 星期五

鐵三角 ATH-MSR7 不專業開箱文


上週末難得有空去逛逛街,買了這隻鐵三角的 ATH-MSR7,其實只是路過看到,喜歡就...買了,其實我很少用耳罩式的耳機,只是最近會喜歡躺在床上聽音樂,既不用戴眼鏡,好像很適合買一隻耳罩式的回家用用!

2016年3月10日 星期四

Apache 開啟支援 SSI 功能

幫忙起一個我完全不熟悉的 Web Site 在 Apache 上,副檔名是 shtml,而且 shtml 裡面夾帶很多 <!--#include file="/XXX/XXX" --> 的這種格式,而我去 google 這種 include 的方式要讓 Apache 讀得懂,要開啟 SSI (Server Side Includes) 以及開啟 Include 。

主要的做法,請參考 http://httpd.apache.org/docs/current/howto/ssi.html,其實寫得很清楚~

而且, <!--#include file="" --> 好像不是 apache server 在看的格式,好像是 IIS 系列的 server,我後來發現 apache 根本看不懂 include file 這個詞,還要把 file 都換成 virtual 這個單字才行,否則爬出來會得到 [an error occurred while processing this directive] 這樣的錯誤訊息。 (如果有人知道怎麼讓 apache 也看得懂 file 這個詞來做 include 請跟我說 Orz 謝謝你!但前提是不改動 include 這個單字)

首先先讓你的 apache 啟用 Include, rewrite 的功能(rewrite 要不要我忘記了.)

1. apache 要開啟 include 的功能
a2enmod include

2. apache 要開啟 rewrite 的功能
a2enmod rewrite
記得重啟 apache。


接著 apache 修改的部分,修改 httpd.conf,在 Options 的地方加上 Includes。像是:
<Directory /var/www/>
        Options Indexes FollowSymLinks Includes
        AllowOverride All
        Require all granted
</Directory>
或是你只把 AllowOverride All 打開,然後在專案目錄下透過 .htaccess 來複寫也可以。如果你是想用 .htaccess:

.htaccess
Options Includes
AddType text/html .shtml
AddOutputFilter INCLUDES .shtml
AddOutputFilters 加入 .shtml 表示只要付檔名是 shtml 就先經過 Inludes 的過濾,假如你的  <!--#include virtual ="" -->  是寫在副檔名是 php 的檔案情況下,則 AddOutputFilter INCLUDES .php .shtml,只要再加上 .php 就行。


就這樣,我 try 了好久,發現雷踩在根本忘記 a2enmod include 開啟 apache  的 include 模組。當初還以為 php -S 的方式就可以讀這種 include 的方式... 結果路要繞道用 apache 的方式去看, IIS 我又不熟 ... 不過好險,至少可以看到畫面了 :P

[過程記錄] Mac 上用 Docker 起 apache server

需求: 用 Docker 起 Apache Server,並且將 local (本機) 的 web 資料夾 Mount 到 Docker Container 的 web 資料夾。

安裝 Docker Toolbox
首先要安裝 Docker Toolbox,(昨天發現我還停留在 boot2docker...),進到官網,按下載,因為我是 Mac 所以我選左邊 Download~

2016年3月8日 星期二

[Bootstrap 補充技巧] Bootstrap 讓 Grid 的項目 column 能夠等高

怎麼讓 Bootstrap 的 Grid 的 column 等高呢?! 好奇怪感覺這需求應該很早就應該出現,結果我這幾天才發現到..

舉個例子,如果你每個 column 內容不一致,那麼每個 Row 的內容高度也會不一致:
(我用 jsbin 來寫 sample code),會向右邊那樣,我預期希望黃色跟藍色的區塊可以跟紅色的等高:


後來 Google 發現有人幫我處理好這個好用的功能了,他是利用 display 的 flex 的屬性來達到每個 column 等高,請參考 http://getbootstrap.com.vn/examples/equal-height-columns/。 用法文件寫得很清楚,要引用這個作者寫的 .row-eq-name 樣式 ,然後在需要等高的 row 上附加這個 class name .row-eq-height 

Example: <div class="row"> 加上 row-eq-height <div class="row row-eq-height">

注意事項
* Flex 只支援到 IE 10
* .row-eq-height 可能會改變原本的 column wrap 的行為,所以還是得取捨,至於差別在哪,你多測測 螢幕小一點的時候就知道了,原本設定的 column 變化可能會因為 row-eq-height 而有點不同哦!


2016年3月7日 星期一

新工作就這樣快開始了..


從去年 11 月離職到現在,大概也休息了快四個月了。

這四個月發生好多事,書我大概看了快15本,學了一點 Java 的皮毛,看了一些重構, 團隊合作方法的書籍。心裡是很滿足,如果可以一直這樣悠哉下去該有多好,可惜我也不是有錢人,在台灣現在這種經濟狀況下,還是要賺錢啊~

至於工作,這次求職主要都是主動出擊為主,恩.. 畢竟前兩份工作都是靠推薦/認識而錄取,我希望這次多多少少是零人脈關係而取得的工作機會,當然也有幾次面試的公司還是朋友介紹 Orz..,其實朋友介紹的工作也不錯(只是我有時候內心也會想,是不是大家當朋友會更適合呢?! )

前幾天我才跟我朋友說,我好想再休息一下。然後就被電了..."你還想再休息啊! 你已經休息很久了耶!",想想也是,我大概是個停不下腳步的人,硬要把自己弄得好忙好忙,再來靠腰自己好累,這個性子到底是怎麼來的...

Anyway, 我希望很順利 :)

Samsonite RED VORTEC 不專業開箱文

一直很想換一個平常上班也可以背出去的電腦背包,主要是可以放電腦,因為我出門幾乎會帶著電腦,這樣隨時可以工作。我上一個包包是 Outdoor,用了將近三年,因為質地太軟,我還因為這樣買了一個殼來裝筆電,再來是內容物不好喬位子,光是充電線就有兩三條。所以我這次換電腦包主要是想要有點殼狀的,最好是內搭筆電保護層,接著夾層多是其次。

然後我就買了 Samsonite RED xd,其實本來是想買李敏鎬代言的那一款,但是因為現場背,發現我真的不適合那種藍色,QQ 殘念,最後買了最新款,也是沒有打折的一款... Samsonite RED VORTEC! 定價台幣 5700。(如果你買到更便宜請不要告訴我謝謝 TT)


考量到我的工作習慣,我需要的包包實在太需要夾層了,不過我發現 Samsonite 的背包,夾層都不少(這款還不算多呢..)。






購買時會給保證書:

整體的感覺我覺得還是要親自到店家背背看才準,我昨天在網路上物色的款式,背上去都沒想像中喜歡。不過有一點我覺得蠻出乎我意外之外的是,Samsonite RED 我覺得挺耐看的,其實我本來沒打算買這款...,但到實體店面之後,看久了還是決定帶他走了~

至於紅色會不會很高調,其實是有一點拉.. 但我是覺得搭配衣服不會太難...,再來是還好他有一條藍色的滾邊,降低了一點高調的程度。

我就不放我本人背起來的樣子了,這種包包只有韓星背起來才充滿夢幻感,至於我,不過就是個南部來的台灣工程師而已,我怕這一放,降低大家想購買的意願 XD



接下來又得繼續努力工作了...

Vue multiselect set autofocus and tinymce set autofocus

要在畫面一進來 focus multiselect 的方式: 參考: https://jsfiddle.net/shentao/mnphdt2g/ 主要就是在 multiselect 的 tag 加上 ref (例如: my_multiselect), 另外在 mounted...