第 107 期 - 是時候該貓一下了

Created on 2021-11-16

本週專欄

用 HackMD 與 Github Action 打造你的靜態網站「線上文章編輯平台」

今天來分享一下如何使用 Github Action 與 HackMD 優化 Blog 發布的流程。第一部分我們聊部屬(deployment)，也就是把網站上線的過程，第二部分我們聊如何加入 HackMD 來優化我們的寫文章體驗。以後想要寫文章，只要有地方上網，用 HackMD 即可開始編輯。手機也可以通！

前端開發

該如何入門 CTF 中的 Web 題？

CTF 一直是個很有趣的比賽，參賽者必須要想辦法在網頁上尋找相對應的 flag 或者讓網頁產生一些奇怪的行為，雖然自己身為一位前端工程師但玩了 CTF 才知道自己原來對前端這麼不熟，想要一起了解 CTF 是甚麼的讀者歡迎閱讀這篇文章，之後就可以慢慢摸索一些 CTF 的練習題了！

Custom Elements defining new elements in HTML

原來 HTML tag 是可以自己隨便定義一個出來的，不一定要是 HTML5 中規範的 tag，其實會突然分享這個文章也是因為上面的 CTF 有些技巧是需要用到這種手段才能達到的，所以假如讀者不知道 HTML tag 可以自己自定義的話也可以看看這篇文章，裡面都有一些作者對於自定義 tag 的見解。

CSS Tricks to Create that Dark Futuristic Web3 Look

這個真的太酷了，沒想到 CSS 還有這麼多的玩法可以讓一個文字有這麼多不同的顯示方式，學會了這些技巧就不用擔心設計師突然設計出一個難以開發的樣式了XD

useRef or useState, which is better?

雖然 useRef 或 useState 都可以存放想要的東西，在使用上貌似滿雷同的，但其實兩者對 Component render 的影響可是完全不一樣的！會分享這篇文章也是我突然想到 SWR 就是利用 useRef 來存放 state 唷！

Writing Clean Code in JavaScript

JavaScript 在近幾年真的提供了很多方便的寫法，只要善用就可以讓程式碼變得更簡潔，當然同時也出現了各種古怪的寫法 😂，在使用上還是要考慮到之後的人容不容易看懂。

react-router-dom 6.x 版本让我🐓 🐝 了

最近在研究 React 的專案配置時，一如往常地裝了 react-router-dom，然後依照記憶寫下程式碼，結果在執行後卻發現錯誤狂噴，原來是 react-router-dom 更新到 v6 後，一堆寫法都變了，而今天又看到這篇文章就覺得不分享不行，希望之後的人少走一點坑。

Go

Upcoming Features in Go 1.18

除了泛型之外，預計在明年發布的 Go 1.18 其實還有一些其他 feature，像是用來做測試的 fuzzing、聽說（？）更快的 go fmt，還有新的 net/netip package，看完都等不及要開始用了

Best Practices for Testing in Go

這篇文章除了跟你說在寫測試時有哪些該注意的重點之外，也教你怎麼把 function/struct 設計得更好測試，如果你最近想寫 unit test 來增加程式的可靠性，卻發現不知道從何著手，那可以參考看看這篇文章

Design Patterns in Go

如果想要從 Go 下手開始學習設計模式的話，這邊有一個很不錯的網站，他除了會把每個 pattern 畫成 UML 圖之外，還會給你非常實際的範例，對於理解 pattern 的應用場景非常有幫助

DevOps

Announcing Grafana OnCall, the easiest way to do on-call management

在維運服務時，系統總是會有遇到問題需要求救的時候，設定一個彈性又有效的 On Call 輪值方式是相當重要的一件事情，很多既有的工具使用起來要嘛很麻煩，要嘛對於開發者來說很不友善，所以 Grafana 宣布推出簡單易用的 Grafana On Call 管理工具，用來降低管理 On Call 輪值所需要的功夫，目前在 Grafana Cloud 為 Beta 公測階段；Grafana On Call 主要是透過今年所收購 Amixr Inc 所開發出來的，而他主要有以下三個特點：

簡單建立跟管理 On-Call 時程
利用自動逐步升級 (Escalation)且彈性的引導方式 (Routing) 確保找到人協助系統問題
讓 On-Call 與 Incidnet 的狀態在同一個 UI 中顯現管理

Terraform Cloud Variable Sets Beta Now Available

Terraform 的 Module 引用方式讓使用者可以一直重複利用既有的程式碼，而不需要重新造輪子，而現在 Terraform Cloud 針對變數也推出一樣的功能 - variable sets，他讓使用者可以重複使用 Terraform 所定義或是環境變數，而且不止是從 Root 到 Child Module，還可以橫跨某些 Workspaces 甚至是 Organization；自己發現 Terragrunt 也有類似的功能，看來 Terraform 這邊也跟上來了

Flux Security Audit has concluded

CNCF 最近對旗下 Incubation Project 進行 Security Audit，做完馬上發現一個 CVE: CVE-2021-41254，可以讓有心人士可以在 Multi-Tenant Flux 提權成 Cluster Admin (有使用 Flux 的人要記得升級)，而整個詳細的稽核報告已經被公開在網路上，找到將近 22 條涵括各種不同的 Risk Level 的問題，目前 43% 的 Issue 在 TODO 階段，21% WIP，36% 已經修完，詳細的進度可以參考 GitHub Project，看起來 Flux 從另外一個面向投入資源，試圖跟其他的 GitOps 競爭工具做出差異化

StarBugs Weekly

StarBugs Weekly 由一群不寫文章就會想要亂花錢，但是又沒有那麼多錢，只好繼續寫文章的開發者所創立。
內容包含 Web 前端、中端、後端、DevOps、產品開發、精實創業，一切跟產品有關的知識，都是我們的守備範圍！

Writers:

@HannahLin - 從台灣到矽谷，熱愛前端的工程師女孩。
@KyleMo - 雜食性軟體工程師，喜歡的技術我都想學。
@Airwaves - Hi~我是 Airwaves，熱愛研究如何造輪子的前端工程師。
@Jenny - 我不寫 CSS。
@Andy - 目標成為用嘴巴工作的工程師，專長為網頁開發以及 K8s。

Maintainers:

@GQSM - Hi！我是神 Q 超人，一個先衝再說的男人。
@LarryLu - 我是 Larry，傳說中的 0.1 倍工程師！
@LukaTW - 一名全身都是死角的工程師。
@smalltown - 熱愛鑽研各種可以提升雲端服務品質及增進團隊開發效率的開源技術。

Feedback

本週呈現主題方式做了一些改變，希望讓讀者能夠更快速精準的找到自己要的資訊。也加入社群活動這個區塊，每週更新社群活動的資訊。如果有任何建議，歡迎私訊星巴哥技術週刊 FB 粉絲專頁與我們聯繫。