在GitHub Actions的工作流加入時間變數 / Formatted Time Variables in the Workflow of GitHub Actions
布丁布丁吃布丁
在GitHub Actions的工作流加入時間變數 / Formatted Time Variables in the Workflow of GitHub Actions
如果要讓工作流產生的檔案(artifact)用時間命名的話，要怎麼做呢？
(more...)
:::
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
![]()
顯示具有 GitHub 標籤的文章。 顯示所有文章
使用GitHub做定期爬蟲、保存與提供資料 / Building a Scheduled Crawler and Storing as Accessible Data by GitHub Action and Pages
布丁布丁吃布丁
使用GitHub做定期爬蟲、保存與提供資料 / Building a Scheduled Crawler and Storing as Accessible Data by GitHub Action and Pages
網路爬蟲的教學很多，但要怎麼定期執行爬蟲、又要把爬完的資料保存後供人取用，則是一個大問題。
(more...)GitHub改用Personal Access Token登入 / Using GitHub with Personal Access Token Instead of Password
布丁布丁吃布丁
GitHub改用Personal Access Token登入 / Using GitHub with Personal Access Token Instead of Password
開始要用GitHub Workflow的時候，我才捨棄帳號與密碼的登入，認命改用GitHub的Personal Access Token。
(more...)如何在NetBeans中設定Git的遞交者？ / How to change author of Git commits in NetBeans
布丁布丁吃布丁
如何在NetBeans中設定Git的遞交者？ / How to change author of Git commits in NetBeans
ALOHA~~這裡是灌新電腦後要重設設定就會非常苦惱的布丁。
NetBeans具備了版本控制工具Git的功能，不過預設Git在遞交的時候，它會用你電腦的使用者帳號名稱跟電腦名稱作為作者的資訊。這時候其實我們可以從「Open Global Configuration」來手動設定Git遞交的作者資訊喔。讓我們來看看怎麼操作吧。
(more...)改善別人做好的輪子！從原始套件建立自己的NPM私領域套件 / How to create a NPM Scoped Package from an Original Pacakge?
布丁布丁吃布丁
改善別人做好的輪子！從原始套件建立自己的NPM私領域套件 / How to create a NPM Scoped Package from an Original Pacakge?
在Node.js上開發專案的好處就是可以透過npm找到大量好用的套件。但有時候，你可能會發現某些套件的內容不合你的需求，或是程式運作上有錯誤。也許你可以到問題討論版(issues)提出修改請求、苦苦等待作者的回應，不過其實你也可以在授權條款允許的情況下，自行取得別人的程式碼，並以私領域套件(scoped pacakge)的形式發佈到npm註冊處。來看看這要怎麼做吧。
(more...)GitHub來信警告：您的相依套件有安全性漏洞 / Alert from GitHub: One of your dependencies may have a security vulnerability
布丁布丁吃布丁
GitHub來信警告：您的相依套件有安全性漏洞 / Alert from GitHub: One of your dependencies may have a security vulnerability
之前收到GitHub的警告來信，是說我的儲存庫中使用的相依套件「event-stream > 3.3.4」有安全性漏洞。如果不處理這個問題，GitHub的警告訊息會一直出現在儲存庫的上方。解決問題的方法也不難，就是修改相依套件的版本設定，避開有問題的版本即可。
(more...)HTML編輯器自己做！布丁版TinyMCE編緝器 / An Online HTML Editor: Customized TinyMCE Editor
布丁布丁吃布丁
HTML編輯器自己做！布丁版TinyMCE編緝器 / An Online HTML Editor: Customized TinyMCE Editor
說到編輯HTML的編輯器，你會想到那個工具呢？純寫程式碼用的Sublime Text、Notepad++？給不會程式碼用的Word轉存HTML格式？混合編輯的Dreamweaver？真要我說的話，目前我看過最好、最乾淨、各種編輯器之間轉換最漂亮的編輯器，就是TinyMCE。
TinyMCE一般只是作為網站裡面將<textarea>轉變為所見即得編輯器的小工具，能像是編輯Word一樣地編輯HTML網頁，最後產生的HTML程式碼又乾淨又漂亮。我因為太常使用TinyMCE來編輯HTML網頁程式碼，特別是表格的編輯，所以乾脆索性把TinyMCE做成獨立的布丁版TinyMCE編輯器，讓人需要的時候就直接打開網頁、使用TinyMCE編輯網頁吧。
- 布丁版TinyMCE編輯器：https://pulipulichen.github.io/TinyMCE-Online-Editor/
行動應用程式「政大借書籃」介紹 / Introduce “NCCU Book Cart”
如何從GitHub下載檔案？ / How to Download Files in GitHub?
布丁布丁吃布丁
如何從GitHub下載檔案？ / How to Download Files in GitHub?
秉持著開放原始碼的精神，我現在也將很多專案跟文件放在GitHub上供人下載、取用。懂版本控制工具git的人可以用clone來抓取資料，不過其他人也可以直接用網頁上的功能來抓取GitHub上的檔案喔。這篇會介紹的是兩種方法來下載GitHub中的檔案。一個是完整下載各個儲存庫 (repository) ，另一種則是下載個別檔案。
(more...)NetBeans用SSH複製git儲存庫：以GitLab為例 / Clone git Repository via SSH in NetBeans: a GitLab Example
布丁布丁吃布丁
NetBeans用SSH複製git儲存庫：以GitLab為例 / Clone git Repository via SSH in NetBeans: a GitLab Example
之前我寫過在NetBeans裡面用HTTP來複製(clone) git保存庫的作法，這篇則是要介紹使用SSH來複製保存庫的另一種作法。雖然SSH連線需要比較多設定，但較適合正式開發時使用。而這次要連接的對象也不是公開的GitHub，而是私人使用的git保存庫GitLab，但介面跟作法都跟GitHub大同小異就是了。
關於Git的基本知識 / About Git technology
我在之前幾篇文章中都有介紹過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連接時使用不同連接埠的方法也找了出來。請照著以下步驟一起來操作吧。
環境說明 / Environment
首先必須說明git的客戶端與伺服器端的基本資訊。
Git客戶端：NetBeans / Git client: NetBeans
- NetBeans 網站
- NetBeans下載：建議下載All版本，可以同時支援JavaScript與PHP
- NetBeans的Git功能說明：Using Git Support in NetBeans IDE
我目前使用的是NetBeans 8.0版本。但是Git功能並沒有多大改變，前幾版使用時應該差不多。
我現在大部分以專案進行的開發都是使用NetBeans，不論是寫網頁、JavaScript、PHP、Java都能夠支援。例如最近一篇編譯WISE就是用NetBeans來進行。相對的，我反而比較不推薦使用大學很常教的Eclipse，它在開發網頁應用的支援較差。
Git伺服器端：GitLab / Git server: GitLab
如果要架設GitLab的話，有兩種方式可以選擇：
- 小惡魔 – 電腦技術 – 工作筆記 – AppleBOY：GitLab 快速安裝：從既有作業系統上架設GitLab的方法
- Turnkey Linux GitLab：以虛擬機器架設GitLab，例如用OpenVZ架設。
如果不想架設的話，也可以直接使用GitLab的雲端空間：
- GitLab.com：雲端私人儲存庫，剛好跟GitHub強調開放原始碼的運作方式打對臺
本篇我採用OpenVZ架設Turnkey Linux GitLab，設定IP為192.168.11.102，SSH連接埠為22，Domain Name為 git2.pudding.dlll.nccu.edu.tw。這些都是區域網路的設定，僅供本篇測試用，其他人是連不到這個網站的喔。
步驟說明 / Steps description
如果要用SSH來連接Git，我們必須要先用SSH金鑰製作工具產生公鑰跟私鑰，然後將公鑰上傳到Git伺服器端(也就是本篇的GitLab)，而Git客戶端(也就是本篇的NetBeans)要存取伺服器端時，則需要搭配私鑰來連接。
Step 1. 產生SSH的公鑰與私鑰 / Create SSH public key and private key
我在「GitHub入門 Part.2 工具安裝與環境配置 」這一篇中有介紹如何用PuTTYgen (PuTTY Key Generator)產生公私鑰。
不過這裡我們簡單一點，我隨便產生一個公鑰與私鑰直接給大家下載：
這個公鑰與私鑰僅供測試使用，正式開發環境請不要用它，不然其他人也可以用這個私鑰去連接你的私人git儲存庫喔。
Step 2. 加入SSH公鑰到GitLab / Add SSH public key to GitLab
接著登入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儲存庫。
Step 3. 使用NetBeans連接Git儲存庫 / Connect Git Repository in NetBeans
接著我們來設定Git客戶端：NetBeans。開啟NetBeans之後，從Team > Git > Clone… 找到複製的功能。
接下來是很重要的關鍵設定。
首先，Repository URL本來應該設定剛剛看到的連接網址「git@git2.pudding.dlll.nccu.edu.tw:pudding/test.git」，但如果伺服器必須指定SSH連接埠的話，那就要改用不同的形式：
- 原本的連接網址格式：[user@]host.xz:path/to/repo.git/
例如：git@git2.pudding.dlll.nccu.edu.tw:pudding/test.git - SSH的連接網址格式： ssh://host.xz[:port]/path/to/repo.git/
例如：ssh://git2.pudding.dlll.nccu.edu.tw:22/pudding/test.git
接著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跟版本控制 / Conclusion: Learn to use IDE and version control
最近實驗室又加入了新進成員，而許多人也需要開發系統作為畢業論文。由於我們系所並不是強調軟體工程的科系，所以進來的學弟妹雖然能夠看得懂程式碼，但是在開發上仍顯得生澀。
選擇好用的IDE與版本控制工具能夠降低開發過程中繁雜的操作，程式設計師主要是在邏輯思維上下工夫，而不是像打字員一樣複製大量的程式碼，還難以維護。而IDE與版本控制也是未來踏入業界開發團隊中，與他人合作開發系統時必須要具備的技能。作為未來進入職場的投資，請務必多多熟悉IDE與版本控制的操作吧。
(more...)Git合作開發從NetBeans開始！NetBeans複製git專案教學 / Clone Git Project in NetBeans
布丁布丁吃布丁
Git合作開發從NetBeans開始！NetBeans複製git專案教學 / Clone Git Project in NetBeans
本文介紹如何在NetBeans中複製Git專案到本機端，然後建立NetBeans專案，以便開始進行程式的開發。
This article describes how to clone Git project and then create a NetBeans project in NetBeans.
Git專案 / Git Project
本文以我最近要開始的新專案「PHP File Host」為例子來做示範。這是一個存放在GitHub的開放原始碼專案，大家可以任意複製(Clone)裡面的程式碼到本機端來修改。要複製Git專案的方法很多，有HTTPS、SSH與Subversion等通訊協定。在NetBeans裡面，我們可以用HTTPS通訊協定來進行複製，連線方式在GitHub專案網頁的右方下面「HTTPS clone URL」。
總結上述，以下是Git專案的資訊：
- Git專案網頁：PHP File Host
- HTTPS複製網址：https://github.com/pulipulichen/php-file-host.git
NetBeans環境 / NetBeans Version
NetBeans是我現在主要的IDE開發環境，他也是一個開放原始碼的自由軟體。NetBeans不僅支援語法標亮、自動完成(auto-completion)，從7.4版之後也開始支援Git。以往我使用TotoiseGIT來管理GIT的工作，現在逐漸都改以NetBeans來進行操作。
為了讓大家能夠更輕易以NetBeans來開始使用Git專案，本文將介紹如何複製Git專案到NetBeans中，並直接建立一個NetBeans專案來使用。
- NetBeans 網站
- NetBeans下載：建議下載All版本，可以同時支援JavaScript與PHP
- NetBeans的Git功能說明：Using Git Support in NetBeans IDE
在NetBeans中複製Git專案 / Clone Git Project in NetBeans
以下介紹如何在NetBeans中複製Git專案。大致上操作步驟分成兩個部分：從Git複製專案檔案、以及在NetBeans中建立NetBeans專案。
Git專案主要負責程式碼的版本控制，NetBeans專案通常還包括一些專案程式碼指定編碼、伺服器上傳連線等資訊，而這些資訊並不建議放到Git專案中公開，兩者要分開處理。
Part 1. 複製Git專案 / Clone Git Project
在NetBeans中，請進入Team > Git > Clone…
接著會開啟Clone Repository對話視窗。在這裡我們先進行Remote Repository設定。要輸入的欄位包括：
- Repository URL: 請輸入剛剛的HTTPS複製網址「https://github.com/pulipulichen/php-file-host.git」
- User與Password：登入GitHub的身份認證。
- Clone into：存放專案的目錄。NetBeans會在這個目錄底下再建立一個Git專案的目錄。舉例來說，我的XAMPP網頁擺在「D:\xampp\htdocs」，那麼Git專案就會出現在「D:\xampp\htdocs\php-file-host」底下。
接下來選擇要複製的Remote Branches。一般是選擇該專案的代表master分支即可。直接按「Next >」按鈕吧。
然後最後是確定目標資料夾 Destination Directory。這邊會帶入剛剛的設定，只要按「Finish」按鈕完成即可。
複製完成之後，NetBeans會問你是否要建立NetBeans專案。打勾「Open Sources in Favorites」，然後按下「Create Project…」，接下來就進入新增專案的步驟。
Part 2. 新增NetBeans專案 / Create NetBeans 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專案的工作就大功告成囉。
其他的Git操作 / How to use Git in NetBeans
當然，除了clone (複製)之外，NetBeans也支援很多Git的操作動作。以下舉例來說常用的指令與其位置：
- commit: Team > commit ，我還特地設了熱鍵Alt+C，讓自己更方便就能commit
- Pull & Push: Team > Remote > Pull or Push
- 比較檔案差異 Diff: Team > Diff > Diff To… (可以取代「Git取代分支檔案的方法」一文中以TortoiseGIT的操作動作)
Git詳細的說明請參考「Using Git Support in NetBeans IDE」一文。我也還在持續摸索中，有任何心得歡迎在下面討論喔。
結語：IDE的重要性 / Conclusion: The Importance of IDE
以前常常會聽到有人會以「只要筆記本(notepad)就可以寫網頁」來當作自豪的特技，我覺得這只能說是程式設計師的基本，只能拿來跟外行人炫耀。但是如果要往更進階前進，你就必須學習使用IDE。
就目前為止，我主要使用的IDE有Aptana Studio 2 (第三版是是完全不同的東西)跟NetBeans，在我工作中，這些IDE有幾個我非常仰賴的重要工具：
- 全文搜尋(full text search)：當我要找某個函式要如何使用時，全文搜尋是很重要的。特別是像NetBeans能夠解讀程式碼，可以在你使用函式時顯示對應的註解說明，這個功能在閱讀程式(trace code)是非常好用的輔助工具。
- 正規表達式(regular expression)的搜尋與取代：當要取代換行、找尋某個函式的使用處的時候，正規表達式非常重要。
- 自動完成(auto-completion)：有了語法自動完成，你就不用煩惱每次都為函式或變數少打一個字而帶來的bug。
- 程式導航(navigation or outline)：像是地圖一樣地顯示程式的組成，這在檢視大程式的時候十分有用。
- Git版本控制功能：一個不做版本控制的專案不僅無法持久發展，也很難跟別人協同開發。
因此我會建議每一位致力於寫程式的朋友，請務必要熟悉一些好用的IDE。如果你跟我一樣是寫PHP與JavaScript，那我建議你就從NetBeans開始吧。
(more...)Git取代分支檔案的方法 / Replace Branch Files In Git
布丁布丁吃布丁
Git取代分支檔案的方法 / Replace Branch Files In Git
我通常使用TotoiseGIT工具利用Git與團隊協同開發。當我想要把自己的分支清空，全部改用別人的檔案時，可以使用以下的方法來取代自己的分支。
This article describes how to use TotoiseGIT to replace a branch’s files to another branch.
分支說明 / Branch Description
在本文的例子中會使用兩個分支(Branch)。
- Branch A：我目前所在的分支，以本地端的pudding分支為例。我不再需要該分支的所有檔案，我希望換成Branch B的檔案。
- Branch B：目標分支，以遠端伺服器上的master為例。我希望把Branch B的檔案拿到Branch A使用。
我的方法很笨，就只是單純的替換檔案而已。以下說明做法。
Step 1. 遞交Branch A / Commit Branch A
由於接下來做的事情會變動到Branch A的檔案，不論任何修改，使用Git都應該養成隨時遞交(Commit)的習慣。因此在此我們也先遞交Branch A。如果沒有任何檔案有修改的話，也可以勾選左下角的「只有訊息」(Message only)，並撰寫遞交的訊息(Message)即可。
Step 2. 獲取Branch B的資訊 / Fetch Branch B
我們要在TotoiseGIT中獲取Branch B的資訊。
做法是開啟Git同步(Git Sync)。
選擇要同步的Branch B。你可以按下「…」按鈕，開啟分支瀏覽器 (Browse reference)，在「/remotes/kals/master」找到我們要的Branch B。按下OK確定。
點選「獲取」(Fetch)。
如果出現藍色的「Success」訊息，表示獲取成功。
Step 3. 切換成Branch B / Checkout Branch B
我們要利用TotoiseGIT的Checkout功能，把Branch A切換到Branch B去。
在該Git專案的目錄底下按右鍵，選擇Switch/Checkout。
選擇Branch為遠端的master分支：remotes/kals/master。然後勾選建立新分支(Create New Branch)、強制切換(Force)，追蹤(Track)選項保持預設。然後按下OK。
接著切換檔案，如果出現藍色的「Success」訊息，表示成功。
雖然看起來檔案沒有什麼明顯的差別，但是現在的確切換成了分支Branch B。按右鍵可以看到「Git Commit -> "master"」，表示現在的分支的確是Branch B。
Step 4. 複製Branch B的檔案到另一個資料夾 / Copy Branch B’s Files To Another Folder
接下來我建立一個資料夾叫做「kals-temp」，然後把原本資料夾「kals」裡面的檔案複製到「kals-temp」去。這樣我就可以先保留了Branch B的資料。
Step 5. 切換回Branch A / Checkout Branch A
接著我再回到「kals」資料夾，然後以類似Step 3的方法切換回Branch A，也就是本機端的pudding分支。記得勾選「強制」(Force)。
Step 6. 刪除Branch A的檔案 / Delete Branch A’s Files
然後我們不需要Branch A的檔案了，全選檔案之後，把它們統統刪除吧。
Step 7. 移動Branch B的檔案回到專案的資料夾 / Move Branch B’s Files Back To Project Folder
接著再把存放Branch B的「kals-temp」資料夾中的資料移動到專案目錄「kals」資料夾中。
現在Branch A裡面的檔案就會是Branch B的檔案了。
Step 8. 遞交Branch A / Commit Branch A
完成取代之後，再一次遞交Branch A。由於現在這個Branch A的檔案是Branch B的檔案，因此跟Step 1遞交的檔案有很大的差異。下面的檔案變動(Changes made)會列出相當多的改變。總之先保存這次的變動，遞交吧。
這樣子我們就完成拿Branch B的檔案替換到Branch A分支裡面去了的任務了。
小結：尚未摸透Git / Conclusion: Complex Git
事實上，上述這個做法看起來很愚蠢。雖然我也寫了一個簡單的Git介紹，但老實說我對於Git仍不是這麼的熟悉。分支之間檔案交換的方法還有很多種，這篇是我找到最可行的一種方式。
一般的做法都是教你使用「比較跟前面版本的差異」(Diff with previous version)。可是這種做法中，Branch A中有、Branch B中沒有的檔案，依然還會存在在替換後的Branch A中。特別是當Branch B的檔案名稱修改時，就會造成Branch A替換後出現了兩個不同名稱檔案、但是檔案內容卻一樣的問題。
不過我後來在想，是不是應該要用Rebase這個工具來取代分支檔案呢？這點我就要繼續再研究看看了。希望熟悉Git的朋友能給我一些建議吧。
(more...)
訂閱：
文章 (Atom)
Comments