About

這篇文章是用來簡單說明整個網站的運作原理，如果需要使用說明請見至頂文章。

架構

這個網站架設在Github Pages上，並且使用部落格平台Jekyll依照github上的repo產生自動html靜態網頁。整個網站的布景配置大部分採用Uikit前端框架，因此僅向下支援至IE 10。另外這整套系統也提供線上的後台，可以使用Facebook帳號登入並發文。

由於Github pages只提供靜態網頁託管，後台的伺服器部分皆是使用ajax向伺服器發送請求。而伺服器的部分採用Google Apps Script提供的「部屬為網頁應用程式」功能來處理發文、刪除文章、更新文章等動作。

而發表文章的功能只是採用Github API，並且使用Google Apps Script的FatchApp發送請求，而且每次發送請求的都會驗證Facebook的Access Token。

功能

後台的編輯器採用所見及所得的TinyMCE，可以插入圖片、超連結、程式碼等等。

展示

1. 圖片

2. 程式碼 (javascript)

這是這個網站後台Google Apps Script向Github API發送刪除請求的程式碼片段

/*
 * 刪除 _posts/[用戶ID] 資料夾下的文章
 * @Parameter postName : 想要刪除的文章名稱
 * @Parameter userID : 提出刪除申請的FB user ID
 * @return {boolean} : 成功:true ; 失敗:false
 */
function deletePost(postName, userID){
  var options = {
    "method" : "GET",
    "headers": {
      'Authorization': 'token XXX',
    },
  };
  var targetURL = 'https://api.github.com/repos/sescies/sescies.github.io/contents/_posts/'+userID+'/'+postName;
  var response = UrlFetchApp.fetch(targetURL, options);
  var json = JSON.parse(response.getContentText());

  var committer = {
    "name": "Li-Xian Chen",
    "email": "twbrandon7@gmail.com",
  };

  var data = {
    "message": formatTime(new Date()) + " 刪除文章 - 由系統自動Commit",
    "committer": committer,
    "branch": "master",
    "sha": json.sha,
  };

  //將資訊編寫進網址
  var targetURL = buildUrl(targetURL, data);

  var options = {
    "method" : "delete",
    "contentType": "application/json",
    "headers": {
      'Authorization': 'token XXX',
    },
    //'payload' : JSON.stringify(data),
  };

  try{
    var response = UrlFetchApp.fetch(targetURL, options);
    Logger.log(response.getContentText());
    return true;
  }catch(e){
    return false;
  }
}