Coding life

照例： github page 最原本我是使用connect搭配 serve-static 實做 const   connect  =  require ( 'connect' ); const   serveStatic  =  require ( 'serve-static' ); connect (). use ( serveStatic ( __dirname )). listen ( 8080 ,  function (){      console . log ( 'Server running on 8080...' ); }); 主要流程大概就是如此，搭配上 ngrok 大概可以測試個ssl需求的東西 後來從其他地方發現live-server這個好用的東西就拿他來做我暫時性測試和restful api的實做 另外live-server有提供live-reload的功能，只要當前關注的資料夾有異動，會自行reload，不過缺點是並不會clean cached 和 hard reload，這點請注意 一樣起手式 yarn global add live-server 在全域底下安裝live-server live-server [--arguments] 在該資料夾底下直接透過cmd、teminal直接啟動，在指令完成時會啟動default browser然後開啟頁面 沒有做其餘的設定的話，基本出來的url為 http://127.0.0.1:8080/ 如果沒有其他的指令的話，這基本上為固定的預設值，當然接下來就是介紹其他我常用的arguments --port=NUMBER 其實liver-server會自行檢測那一個port被佔用，然後自行尋找新的port --cors 這個提供api可以提供Access-Control-Allow-Origin，拿來做api測試服務很好用 --ignore=PATH || --ignorePattern=REGEX 設定忽略的位置，或者透過regular expression來做設定，這項...

github page ts-node是直接執行typescript使用的，若是不想做tsc的動作而直接執行的話可以直接利用 ts-node <path-to-file> 直接去做執行 這中間當然可以套用一些其他的options不過簡單執行這個即可 注意：因為ts-node是執行typescript，所以先確定系統當中是否已經安裝typescript 一開始當然先說起手勢啦 yarn global add ts-node 上一篇提到了yarn那就當然用yarn來做安裝的動作啦 安裝期間東西會有點多，網速慢的大概要注意一下 雖然說ts-node可以直接執行typescript的程式，但是實際上執行情況是先將typescript先compile後放在cache中，然後再做執行，所以並不會像nodejs運行js檔案那樣來的快速，中間還是會有經過一次編譯的動作 該報錯還是會報錯，不過好處是它會直接trace到.ts的檔案，一般的.map.js檔案如果當中沒有註冊或者安裝其他套件做設定的話，最高一層只會追蹤到js就停止，並不會往上追到原始碼去 Options: -e, --eval [code] Evaluate code -p, --print [code] Evaluate code and print result -r, --require [path] Require a node module for execution -C, --compiler [name] Specify a custom TypeScript compiler -I, --ignoreWarnings [code] Ignore TypeScript warnings by diagnostic code -D, --disableWarnings Ignore every TypeScript warning -P, --project [path] Path to TypeScript project (or \`false\`) -O, --compilerOpti...

來整理一下覺得不錯用的工具...以後應該會在繼續更新 首先是 yarn ，這東西是由facebook開發的，速度號稱是比npm還要快，我之前沒有很認真測過速度，不過就某些已安裝過套件包的部份來做比較的話，yarn的確有其優勢 另外需要注意的是  yarn不支援nodejs 4.5以下的版本，所以有專案在4.5以下的使用的話要仔細考慮 現在安裝的部份就ubuntu來說可以透過apt-get安裝方法，具體方法如下 from : yarn installation curl -sS https://dl.yarnpkg.com/debian/pubkey.gpg | sudo apt-key add - echo "deb https://dl.yarnpkg.com/debian/ stable main" | sudo tee /etc/apt/sources.list.d/yarn.list sudo apt-get update && sudo apt-get install yarn 接下來介紹yarn的指令 yarn 跟  npm install   一樣的用法 先安裝package.json裡面的dependencies，不過這邊值得注意的一點是，在yarn 0.17好像會把bower_components幹掉，所以我會先yarn再做bower yarn add <package-name>@<version> [--dev] 只是把  npm install --save   稍微換個名稱而已，基本用法差不多，值得注意的重點在於安裝全域的套件時要用以下的指令安裝 yarn global add <add/bin/ls/remove/upgrade> [--prefix] prefix帶出的是你所想要安裝的位置 接下來講install的相關 yarn install [--options] 就是  npm install   的擴充 options有數種屬性，我挑我會用的簡介 force : 重新下載一次dependencies，在寫程式當中可能因為某些原因動到裡面的原始碼，...

今天開機發現了螢幕log in的部分沒有了input field的黑色小框框 我猜是周五裝了一些東西沒有仔細檢查就做了update的關係吧.... 情況大概跟 這篇 有點像 不過還是可以輸入進去畫面 不過進去後所有的東西都跑掉啦，button的邊框、選擇的邊框、filesystem變得我都認不出來你是啥鬼、Wallpaper變黑的 第一直覺是unity你又再玩我了，基本上ubuntu有關視覺效果部分找unity算帳大概八九不離十 不過在檢查的時候一時不小心手賤KEY了以下指令 $ sudo startx GOOD  我的login部分可以loop了.... ctrl+alt+f1切上Terminal趕快把家目錄底下的.Xauthority幹掉重開再進去 接下來就是回復桌面的項目... sudo apt-get udpate sudo apt-get autoremove ubuntu-desktop unity sudo apt-get install ubuntu-desktop unity 或許有人說不是用 sudo apt-get install -reisntall ubuntu-desktop 就好，我試過，很神奇的沒有用... 結果我的桌面依然沒有出現不過按鈕其他的地方正常啦 想說就算了 之前因為有動過.conf的地方  很多東西要重來 開始處理輸入法問題((對  我的輸入法也跑掉了 這中間又發生一件手殘的事情.... sudo apt-get autoremove ibus 導致我的top banner 和 launch bar消失 然後就開始默默地重新安裝起了ubuntu-desktop 和 unity... 參考的是 這篇 然後回頭想到是不是我只有update沒有進行過一次upgrade 於是做了一次 sudo apt-get upgrade 謝天謝地  背景、launch bar、top banner全部都回來了，覺得開心

fetch是chrome 43版有的新功能 他是使用Promise去達成async的方法 可惜nodejs中沒有支援fetch必須安裝第三方node-fetch去達成fetch的使用 P.S. 目前我用的7.7.3版依然沒有內建，request老實說已經不想用了 另外最近覺得蠻感動的是chrome 57支援async/await原生啦，不過目前專案的瀏覽器受限於OS只能用43...OTL 就來簡單介紹一下它的功能吧 fetch說道能夠取代xhr和jquery的ajax大概是他的code捨棄了使用callback function這種噁心的東西 改成了目前處理同步/異步最方便的Promise語法 export   default   function   fetch ( url :  string  |  Request ,  init ?:  RequestInit ):  Promise<Response> ; 我直接拉node-fetch的定義檔說明 後面很明顯的return出來的是Promise的物件，解構之後會得出來是一個Response的東西。 一般對我來說最常用的大概就是POST和GET 所以使用方式就是 import   fetch   from   'node-fetch' ; let   a  =  async () => {      let   data  =  await   fetch ( 'localhost://getData.com' )                         . then ( res => res . json ()); } 如果用im...

最近在使用 dbus-native 來讓後端service可以接收DBUS訊號以及發出訊號至DBUS 因為使用typscript開發習慣了(想當初寫JS才發現有強型別的定義真的..差很多)，所以一開始就在找這隻檔案的定義檔有沒有放到@types的倉庫 OK...沒有 這個意思就是說，假若說我想要使用DBUS的話我必須要自行去定義，或者...乾脆直接硬幹 硬幹的話大概就是加入以下的東西就可以使用 import dbus = require("dbus-native"); 可是這樣就是沒有定義檔的提示可以使用 對於已經被TS養大胃口的我來說就很不方便... (另外一提，在javascript也是有IDE做提示function使用，不過Linux沒辦法使用visual studio，eclipse 吃資源，Webstorm沒錢 QQ) 對於這種IntelliSense,可以使用以下的方法添加最基本的支持(不過這對我目前的專案支援度超低...) 在require dbus的package後，我們是會從index.js開始對整支程式存取及使用，網路上有人做出對於該項package轉definition的工具，可惜...沒用，以下是這支程式的一部分程式碼 module . exports  =  createConnection ; module . exports . createClient  =  function ( params ) {    var   connection  =  createConnection ( params  || {});    return   new   MessageBus ( connection ,  params  || {}); }; module . exports . systemBus  =  function () {    return   module ....

其實es6是yield來做標題所述的流程控制, 不過說真的我比較習慣用promise with async await... setTimeout (() = > { console .log ( 1 )}, 5 ); setTimeout (() = > { console .log ( 2 )}, 1 ); setTimeout (() = > { console .log ( 3 )}, 3 ); setTimeout (() = > { console .log ( 4 )}, 2 ); 以下是結果 2 4 3 1 這樣的情況最容易發生在讀取外部資料時程式在還未接取完全資料,流程卻繼續進行下去 以往是使用callback function來解決這個衝突, 不過這樣非常形成callback hell導致程式維護以及閱讀不容易 目前的nodejs以及新的瀏覽器都有提供了promise的用法,在nodejs 7.0以上的版本有支援async await的語法, Typescript於 2.1也可以編譯async await後在es3 es5的情境下使用 剛剛寫的是用typescript不過在沒有加註情況下跟es6差不多.... 假若說我希望是顯示結果是1 2 3 4這樣照順序下來的話... new Promise ((res,rej) = > { setTimeout (() = > {res( 1 )}, 5 ); }).then(res = > { console .log (res); return new Promise ((res,rej) = > { setTimeout (() = > {res( 2 )}, 1 )}) }).then((res) = > { console .log (res); return new Promise ((res,rej) = > { setTimeout (() = > {res( 3 )}, 3 )}) }).then((res) = > { console .log (res); return new ...