熱血漢誌 - 技術新鮮人到技術經理人，必懂的事

coffeeScript comment style CoffeeScript 有幾種不同的註解寫法，以下作為介紹讓大家知道一下 know comment in Coffeescript 一行註解，在經過轉譯之後是不會留下任何記錄 #bala bala bala 轉 js 檔案之後 none 多行註解方式， ### bala bala bala ### 轉成 js /* bala bala bala */ 而實際上很多 documentation generater 都會有一個共同的開始，就是註解開頭必須要使用 /** 這樣的符號，因此如果透過 coffee 多行註解的方式轉譯還是會出現問題。這邊可以提供其中一種解決方式。 ###* * bala * bala ### 轉成 js 檔案， /** * bala * bala */ 看起來的確就像是我們要的方式，雖然有點蠢，不過也算是一個完整的開始，至少就讓我們先開始動工吧！ api 文件產生器 http://jashkenas.github.io/docco/ http://apidocjs.com/ http://yui.github.io/yuidoc/

上次有提到在 Mac 裡面如何 安裝 Apache 以及其他相關 Web 服務 ，當然 Xampp 已經有提供這樣的完整的服務，可以讓開發者快速的建立 AMP 的環境。 本篇將介紹如何使用 homebrew 安裝 Nginx, PHP, MySQL. prepare installed homebrew install script 這邊使用的是從 github 上面找來的安裝腳本，如果有興趣知道裡面到底寫什麼的朋友，就麻煩自己下去 Google. 但是在執行 homebrew 之前，建議還是先 update 一下. sudo brew update https://gist.github.com/mystix/3041577 Setting 重新設定 MySQL root 密碼 /usr/local/opt/mysql/bin/mysqladmin -u root password 'new-password' mysql -u root -p 設定 nginx，目前預設都是 8080, 可以透過修改 nginx.conf 修改 port /usr/local/etc/nginx/nginx.conf 同時在 nginx.conf 裡面的設定解除註解，fastcgi_param 後面的數值也稍微修改一下， location ~ \.php$ { root html; fastcgi_pass 127.0.0.1:9000; fastcgi_index index.php; include fastcgi_params; fastcgi_param SCRIPT_FILENAME /usr/local/var/www/$fastcgi_script_name; } 重新啟動 nginx, sudo nginx -s reload 或者關掉重新啟動 sudo nginx -s stop sudo nginx 以上步驟安裝完成，恭喜各位，接下來可以進入測試階段 try 到 html ...

https://github.com/victorporof/Sublime-HTMLPrettify 介紹 sublime html Prettify 工具，藉由鐵神看到的分享，這邊說明一下如何設定，讓自己之後可以快速回顧，知道使用的方法。 Prepare sublime text 2 / 3 sublime package installer node.js install 打開 Sublime text 2 / 3

iis node - build node.js runner on windows 很久之前就聽說過 node.js 可以執行 在 iis 裡面，可惜一直都沒有太多緣份執行 windows 環境，這幾天剛好把 windows 環境建置完成之後，第一個想法就是安裝看看 node.js 在 windows 環境裡面。 本篇文章將會帶領大家一步一步完成 iisnode 的建立。 基礎環境 windows .net framework Node.js installed 開始安裝 在開始之前還是要貼心提醒一下各位，記得安裝好 node.js ，在 windows 環境裡面已經具備有 node.js 的執行檔案，下載好 msi 安裝包之後，直接陸續下一步就可以完成了 現在微軟已經很方變得提供 WebMartix 這個平台給予輕量級開發者，到 WebMartix 的環境中，進行安裝檔案的下載包含 express 7.x, iisnode…相關套件。 WebMartix 下載頁面 開始安裝 WebMartix， 選項都 使用預設 即可，接下來會從所有詳細的安裝資料會陸續從網路下載下來，進行安裝。 接著最後會看到完成步驟，就表示 WebMartix 安裝完成。 使用 WebMartix 開始使用 WebMartix ，正常安裝完成後，開啟會看到如下的畫面 在這邊我們選擇新增一個專案，從範本庫裡面 接著選擇 node.js 專案，這邊我選擇 express 的專案 ， 輸入專案名稱之後，按下完成，畫面就會開始新增一個專案同時，會從網路上下載 express web 範本，複製到本地端。 以上步驟有正確完成，就會跳到專案畫面，有點類似程式編輯器的軟體，畫面如下， 接著按下左上角的 '執行' ，再選擇瀏覽器就可以看到開啟一個新的連結，也是大家最常看到的畫面。 WebMartix 我們就談到這邊，基本的環境就如此簡單可以架構起來。 後記 從 WebMartix 這個專案可以看到微軟對於 open source 開始有了許多不同方向的支援，讓開發者更為簡單的開發，同時讓初學者可以很快的加入他們的環境中。 當然 WebMartix 除了上述好上手的東西之外，其實還...

使用 Grunt 快速建構專案， grunt 裡面有許多詳細的作法，這邊主要介紹 scaffolding 的使用方式。 Basic node.js git Install 安裝基本 grunt cli 基礎環境指令 npm install -g grunt-cli Project-scaffolding 另外在 0.4 之後的版本 grunt-init 已經與核心拆開，因此這邊要另外安裝。 npm install -g grunt-init 將 initial template project 使用 git 複製到 ~/.grunt-init/ 這邊以 jquery 為例子，使用 git 複製到 ~/.grunt-init/ 資料夾底下，命名為 jQuery 樣板資料夾 git clone git@github.com:gruntjs/grunt-init-jquery.git ~/.grunt-init/jquery Initial your project 環境準備好之後，我們就可以開始進行專案的建立，首先建立一個資料夾，之後再進行專案樣板套用 mkdir project cd project grunt-init jquery 之後會開始詢問你此專案的名稱以及設定等，資料將會設定到 packge.json 裡面。 後記 透過這樣的方式，以後可以透過自己建立好的基礎環境，如果要重新啟動不同專案的時候，就可以快速開發，不需要自己寫重複的架構以及重複的資料。 相信大家對於 grunt 的強大開始有感覺，歡迎大家一起來討論 grunt & node.js 開發。 相關連結 http://gruntjs.com/project-scaffolding http://book.nodejs.tw/

angular 關於官方教學自己做的一個簡短筆記，在官方基本教學流程中，已經給予大家大致的輪廓，到底 angular 怎麼去執行程式流程，進行 html render 以及如何將 html 變成 object，甚至到後面的 route, HttpRequest 取得資料方式 以下把 angular 官方網站提供的基本教學，做一個大致流程導覽，給自己一個簡單的紀錄。 angular 基本教學 http://docs.angularjs.org/tutorial step-0 這邊進行 angular 第一次接觸，教導如何 install angualr 以及，angular html template 如何進行運作。 Nothing here {{'yet' + '!'}} 網址 http://docs.angularjs.org/tutorial/step_00 ng-repeat step-2 加入 ng-model 了解， angular model 模型，如何使用 ng-model 與 html 進行互動 added app/js/controller.js <pre> function PhoneListCtrl($scope) { $scope.phones = [ {"name": "Nexus S", "snippet": "Fast just got faster with Nexus S."}, {"name": "Motorola XOOM™ with Wi-Fi", "snippet": "The Next, Next Generation tablet."}, {"name": "MOTOROLA XOOM™", "snippet": "The Next, Next Generation tablet."} ]; } </pre> 網址 http...

Github ribbons Github 專案緞帶 現在身為一個 developer 好像沒有 github 就缺少了什麼，熱血的你今天有沒有申請 github ，快點來加入吧！ 每次在加入左上（右上）的 github project 都要花些時間，整理一下有哪些資源可以使用 一般 github ribbon github 官方介紹 ribbon 使用方式 github ribbon for retina retina 專用 github ribbon github ribbon 產生器 github ribbon 產生器 你今天 github 了嘛？