2014-02-10發表2023-12-05更新Program6 分鐘讀完 (大約886個字)

JSX 常見的陷阱

JSX 看起來像 HTML 但有一些您應該知道關鍵性的差異。
注意：對於和 DOM 之間的差異，例如行內式屬性設定(inline style)，請查閱這裡。

2014-02-09發表2023-12-05更新Tools5 分鐘讀完 (大約754個字)

Gulp 初體驗

從轉用 Grunt 以來其實我沒有遇到太多問題，加上大部份的 Framework 都把 Task 寫得好好的，對我來說用就好了。特別要客製的地方大概也都是小改一下別人的 Gruntfile 。
這篇記錄沒有要特別去分析 Gulp 。介紹在這篇The streaming build system Gulp就解釋得蠻清楚的了。
只不過在這不想外出的下雨天稍微用看看 Gulp。以下記錄非常單純，只是透過 Gulp 來編譯 Coffee, Jade，使用一下 watch 功能體驗一下。

繼續閱讀

2014-02-08發表2023-12-05更新Program3 分鐘讀完 (大約501個字)

為什麼使用 React ?

原文

為什麼使用 React ？

React 是 Facebook 和 Instagram 用來建置使用者介面的函式庫。近來有許多人考慮使用 React 來處理 MVC 中的 V 的部分。
Facebook 創造了 React 是為了解決構建一個大型且資料不斷變動的應用程式時遇到的問題。
為了達到這個需求，React 採用了兩個主要的核心概念。

繼續閱讀

2014-02-07發表2023-12-05更新Program37 分鐘讀完 (大約5623個字)

React 第一個實戰範例

學習手冊

本篇教學會協助你建立一個簡單，但是實用的留言框功能，你可以放置到你的 blog 中。類似于Disqus，LiveFyre，或者 Facebook comments。
留言框提供下列功能：

留言框的界面(view)。
一個表單(form)可以送出留言。
為你的後端程式提供一個 Hooks ，

繼續閱讀

2014-02-05發表2023-12-05更新Program5 分鐘讀完 (大約784個字)

React 快速概覽

入門

開始學習了解 React 的方式就是使用 JSFiddle 來觀察實作的範例： Hello Worlds。

繼續閱讀

2014-02-04發表2023-12-05更新Database3 分鐘讀完 (大約504個字)

MongoDB Quick Notes

Mac

$ brew update # 更新 brew
$ brew install mongodb # 安裝 MongoDB
$ brew upgrade mongodb # 更新 MongoDB
$ mongod # 啟動 MongoDB Server
$ mongo  # 連線到 localhost:27017/test ，不需帳密。
* 27017 預設 port
* 28017 Web 界面 MongoDB Server 資訊類似 PHP Admin 。

<!--more-->

$ mkdir -p /data/db # 建立資料庫儲存的目錄。
$ chown `id -u` /data/db # 授權當前使用者目錄權限。
$ id -u # 列出當前使用者 uid
$ sudo plutil -p /var/db/dslocal/nodes/Default/users/[YourAccount].plist # OSX 底下的 /etc/shadow 。
$ mongod --dbpath /data/db # 設定資料庫資料目錄。

基本對照

SQL	MongoDB
database	database
table	collection
row(record)	documents
column	field(key)
value	value

Mongo shell

db 當前使用的資料庫。
show dbs 資料庫列表。
show collections 資料表清單。
use [dbname] 切換使用目標資料庫。
db.getSlibingDB('dbname') 取得資料庫參考物件。
db.dropDatabase() # 移除資料庫。
db.addUser( { user: "<user>", pwd: "<password>", roles: [<roles>] } ) # 加入使用者
db.auth('id', 'pwd') # 登入認證身份。
printjson(obj) 將物件以 JSON 格式輸出。
db.createCollection(name, {capped: <Boolean>, autoIndexId: <Boolean>, size: <number>, max <number>} ) # 建立集合，主要的功能是用來開固定式集合，固定式集合不能刪除 Row，但可以移除整個資料表，一旦 capped 設為 true 就要指定 size，但如果要限制則必須在指定 max 。一旦超出 max 舊的資料就會被覆寫。
db.collection.drop() # 移除資料表。
db.collection.ensureIndex({name: [1|-1]}) # 建立索引
db.collection.getIndexes() # 取得索引
db.collection.dropIndex({name: 1}) # 移除索引