ALOHA~~這裡是灌新電腦後要重設設定就會非常苦惱的布丁。
NetBeans具備了版本控制工具Git的功能，不過預設Git在遞交的時候，它會用你電腦的使用者帳號名稱跟電腦名稱作為作者的資訊。這時候其實我們可以從「Open Global Configuration」來手動設定Git遞交的作者資訊喔。讓我們來看看怎麼操作吧。
(more...)
大家晚安，我是電腦重灌後很多設定一天沒還原到位，就一天覺得渾身不對勁的布丁。今天要跟大家介紹的是NetBeans跟GitHub Issues的整合：GitHub Issues外掛。NetBeans可以透過安裝GitHub Issues外掛，再並加上一些設定，就能讓GitHub Issues問題回報系統整合到NetBeans之中。如果你使用NetBeans做開發、也用GitHub做版本控制的話，非常推薦你試試看這個功能。讓我們來看看怎麽做吧。
(more...) 
大家好，我是下著大雨的悶熱週六躲到實驗室工作的布丁。NetBeans 8.2在檢查HTML格式的時候並沒有支援Vue.js的特殊標籤與屬性，不過還好我們可以手動為NetBeans的專案加入自訂設定，避免NetBeans顯示錯誤訊息。但是NetBeans的自訂標籤似乎不能接受「:」或「@」開頭的縮寫屬性(shorthands)，但「v-on:」或「v-bind:」就可以。使用的時候可能要注意這個差異。
(more...)最近我在xfce桌面環境下安裝NetBeans 8.2，赫然發現到NetBeans操作界面使用的文字預設大小非常地小，難以閱讀。然而操作界面文字的大小設定，似乎並不能在NetBeans裡面調整。稍作研究之後，我發現NetBeans是以Qt框架開發的應用程式，所以可以從Qt設定(qtconfig)來調整它的字體大小。或是在啟動NetBeans時加上「--fontsize 14」(14表示字體大小)，才能讓NetBeans的操作界面用較大的文字來顯示。以下我們就來看看怎麼做吧。
(more...)今天使用NetBeans的時候，發現它內建的SFTP上傳檔案功能失效無法運作了。查了一下StackOverflow上的解答，赫然發現是NetBeans使用的JSch函式庫版本過舊，導致無法正常使用。這篇將說明如何更新NetBeans的JSch函式庫，讓NetBeans的SFTP功能能夠正常運作。
(more...)之前我寫過在NetBeans裡面用HTTP來複製(clone) git保存庫的作法，這篇則是要介紹使用SSH來複製保存庫的另一種作法。雖然SSH連線需要比較多設定，但較適合正式開發時使用。而這次要連接的對象也不是公開的GitHub，而是私人使用的git保存庫GitLab，但介面跟作法都跟GitHub大同小異就是了。
我在之前幾篇文章中都有介紹過git，首先這三篇是使用TortoiseGit作為git工具的入門介紹：
TortoiseGit是很強大的git工具，比NetBeans內建的git還要好用，像是要取代分支(branch)檔案時特別方便：
但是如果要開發的話，還是使用NetBeans這種IDE會比較適合。所以我就寫了以NetBeans使用git的教學：
然而這篇是用HTTP存取git儲存庫，這種作法雖然簡單，但是使用HTTP的缺點是不能上傳大檔案。git使用HTTP傳輸檔案時，http.postBuffer預設值只能夠上傳1MB，而伺服器端通常也不允許過大的檔案，GitHub最多一次上傳100MB，而GitLab使用的Nigix則是預設只能上傳20MB。上傳過大檔案時會發生411錯誤，必須要同時修改git客戶端跟伺服器端的設定才能解決。雖然修改過後可以用TortoiseGit來連線，但在NetBeans上卻仍然不能上傳大檔案。
最後我只好回頭改用SSH的方式連接，一併把SSH連接時使用不同連接埠的方法也找了出來。請照著以下步驟一起來操作吧。
首先必須說明git的客戶端與伺服器端的基本資訊。
我目前使用的是NetBeans 8.0版本。但是Git功能並沒有多大改變，前幾版使用時應該差不多。
我現在大部分以專案進行的開發都是使用NetBeans，不論是寫網頁、JavaScript、PHP、Java都能夠支援。例如最近一篇編譯WISE就是用NetBeans來進行。相對的，我反而比較不推薦使用大學很常教的Eclipse，它在開發網頁應用的支援較差。
如果要架設GitLab的話，有兩種方式可以選擇：
如果不想架設的話，也可以直接使用GitLab的雲端空間：
本篇我採用OpenVZ架設Turnkey Linux GitLab，設定IP為192.168.11.102，SSH連接埠為22，Domain Name為 git2.pudding.dlll.nccu.edu.tw。這些都是區域網路的設定，僅供本篇測試用，其他人是連不到這個網站的喔。
如果要用SSH來連接Git，我們必須要先用SSH金鑰製作工具產生公鑰跟私鑰，然後將公鑰上傳到Git伺服器端(也就是本篇的GitLab)，而Git客戶端(也就是本篇的NetBeans)要存取伺服器端時，則需要搭配私鑰來連接。
我在「GitHub入門 Part.2 工具安裝與環境配置 」這一篇中有介紹如何用PuTTYgen (PuTTY Key Generator)產生公私鑰。
不過這裡我們簡單一點，我隨便產生一個公鑰與私鑰直接給大家下載：
這個公鑰與私鑰僅供測試使用，正式開發環境請不要用它，不然其他人也可以用這個私鑰去連接你的私人git儲存庫喔。
接著登入GitLab，進入帳號中的SSH Keys。一般來說SSH Keys的網址是：
請按下右上角的「Add new」新增公鑰。
新增公鑰並非是上傳檔案，而是要用複製貼上的方式來將公鑰貼到Key的欄位。至於Title欄位可以填寫一個容易記得的名字即可，例如「puli-public-key」。
請用文字編輯器(像是Notepad++)來開啟公鑰檔案，複製裡面全部的內容，貼到網頁中Key的欄位內。
或是複製以下文字框裡面的內容，裡面的文字跟我上面分享的公鑰是一樣的：
完成之後應該會像是這樣子，然後按下「Save」儲存。
新增完成。
讓我們回到要複製的git儲存庫首頁。在這裡可以找到連接git儲存庫的連接網址，以SSH來說，通常會是「git@git2.pudding.dlll.nccu.edu.tw:pudding/test.git」。請記下這個連接網址，下一步設定git客戶端的時候，我們就會用這個網址來連接git儲存庫。
接著我們來設定Git客戶端：NetBeans。開啟NetBeans之後，從Team > Git > Clone… 找到複製的功能。
接下來是很重要的關鍵設定。
首先，Repository URL本來應該設定剛剛看到的連接網址「git@git2.pudding.dlll.nccu.edu.tw:pudding/test.git」，但如果伺服器必須指定SSH連接埠的話，那就要改用不同的形式：
接著Username請務必輸入git，請不要用GitLab的帳號。
然後Pirvate Key File則選擇剛剛產生的SSH私鑰 puli-private-key.ppk。
下面還可以在Clone into: 設定檔案的位置。
設定完成之後就按下「Next >」進入下一步。
這時候應該會跳出一個Warning，要加入GitLab伺服器的連線授權。請按下「Yes」即可。
看到這個畫面表示正常連接，按「Next >」進入下一步。
這樣就完成了，按下「Finish」確定。
複製完成之後，接下來再建立專案，請按下「Create Project」。
後續的步驟就跟「Git合作開發從NetBeans開始！NetBeans複製git專案教學」的「Part 2. 新增NetBeans專案」一樣了，請參考之前的文章繼續操作吧。
只要第一次設定後，Git連接方式就會保存在NetBeans裡面，以後每次存取Git儲存庫就不用重複輸入帳號密碼了。
最近實驗室又加入了新進成員，而許多人也需要開發系統作為畢業論文。由於我們系所並不是強調軟體工程的科系，所以進來的學弟妹雖然能夠看得懂程式碼，但是在開發上仍顯得生澀。
選擇好用的IDE與版本控制工具能夠降低開發過程中繁雜的操作，程式設計師主要是在邏輯思維上下工夫，而不是像打字員一樣複製大量的程式碼，還難以維護。而IDE與版本控制也是未來踏入業界開發團隊中，與他人合作開發系統時必須要具備的技能。作為未來進入職場的投資，請務必多多熟悉IDE與版本控制的操作吧。
(more...)為了閱讀被壓縮(minify)的JavaScript與CSS程式碼，我們可以使用線上工具Code Formatter或是NetBeans的format指令來為程式碼進行排版。
You can use some tools to maxify/parse/format the minified JavaScript or CSS codes, for example, Online Code Formatter or NetBeans.
JavaScript與CSS程式碼的特性在於必須下載到使用者客戶端才能執行，因此降低程式碼的大小是很常見的方式。JavaScript跟CSS通常是以壓縮(minify)的形態發佈給大家使用。被壓縮的程式碼檔案名稱通常會加上「.min」，而原始碼通常會加上「.src」，舉例來說：
這是jQuery 1.11.1原始碼的樣子。檔案大小是276KB。
這是jQuery 1.11.1壓縮程式碼的樣子。檔案大小是93.5KB，幾乎是原始碼的1/3大小。
壓縮程式碼中會移除註解、刪除空白與換行、縮短變數名稱（例如變數用了var book，會縮短成var a）。我之前也介紹過使用YUI Compressor與Minify壓縮程式碼的方法。而現在壓縮JavaScript跟CSS已經是主流用法，像是Fat-Free Framework中也直接內建了壓縮工具，非常方便。
雖然像是jQuery這種知名的函式庫會提供非壓縮的原始碼供大家閱讀研究，但是還是很多專案並沒有提供解壓縮的原始碼，而只有被壓縮的程式碼可以看。
我最近在研究如何撰寫CKeditor的plugin，可惜他的教學跟文件寫的並不是很好。後來我覺得比起研究文件，不如直接修改程式碼，說不定還比較快。
可惜的是，大部分CKeditor中plugin的程式碼都是壓縮後的結果，閱讀起來不太容易，我們需要一些解壓縮(maxify)工具來輔助我們閱讀這些程式碼。
在此介紹兩種格式化被壓縮程式碼的方便工具：NetBeans的format指令跟線上工具。
我使用的是NetBeansIDE 8.0。要格式化被壓縮的JavaScript程式碼的做法如下：
不過你可以注意到下面還是有一團程式碼沒有解壓縮到，這似乎是NetBeans的限制。此外，NetBeans也不能解壓縮CSS程式碼，使用範圍有限。
這個工具名稱叫做「Format, Beautify, Maxify, Unpack or Deobfuscate JavaScript/jQuery/HTML/JSON/CSS Codes」，有點長，還是用網址上的Code Formatter來稱呼好了。
這工具用法很簡單。首先先把壓縮的程式碼貼在框框中，然後按下下面的按鈕「Click here to Format/Beautify/Maxify Your JavaScript/jQuery/JSON//HTML Codes」。
程式碼就以漂亮的版面排版好了，而且NetBeans沒解開的後面部分也排版的漂漂亮亮，這樣就能夠更輕易地閱讀程式碼了，真是令人開心呢。
希望這些工具能夠幫助程式開發者更容易閱讀程式碼。學程式的第一步就是模仿別人怎麼寫，加油！
(more...)本文介紹如何在NetBeans中複製Git專案到本機端，然後建立NetBeans專案，以便開始進行程式的開發。
This article describes how to clone Git project and then create a NetBeans project in NetBeans.
本文以我最近要開始的新專案「PHP File Host」為例子來做示範。這是一個存放在GitHub的開放原始碼專案，大家可以任意複製(Clone)裡面的程式碼到本機端來修改。要複製Git專案的方法很多，有HTTPS、SSH與Subversion等通訊協定。在NetBeans裡面，我們可以用HTTPS通訊協定來進行複製，連線方式在GitHub專案網頁的右方下面「HTTPS clone URL」。
總結上述，以下是Git專案的資訊：
NetBeans是我現在主要的IDE開發環境，他也是一個開放原始碼的自由軟體。NetBeans不僅支援語法標亮、自動完成(auto-completion)，從7.4版之後也開始支援Git。以往我使用TotoiseGIT來管理GIT的工作，現在逐漸都改以NetBeans來進行操作。
為了讓大家能夠更輕易以NetBeans來開始使用Git專案，本文將介紹如何複製Git專案到NetBeans中，並直接建立一個NetBeans專案來使用。
以下介紹如何在NetBeans中複製Git專案。大致上操作步驟分成兩個部分：從Git複製專案檔案、以及在NetBeans中建立NetBeans專案。
Git專案主要負責程式碼的版本控制，NetBeans專案通常還包括一些專案程式碼指定編碼、伺服器上傳連線等資訊，而這些資訊並不建議放到Git專案中公開，兩者要分開處理。
在NetBeans中，請進入Team > Git > Clone…
接著會開啟Clone Repository對話視窗。在這裡我們先進行Remote Repository設定。要輸入的欄位包括：
接下來選擇要複製的Remote Branches。一般是選擇該專案的代表master分支即可。直接按「Next >」按鈕吧。
然後最後是確定目標資料夾 Destination Directory。這邊會帶入剛剛的設定，只要按「Finish」按鈕完成即可。
複製完成之後，NetBeans會問你是否要建立NetBeans專案。打勾「Open Sources in Favorites」，然後按下「Create Project…」，接下來就進入新增專案的步驟。
NetBeans會顯示「Net Project」對話視窗。在這邊我們要選擇與該專案相對應的程式語言類型。PHP File Host是一個PHP程式語言的專案，而且已經有Git專案過來的檔案，因此我在PHP目錄底下選擇專案類型「PHP Application with Existing Sources」。
然後按下「Next >」按鈕進入下一步。
在Name and Location這邊要設定的東西蠻多的。
首先我們要指定Sources Folder，請設定剛剛跟Git專案複製的目標資料夾路徑「D:\xampp\htdocs\php-file-host」。接著NetBeans會自動帶入下面的資訊。
接著我們要確認Default Encoding為UTF-8。如果沒有設定NetBeans專案的話，NetBeans會用非UTF-8的編碼來開啟檔案，造成檔案看起來會是亂碼。
然後請打勾「Put NetBeans metadata into a separate directory」，然後指定另一個地方存放NetBeans專案的資訊，不要跟Git專案擺在同一個地方。這是為了避免NetBeans專案資訊被納入Git版本控制之中，這個動作很重要。
最後就是運作環境設定 Run Configuration。由於我的專案會先在本機端的XAMPP底下運作測試，所以設定Run As: Local Web Site即可。如果你實際運作的伺服器在遠端，那也可以在此步驟設定遠端伺服器的連線方式。不過遠端伺服器設定比較複雜，在此就先不說明。
其他沒有特別要設定的地方，按下「Finish」完成。
NetBeans會顯示剛剛設定的php-file-host專案，複製Git專案的工作就大功告成囉。
當然，除了clone (複製)之外，NetBeans也支援很多Git的操作動作。以下舉例來說常用的指令與其位置：
Git詳細的說明請參考「Using Git Support in NetBeans IDE」一文。我也還在持續摸索中，有任何心得歡迎在下面討論喔。
以前常常會聽到有人會以「只要筆記本(notepad)就可以寫網頁」來當作自豪的特技，我覺得這只能說是程式設計師的基本，只能拿來跟外行人炫耀。但是如果要往更進階前進，你就必須學習使用IDE。
就目前為止，我主要使用的IDE有Aptana Studio 2 (第三版是是完全不同的東西)跟NetBeans，在我工作中，這些IDE有幾個我非常仰賴的重要工具：
因此我會建議每一位致力於寫程式的朋友，請務必要熟悉一些好用的IDE。如果你跟我一樣是寫PHP與JavaScript，那我建議你就從NetBeans開始吧。
(more...)在NetBeans上用滑鼠中鍵滾動捲軸時，往往會不小心因為按著中鍵滾動而導致觸發了文字縮放功能。本文章參考stackoverflow中fivedigit的解答，以圖文說明如何關閉這個功能。
To prevent from triggering off zooming text function in NetBean, this article aims to disable this function by modifying keymap configuration.
此處動作比較複雜。進入Keymap分頁之後，你會發現有很多快捷鍵的設定。請先在Search輸入「Zoom」，以找到我們要修改的Zoom Text In與Zoom Text Out。然後按下右邊的「…」按鈕，選擇「Clear」。兩個功能都要做「Clear」喔。
這樣就完成囉。
請使用NetBeans的人先把這個功能關掉吧，不然每次滾動捲軸時真的是常常誤觸呢！
(more...)我編輯PHP專案的時候主要使用NetBeans.org這個IDE，之前不僅發現他內建了Git，也可以用SFTP上傳修改後的檔案，不需要另外在開TortoiseGit或是FileZilla，非常方便。
只是在SFTP上傳的時候每次都要對照RSA key fingerprint，它不會儲存在電腦中，每次都會跳出來詢問我是否要確定，這讓我有點困擾。後來找到NetBeans論壇上stephanmitchev的教學，終於成功設定，讓NetBeans儲存RSA key fingerprint。
以下用圖文來介紹作法。
首先我先在NetBeans的專案目錄底下新建一個空白檔案，叫做rsa.key。我用「新增 –> 文字文件」的功能來新增，檔名任意即可，檔案內容不需要填寫。
NetBeans專案目錄通常是在你程式碼目錄底下的「nbproject」目錄。
開啟「File」 > 「Project Properties (專案名稱)」
在Categories中進入「Run Configuration」，然後在Remote Connection右邊找到「Manage…」進入。
在Known Hosts File那一欄位後面的Browse選擇剛剛新增的rsa.key。
按下下面的「Test Connection」，NetBeans會跳出Warning視窗，要你確認RSA key fingerprint。按下「Yes」，RSA key fingerprint就會儲存在rsa.key檔案中。
第二次再按下「Test Connection」時已經不會跳出詢問視窗，這就是RSA key fingerprint已經儲存了。
這樣每次上傳就不會再詢問你囉。
(more...)
Comments