Cypress 升級到 13 以後有資料夾重大結構的 Break Change, 不過官方都很貼心的使用介面幫你一次升級, 只要無腦的按按鈕就可以, 紀錄一下步驟如下。

最近因友人需要一個 Discord 的 alert 提醒, 所以研究了一下怎麼單方面將 Google 日曆的內容推送到 Discord 的 channel 中且不要花到錢. 參考了此 repo Google-Calendar-API-to-Discord-Webhook, 並改寫設定讓 alert 一天只發送一次, 大幅減少 google api 的呼叫次數, 這樣就可以繼續用免費帳號使用功能. 設置步驟如下.

最近因工作需求, 需從 Redis Server 找大量的資料出來 Debug 程式邏輯. 但每次手動從 UI 介面點開 -> 複製 -> 貼到 VSCode -> 存檔, 非常繁瑣, 且一次都要抓快十個不等的檔案, 非常費時。所以為了能節省我寶貴的時間, 決定用 NodeJS 直接寫一隻來接 Redis 抓資料. 原本要花十分鐘弄得東西, 幾秒鐘就搞定,心理 OS 只有一個字,爽!!!

最近工作上需要寫一隻全新的 chatbot plugin, 因為這種 case 很吃 UI 的畫面, 所以除了 js 外一定會用到 html + css, 而且由兩個人以上共同維護。之後這個 plugin 將會接到各 website 上, 所以想要出來的成品能輕量化且高執行效率。我開始爬文比較各種 JS, CSS 框架，最終選擇 Vite & Svelte & TailwindCSS, 作為 plugin 的基底, 他們都有很完整的文件, 對於多人開發很方便。接下來針對這個組合一一做介紹。程式放在 github。

SVG 通常會搭配 CSS Animation 做動畫，效能很不錯。但問題來了，如果設計師給一張很複雜的 SVG Banner 圖，需要只動裡面其中幾個物件，那使用 JS 會比較方便，就不用每張切圖對 x,y 位置，且 JS 能撰寫比較多使用者互動。這次就來測試使用 SVG.js 做動畫。

最近發現公司內網不明原因會擋住 npm install cypress，但安裝其他的套件就不會發生，所以只好搜尋看要怎麼手動安裝 cypress。

此篇記錄 Vuetify 從 v1 升級到 v2 所要注意的事情。

隨著時間越長，專案總會越寫越多功能，可是如果每次重構後都要人工測試，會花費很多不必要的時間。所以為了往後能安心的重構程式，我想要一個可以方便 debug 且使用簡易的 UI Testing Framework。參考了許多架構後，決定要使用 cypress + cucumber 來寫測試。

工作中遇到一個情境是，打 API 可以要到當下的資訊，但 User 想要幾分鐘之內的紀錄，如果要做報表的話，就要非常手動的用 postman 打 API N 次，然後再將儲存下來的 json 轉成 csv，最後再將 n 個 csv 合成一份檔案。實際若是每分鐘打一次 API，假設只抓十分鐘，就是存十次 json 檔案，再將十個 json 檔案轉成十個 csv ，最後再手動合成一個 csv 檔案，光是手動的時間絕對超過三十分鐘。為此，我決定要寫一隻程式讓上面的所有動作自動化。

最近朋友問我關於 Redux 的問題，但我已經有兩年沒碰 React 了。所以藉此機會找了 youtube 上的教程，好好複習一次。