»

Correct the Issue of Category Display

Log — Posted by Starck on June 25, 2013


修正 index.php:

Guard is My Best Friend

Coding, Design — Tags: — Posted by Starck on June 24, 2013


Guardfile 語法說明


  • guard :<plugin> : 使用 plugin
  • group :<group name> … end : 定義一個 task 分類區塊
  • %w[] : Ruby 宣告 Array 的方式, 用空白區分
  • :key => value : 宣告 Hashes 的 key/value
  • %r{} : Regexen 正規表達式, 可到 rubular 測試

Ruby語法參考, Guard語法參考

Group

example:


Plugins


CoffeeScript

guard-coffeescript

編譯 CoffeeScript

  • input : .coffee 路徑
  • output : .javascript 輸出路徑

example:


Concat

guard-concat

合併檔案

  • type : 檔案類型 (副檔名), ex: css, js
  • files : 哪些檔案要被合併, 用 Array 的方式定義
  • input_dir : 來源路徑
  • output : 合併後的檔案 (去除.副檔名)

example:


Livereload

guard-livereload

  • Blocks/Closures
  • watch : 偵測什麼的檔案變化, 可以用 %r 正規表達式

example:

可用參數:

example:


Minify

example:


PHP Unit Testing



參考完整 Guardfile 範例

Laravel-Guard Example:

My Laravel Example :

Vim Page Scroll in Terminal.app

Log — Posted by Starck on June 24, 2013


修改 Terminal 的鍵盤設定:

  • Home : \033[1~
  • End : \033[4~
  • PageUp : \033[5~
  • PageDown : \033[6~

Foundation 4 Grid hack for IE8

Design — Tags: , , — Posted by Starck on June 24, 2013


修改 HTML:

CSS:

轉移 beyond.com.tw

Log — Posted by Starck on June 24, 2013


決定將 beyond.com.tw 轉到跟 starcklin.com 同一台主機上, 方便以後的管理。

預計的工作內容為:

  • DNS 設定 (已完成)
  • Server 的 Apache 設定 (已完成)
  • 檔案上傳到 Server (已完成)
  • 用 WordPress 的 import / export 轉移資料) (已完成)
  • 更新 WordPress (已完成)
  • 調整 Plugins 與 starcklin.com 一致

Redirect in BASH

Log — Tags: — Posted by Starck on June 23, 2013


# 執行 command, 標準輸出結果轉到 correct.txt, 錯誤輸出結果轉到到 error.txt
$ [command] 1> correct.txt 2> error.txt

要讓錯誤輸出結果不顯示, 可以利用/dev/null:

$ [command] 1> result.txt 2> /dev/null



example:

# 顯示 gem 的規格, 如果沒有這個 gem 則不顯示任何訊息
$ gem spec [gem name] 2>/dev/null
# gem spec zurb-foundation 2>/dev/null

beyond inc. ASCII Art

Log — Posted by Starck on June 20, 2013


Modern Testing with Laravel 4

Coding, Log — Tags: , , — Posted by Starck on June 18, 2013


Behavior-Driven Development

簡稱 BDD, 簡單地說就是用一種情境設定的方式來進行開發的過程。

在 Laravel 4 我們需要以下三種組合之一:


Codeception Installation

# 下載 codecept
$ wget http://codeception.com/codecept.phar
# 初始化 codecept, 它會建立所需的檔案在目前的目錄中的 tests 資料夾
$ php codecept.phar bootstrap

查看有什麼指令可以使用:

php codecept.phar

修改 tests/functional.suite.yml:

因為我們新增了一個 Laravel4 的 module, 所以讓 Codeception 再次重新建立所需的 Class:

php codecept.phar build


Codeception Usage

建立第一個測試:

php codecept.phar generate:cept acceptance Fisrt

Codeception 會在 tests/acceptance/ 下建立一個 FirstCept.php 檔案

內容為:


First Scenario

  • 我要到 / (網站首頁)。
  • 我看到了 Hello World! 這段文字出現在首頁上。

這樣的情境,寫成測試檔就變成如下:

執行測試:

php codecept.phar run


Zombie.JS and Mink

由於 Codeception 的 PhpBrowser 是基於 PHP Curl 去實現模擬 Browser 的操作, 所以面對一些會有 Javascript 互動的網頁,在測試上就會顯得力不從心。還好 Codeception 提供了 ZombieJS module, 我們可以得到一個更真實的模擬測試。

Zombie.JS

Zombie.JS 是一個 NPM 的 package, 所以在這之前我們必須先安裝好 NPM 的環境。

將 zombie 1.4.1 版安裝到全域環境:

sudo npm install -g [email protected]

2013-06-18 註: 經測試, 目前只能裝 1.4.1 的版本, 版本太新 Mink 不支援.

開啟 ~/.bashrc, 加上 NODE_PATH 的設定

export NODE_PATH="/usr/local/lib/node_modules"

Mink

composer.json 中加入到 require:

"behat/mink": "1.5.*@dev"

重新更新 composer:

composer update

目前已知問題: checkOption(), uncheckOption(), executeJs() 無作用


Selenium2 and PhantomJS

比起 Zombie.JS, 我更喜歡 PhantomJS, 更穩定且資源豐富. 主要看到官方的一些範例, 真得相當地強大, 甚至可以 Screenshot… (Codeception 用來當發生測試失敗時會將快照存在 log 資料夾, 相當地方便!)

要使用 PhantomJS 當作 Browser, 我們需要 Selenium2 作 driver.

先執行 Selenium2:

java -jar selenium-server-standalone-2.33.0.jar

將會啟動一個 Selenium2 Server, 預設會使用 port 4444, 如需修改可在後面加上 -port 參數:

java -jar selenium-server-standalone-2.33.0.jar -port 8888

08:17:34.571 INFO - Java: Apple Inc. 20.45-b01-451
08:17:34.572 INFO - OS: Mac OS X 10.7.5 x86_64
08:17:34.584 INFO - v2.33.0, with Core v2.33.0. Built from revision 4e90c97
08:17:34.691 INFO - RemoteWebDriver instances should connect to: http://127.0.0.1:4444/wd/hub
08:17:34.692 INFO - Version Jetty/5.1.x
08:17:34.692 INFO - Started HttpContext[/selenium-server/driver,/selenium-server/driver]
08:17:34.693 INFO - Started HttpContext[/selenium-server,/selenium-server]
08:17:34.693 INFO - Started HttpContext[/,/]
08:17:34.738 INFO - Started [email protected]
08:17:34.738 INFO - Started HttpContext[/wd,/wd]
08:17:34.746 INFO - Started SocketListener on 0.0.0.0:4444
08:17:34.746 INFO - Started [email protected]

接著啟動 PhantomJS 跟 Selenium2 連接:

phantomjs --webdriver=4444

PhantomJS is launching GhostDriver...
[INFO  - 2013-06-18T00:17:27.627Z] GhostDriver - Main - running on port 4444

然後設定 Codeception 的 tests/acceptance.suite.yml 設定檔, 指定用 Selenium2 module:

  • url (required) – start url for your app
  • browser (required) – browser that would be launched
  • host – Selenium server host (localhost by default)
  • port – Selenium server port (4444 by default)
  • delay – To set delay between actions in milliseconds (1/1000 of second) if they run too fast
  • capabilities – To set Selenium2 desired capabilities. Should be a key-value array.

Laravel 4 – Resources

Coding — Tags: , — Posted by Starck on June 14, 2013

Starter

Package

IDE helper

Use ownCloud to build your own network drive

Log — Tags: , , — Posted by Starck on June 12, 2013


Install linux packages

apt-get update and some libraries:
Ubuntu 13.04:


Download web installer


Server Web-DAV Installation

Open your browser, run the web installer script, ex: http://{domain.name}/setup-owncloud.php

follow the steps in installer, finish it.


Sync-Client Installation

for MacOS:

download

Reference

How to setup owncloud 5 on ubuntu 12.10

mobile01 – OwnCloud, 一套適合自建的網路同步硬碟

Next Page »
(c) 2017 Starck Lin | powered by WordPress