第 71 期 - 天竺鼠車車開車囉

Created on 2021-03-09

本週專欄

電腦科學入門 Crash Course

今天來介紹一下 Crash Course 。Crash Course 是 Youtube 一億美元原創計畫的所創造的頻道之一。由葛林兄弟所創立。內容以人文、科學系列向外延伸。截至今日已經有 1200萬的訂閱者。

前端開發

也許您的網站其實並不需要使用圖片輪播（Slider）功能，分析 8 個明顯的缺點

本篇文章從效能、SEO、需求或 RWD 版面等…各個角度來看圖片輪播在中小型網站使用的看法，並且用了許多目前大家隨處可看見的圖片輪播網站當做例子，分成幾個主題解釋它們為何能夠使用，以及你為什麼可能不需要。

CSS Grid Cheat Sheet Illustrated in 2021🎖️

如果你看了 MDN 或其他教學的文件卻始終搞不太清楚如何使用 CSS 中的 Grid，那我猜應該是少了可愛的獨角獸，快來給這清楚明瞭又可愛的獨角獸一次機會！ 😂

JS中的EventLoop、宏任务、微任务

當你在面試前端工程師時，對方起手先列出了一堆 setTimeout、Promise、async、await 要問你執行順序時，大概有 870％都是想考有關 Event loop 的概念，為了不要和當初被電到不行的我一樣 😂，趁這機會一次搞懂吧！

innerText、innerHTML、textContent、outerHTML 的差別

最近在研究以前 DOM 的 API 時，以往我只會用 innerHTML 但後來發現這個 method 其實存在了蠻多資安風險，後來有了 sanitise 的觀念後知道其實還有 textContent 的做法可以讓整個 injection 更安全一點，這篇文章講述了幾個最原始用來 inject html 的方法。

Linked lists in the wild: React Hooks

以往真的覺得演算法在前端開發完全沒有太直接的利益關係，畢竟前端要求的很多都是對於 DOM 的操作要熟悉，後來才知道 React Hooks 其實內部是用 linked-list 實作的。

Before You memo()

在 React 中有一句話非常經典：優化必須要花很多成本，有時候自己以為的優化其實只會拖垮整個效能，像在 class component 時期有一個 PureComponent 以及現在 Hook 的 memo() 都是讓 component 優化的方法，但在使用這些方法之前不妨先看一下此 component 是否真的適用這些優化方法。

Golang

Remove source path from Go’s panic stack trace

這篇文章很短，主要講說平常在 Go 裡面呼叫 panic 時，程式會把整個完整的路徑輸出出來，但有時路徑太長反而會不容易看，而這時就可以在編譯時加個 -trimpath，輸出的路徑就會簡潔很多～

Life of an HTTP request in a Go server

平常在用 Go 架 HTTP server 時，很少人會仔細去研究一個請求從進來到出去到底經過了哪些關卡。不過現在有人幫你研究完寫成文章了，雖然文有點長但寫得滿好的，看完真的可以更了解 Go 內建的 http package 是怎麼處理請求

Go internals: invariance and memory layout of slices

這篇文章跟第二篇是同一個作者，不過這篇更硬一點，主要是在介紹 Go slice 在記憶體內長什麼樣子，建議至少有寫過一些 Go 再來看，不然可能會完全看不懂他在分析什麼XD

DevOps

雖然在執行 terraform apply 之前可以透過 terraform validate 和 terraform plan 稍微檢查一下，不過這樣就夠了嗎？大家都希望把變更在生產環境執行之前可以快速先發現問題，讓 terraform apply 的執行更有信心，所以這篇文章想要跟大家談談如何達成這個目標，一路從 Unit Test 介紹起，接著談到 Contract Tests, Integration Tests, End-to-End Tests…等

Spectral raises $6.2M for its DevSecOps service

DevSecOps 的議題在最近兩三年還滿熱門的，Spectral 最近除了為大家帶來他的 Code Scanner 服務之外，也宣布獲得 620 萬美金的投資，這間新創公司希望可以從程式碼和日誌就發現潛藏的資安漏洞，例如找出寫在程式碼中的 API Key 和其他機敏資訊，除此之外，也可以找出有資安問題的錯誤組態設定…等，對這些議題有興趣的人，可以看看他們是如何實作這些功能的

Introduction to k3d: Run K3s in Docker

因為 K8s 的盛行，越來越多 Kxx 的工具如雨後春筍般冒出，這次的工具叫做 K8d，他讓使用者可以利用最輕盈的 K8s Distribution - K3s (單一個 Binary 檔案，而且只需要 512 MB 的 Ram) 在有安裝 Docker 的電腦就將 K8s Cluster 給運行起來；而此工具最主要的目的是希望讓 K8s 的本地端開發可以又輕鬆又節省資源！

StarBugs Weekly

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

Writers:

@HannahLin - 從台灣到矽谷，熱愛前端的工程師女孩。
@Kyle老莫 - 無法忍受自己一天不進步的熱血社會菜雞。
@Airwaves - Hi~我是 Airwaves，熱愛研究如何造輪子的前端工程師。
@Jenny - 我不寫 CSS。

Curators:

@Andy - 目標成為用嘴巴工作的工程師，專長為網頁開發以及 K8s。

Maintainers:

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

Feedback

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