facebook page feeds

由於看到一些 feed 內容還不錯，但是每次從 RSS reader 看完後再手動儲存下來有點累(我習慣儲存在 google form)，雖然每次作一次這種複製貼上的過程中可以再多看一眼，但久了還是會累（已經蒐集了700多筆後...）

Facebook 的 page 有提供 rss feed 給其他網站使用，其提供的型態有三種 AOTM, RSS2.0, JSON，使用方式如下：

JSON https://www.facebook.com/feeds/page.php?format=json&id=246748395427671

ATOM https://www.facebook.com/feeds/page.php?format=atom10&id=246748395427671

RSS https://www.facebook.com/feeds/page.php?format=rss20&id=246748395427671

最後面所帶的 id 就是 pageId，如果不知道 pageId 可以到下方連結查詢，只要把 url 中的 'AppStore' 至換成你的 page 名稱

https://developers.facebook.com/tools/explorer/?method=GET&path=AppStore%2Ffeed

查詢結果會顯示 pageId 如下圖

以上已經完成了一大步，順利取得 Feed 來源，接來來就是快快樂樂使用 Google Apps Script 自動儲存到 google form 中 :)

相關連結
facebook developer
Google Apps Script

SlideNote new feature transition and themes

SlideNote 過去只有一個樣板，我認為字型就像是投影片的靈魂，沒有好的字型看起來就是有點缺陷，所以新增了 8 個字型與配色，以及 7 種過場動畫。

Screenshot


字型、配色：Default, Beige, Moon, Night, Serif, Simple, Sky, Solarized


Transition：Cube, Page, Concave, Linear, Fade, None


相關連結
SlideNote

http response \ufeff

前幾天遇上從 server api 拿到的 response 會在第一個字元收到 \ufeff，jquery 的 ajax 會直接 fail，但直接看 response 會發現 status code 一樣是200，json 的內容也是正常，但 ajax 就是會變成 fail。

目前查詢到的資料來看，這是 utf8(BOM) 的問題， IDE 的編碼在儲存時如果編碼為 BOM 會在第一個字元插入\ufeff，而\ufeff這字元是個特殊的空白字元，一般的 IDE 會自動把這濾掉，所以你將 response 貼上 IDE 想要檢查問題出在哪一般也看不到，建議使用 vim 來看，會清楚的看到這字元，或者 chrome 的 inspect 也會發現如下圖的紅點：


其實這問題看起來真的跟使用的語言無關，似乎與 IDE 關係比較大，從 google 搜尋看起來就是跟網路相關的語言都容易碰上（如下圖）


Nodejs 的 V8 會自動將這字元濾掉，除非你連續寫了兩個\ufeff，不然不會發生，其他語言可能就要注意一下，在發生這問題請不要懷疑自己寫的 code，應該先去查 IDE 的編碼，而這問題也不會是前端的問題，由 server side 處理更為恰當。

grunt-contrib-connect fake api with yeoman

依照現在 F2E 正夯的狀況，很多 front-end 都會希望不需要等 backend 先寫完 api 才可以接資料，或者要等 backend 先開出假的 api 後才能動工，最好的方法就是先確定好資料結構後雙方就可以開工，也可以減少 api 寫完後才發現沒辦法接好的問題。 yeoman 是個相當好用的前端開發輔助工具，尤其 liveboard 大量增加 f5/ctrl + R 的壽命，如果能再結合假資料 api 拿來測試那就再完美不過了。

立馬下載
git clone https://gist.github.com/7210042.git

使用方式 （好讀版）
Step1. 下載 redirect.js 到專案根目錄.
Step2. 編輯 Gruntfile.js

var redirect = require('./redirect');

...
...


connect: {
options: {
port: 9000,
// change this to '0.0.0.0' to access the server from outside
hostname: '0.0.0.0'
},
livereload: {
options: {
middleware: function(connect) {
return [
lrSnippet,
mountFolder(connect, '.tmp'),
mountFolder(connect, 'app'),
redirect('api')
];
}
}
}
},

Step3. redirect 有三個參數. rootDir 是假 api 根目錄. indexFile 是預設連結的檔案. headers 是 http response 的 header，範例：

/app
...

/api
/user
index.json
list.json
...

/Gruntfile.js
...

Step4. run "grunt server"
當讀取 url "/user" 會自動導到根目錄的 "/api/user/index.json"
當讀取 url "/user/list.json" 會自動導到根目錄的 "/api/user/list.json"


相關連結
https://gist.github.com/IskenHuang/7210042
yeoman

SlideNote - markdown makes slides

Markdown 是個很棒的編輯文件方式，尤其在程式文件嵌入原始碼也是非常方便，甚至坊間也很多專門做 Markdown 的編輯器，但是每次整理完文件如果需要再做出一份簡報同時就會造成很大的困擾：

1. markdown 要怎樣 copy/paste 到 keynote/powerpoint 上？
2. 基於理由一，乾脆放棄，開始問：「能不能直接用 markdown 來簡報？」

所以認為最根本的問題是「怎樣直接拿 markdown 做簡報」，方法很多，直接轉換為 ppt(powerpoint)/key(keynote) 檔、讓 markdown preview 為 slide show、直接線上轉換為 slide，這些想法都非常棒，但為了最快速解決「怎樣直接拿 markdown 做簡報」的問題做了現在的「SlideNote」

SlideNote 主要的目標：

1. 用 Markdown 直接產出 Slide
2. 完全使用 Markdown 語法
3. 線上編輯，線上產出

截圖 slide show


截圖 編輯 markdown 文件


截圖 首頁



因為快，所以很多東西都還不完整，歡迎隨時來亂玩它，有問題或建議首頁左下角有 feedback 可以馬上回報給我：）

相關連結
SlideNote