簡易的git操作使用

git功能相當多,這裡只列出最基礎使用部份
一.環境安裝

1. window
   到以下網址下載安裝
   http://code.google.com/p/msysgit/downloads/list?q=net+installer
   http://git-scm.com/downloads
2. ubuntu
   

   sudo apt-get install git
   

二.名詞說明

1. repostory
   有版本控制功能的目錄
2. local remote
   local是自己的repos,主軸為master,若有分支,就會有相關branch名稱
   remote是遠端的repos,通常在多人同時維護一份程式碼的狀況
   每個人都會有一個local的repos,大家都會對應到同一個remote做
   大家的版本共同管理,預設的remote名稱是origin
3. stage ,unstage
   把檔案加入到stage,就是讓這些檔案會在版本控制的範圍內
4. push,pull
   pull是由remote將檔案拉下來到local上
   push是將local檔案放到remote上
5. commit,checkout
   做commit的動作就是產生一個新的檔案版本
   checkout就是切換到指定的版本或是分支

三.本機檔案版本控制

1. 目錄初始化
   會產生一個.git目錄，讓該目錄成為一個repostory
   在目錄下執行
   

   git init
   

2. 查看目前repostory的狀態
   檔案是否有更動，是否有檔案被加到stage,是否尚未commit
   等相關狀態都可以使用這指令看到
   

   git status
   

3. 查看已儲存的版本(comit)清單
   

   git log
   

4. 加檔案到stage
   加入指定檔案
   

   git add filename
   

   全部有異動的都加入
   

   git add .
   

5. 刪除檔案
   

   git rm filename
   

   刪除目錄
   

   git rm -rf dirname
   

6. 將已經加入stage的檔案移到unstage
   

   git reset HEAD filename
   

7. 產生版本
   

   git commit -m "xxx"
   

8. 回復到指定版本
   

   git reset -hard HEAD~1
   

   數字代表回復到前幾個版本

四.與遠端Remote做版本控制

1. 將遠端的repos複製到local
   執行指令後,會將remote的目錄,複製到目前這個目錄下
   

   git clone 遠端目錄
   

2. 設定要同步的遠端remote
   local respos 加入remote後,就可以把資料放到remote上,
   或是由remote 下載回來
   

   git remote add  aliasName remote路徑
   

3. 查看目前所有的remote
   local respo上可以同時設定多個remote
   

   git remote -v 

4. 由remote上取回最新檔案
   

   git pull origin master
   

5. 將local檔案上傳到remote
   

   git push origin maste
   

五.修改檔案後更新流程
當你已經修改了檔案要放到remote上，也許remote上的檔案，在這過程中已經被別人更新做
以下流程處理

1. 先把自己的修改內容放到暫存區
   

   git stash
   

2. 由remote取回最新檔案
   

   git pull origin master
   

3. 合併
   

   git stash apply
   

   把自己放在暫存區已改過的檔案與最新拉回來的檔案merge在一起,
   若有衝突的地方，系統會自動在差異處加入註解,
   修改好再儲存
4. 重新把檔案加入到stage
   

   git add .
   

5. 產生版本
   

   git commit -m xxxx
   

6. 傳回remote上
   

   git push origin master

六.使用Github當作remote

1. 選擇連線方式
   在你要clone的repos上可以看到有提供ssh或是http連線方式
   提供不同的連結網址,使用http連線,每次會要求輸入連線帳號密碼
   (就是github帳號密碼)
   若使用ssh則可直接連線,但須先設定ssh key
2. 設定ssh key
   參考https://help.github.com/articles/generating-ssh-keys
   產生ssh key並貼到github個人資料頁內,即可使用ssh直接連線

七.使用Dropbox當remote
在指定的dropbox目錄上執行

git init --bare

該目錄即可成為一個git remote

使用CoffeeScript 建立nodeJS Class與使用

一.單一檔案單個Class
1.定義class檔案
寫好class檔案,以module.exports輸出

file:myclass.coffee
class MyClass
    constructor:(@name)->
module.exports=MyClass

2.使用
require參數是實體檔案的名稱,同目錄下用./來設定路徑
可以用不同的名稱來接收require的回傳值(Class)

Rocker=require('./myclass')
rocker=new Rocker()

二.單一檔案多個Class
1.定義class檔案
好class檔案,以module.exports輸出

file:myclass.coffee
class MyClass
    constructor:(@name)->
class MyClass2
exports.Rocker=MyClass
exports.Tester=MyClass2

2.使用

MyRocker= require('./myclass').Rocker
MyTester= require('./myclass').Tester
rocker=new MyRocker('oz')

Backbone.js and RequireJS Slide

Backbone js and requirejs from Chi-wen Sun

HTML5 Application Cache

一.說明
HTML5提供了Application Cache機制，可以讓靜態檔案Cache在Client端
減少對Server的Request,加速頁面載入，當網站上資料有異動，需要客戶端
更新Cache資料，也可以很簡易的做到，進一步還可以達到離線閱讀的目的

二.原理
要使用了Application Cache，必須在網站上加上一個manifest檔案
manifest檔案內設定了要cache的檔案清單,當Client連線後會儲存保留
menifest檔案在Client端，每次連線一定會去比對Client端的manifest檔案與
Server端上的manifest檔案是否有異，若有異動，則會重新由Server讀取檔案儲存到Client的Cache，否則就會去直接讀取Client端的Cache顯示頁面資料

三.Web Server上需要的設定
在Web Server上需要對manifest的檔案類型做MIME Type設定
副檔名可以自訂
通常會是用.manifest 或 .appcache
例 在Apache Web Server設定加上

AddType text/cache-manifest .manifest

四.網頁上使用

 <html manifest='cache.manifest'>  

在所有會成為進入點的網頁，都需要加入設定指向manifest檔案

五.manifest檔案設定內容

CACHE MANIFEST 必要的第一行
CACHE:
區塊設定要cache的檔案清單  
NETWORK:
區塊設定一定要由網路讀取的清單  
FALLBACK:
區塊設定當讀取失敗，要轉向使用哪個替代內容顯示

例

CACHE MANIFEST
#ver 0.0.1
CACHE:
index.htm
/js/main.min.js
/css/app.css
/img/btn_img.png
NETWORK:
*
FALLBACK:

六.注意事項

1. 更新
   要做任何檔案異動，除了檔案本身更動外，一定要讓manifest有所變化，否則系統只會一直讀取到Cache的資料，通常可以在manifest內加入一個版號宣告，只要有更動，客戶端即會自動更新Cache
2. 不使用cache
   Application Cache與Browser一般的Cache暫存並不相同，並無法透過Browse的F5來清除， 要讓網頁不使用cache，必須透過刪除manifest內CACHE清單來達到
3. 刪除manifest檔案
   直接刪除Server上的manifest檔案，也會讓Client不使用Cache
4. 不要使用舊有的防檔案cache機制
   通常會在讀取如js檔案會加上一個版號來控制檔案cache
   例

    <script scr="xx.js?ver=1.0"></script>  
   

   使用Application Cache請不要再使用這樣的手法，把Cache的管理都交給manifest處理即可

Sencha Touch 2 : 在View內使用html,tpl與itemTpl

在View裡除了使用內建的Compontent外，若需要產生html來當作View的內容
可能會在View的Config內用到以下幾個3種Tag
一.html
直接將html內容放到view內，若有需要被操作的物件是以html產生，建議以此方式放入可使用
1.String
例 字串array會自動使用join串接

html:[            
    "this html block..........",
    "kkman"
].join('')         

2.HTMLElement
例 array需以join('')串接,否則會被當成整個字串顯示

html:[
    "<div>this html block..........</div>",
    "<hr/>",
    "<div>hello</div>"
].join('')

3.Ext.Element ？？

二.tpl
當為動態資料產生的內容，利用setData傳入資料與tpl產生view的html內容,通常會在一般的view內使用
一定要有執行setData(),tpl才會被render產生html
1.String

tpl:"<div><div>Hello me</div><div>{name}</div><div>{rock}</div></div>"

tpl:[
    "<div>",
    "<div>Hello me</div>",
    "<div>{name}</div>",
    "<div>{rock}</div>",
    "</div>"
].join('')

3.Ext.Template[]
設定tpl的動作一定要在執行setData前完成，也就是說可以設定在config的tpl
或是在initial程序內執行設定(在setData前設定好)
例 在config內設定

tpl:new Ext.Template("<div>Hello {name}.</div>")

例 在initial程序中使用

this.setTpl(new Ext.Template("<div>Hello me {name}.</div>"))

4.Ext.XTemplate[]
例
在initial內執行

this.setData([
    {
        name:'ozzy',
        type:'metal'
    },
    {
        name:'linda',
        type:'Rock'
    }
]);

在config內設定

tpl:new Ext.XTemplate(
   '<tpl for=".">',
        '<p>{name}</p>',
        '<p>{type}</p>',
        '<hr>',
    '</tpl>'
)

三.itemTpl
只有在List View可以使用，會將List View所關聯的store或以setData設定array data
每筆資料套用到itemTpl上,注意這裡接受的是XTemplate
1.String
例

itemTpl:'<p> {name}</p><p> {type}</p>'

2.String[]
例

itemTpl:[          
    '<p>{name}</p>',
    '<p>{type}</p>',
    '<hr>'            
].join('')

3.Ext.XTemplate
例

itemTpl:new Ext.XTemplate(          
    '<p>{name}</p>',
    '<p>{type}</p>',
    '<hr>'            
)

4.使用setData
例

var list={
    xtype:'list',
    itemId:'mylist',            
    itemTpl:new Ext.XTemplate(          
        '<p>{name}</p>',
        '<p>{type}</p>',
        '<hr>'            
    )
}
this.getComponent('mylist').setData([
    {
        name:'ozzy',
        type:'metal'
    },
    {
        name:'linda',
        type:'Rock'
    }
]);

四.使用注意事項

1. 不要同時將html與tpl並用，否則html部份資料不會顯示
2. 使用html,內容會被包覆在多層次的innerHtml class node內使用tpl則是將內容直接append進去不做任何節點包裝
3. 若設定的資料為array資料，在tpl內使用for來處理迴圈，list一定要用itemTpl不可使用tpl