在 Angular 程式加上終端機的功能

像GCP、AWS這類的平台，都有內建的Console功能，就是像Mac和Linux的Terminal一樣，只是是在Web上操作。要寫這個控制項其實不難但複雜度極高，要我來寫大概要寫10天到一個月。

但PrimeNG內建就有這個控制項，我也不知道他們為啥會覺得需要加這個控制項到UI庫裡面，但就是很帥，又很好使用。

好用嗎？

我不會給使用範例因為官方範例寫得很好。我只會分享說使用的時候的心得。

其實真的超好用，如果CSS又是用PrimeFlex的話，根本就是完美整合。用絕對定位把它定位在某個物件的下方。點一個按鈕終端機就出來。

或者把它放在Footer的部分，點一個按鈕，Footer就出現終端機，就像GCP一樣。

然後要監控指令只要用訂閱就好了（Subscription），只要訂閱以後使用者輸入一個指令，就可以寫一個函數 handleCommand 來處理指令。

然後用它內建的Service，sendResponse來回應應該回應的內容。

缺點呢？

PrimeNG是我最近帶領公司在開發專案的時候用的工具，最大的缺點在於如果把所有的CSS、UI庫都弄到相依性，連寫都還沒寫多少功能，就會超過1.05MB的輸出大小（這裡指的是Production的大小）。

這個如果在傳輸會收費的狀態下，其實不是太好友善。

且UI庫直接用會跟舊世代的Windows程式一樣，還是要懂的怎樣利用一些HTML＋CSS＋ngFor等等來處理資料。

目前團隊寫了快半個月，在Code Review的時候，直接用UI庫的大多我都認為不能過。

那用PrimeNG錯了嗎？

我個人認為一點都沒錯，因為我們的程式不會因為一點的流量或者檔案大小影響。

不能用UI庫是指不能直接用，直接用真的是還蠻Low的。會變成舊世代的Windows程式一個一個文字方塊甚至連排列都還很難整齊。

我認為挑選PrimeNG當這次的開發工具是很正確。因為節省了公司開發的20~30%時間，如果我過一陣子研究的更透徹，也許可以節省50%開發時間。

外觀好看嗎？

老實說我目前找不到外觀比他好看的樣板或者UI庫。對於我不是研究UI/UX設計的人來說，PrimeNG真的讓我可以寫出讓人覺得很漂亮的程式。

結論

我覺得在程式加個終端機太酷炫了。