第 69 期 - 開學了才發現有寒假作業

本週專欄

不知道 bug 躲在哪個 commit 嗎?來試試 Git bisect 吧!

大家好我是 Larry,這週的專欄要來跟大家分享 Git 的進階技巧 - Git bisect,他主要是用來幫你找到哪個 commit 是有問題的。很多時候雖然我們有用 Git 做版本控制,但在主線上發現 bug 時往往已經過了一陣子,面對一兩個禮拜的歷史紀錄也無法快速揪出 buggy commit 是哪一個,這時候就可以把 Git bisect 請出來幫忙啦~

前端開發

Announcing Vite 2.0

Vite 2.0 在今年 2/16 號發佈啦!Vite 以最速稱號降臨在 Web 前端開發的生態圈內,作者在講解 Vite 2.0 的新功能前,還先分享了一則用 create-react-app 當作祭品,比較了兩者間的運行速度的 twitter 貼文,看到後瞬間將 Vite 的學習優先度在心中拉到最前面。😂

How to convert any website/webpage into an installable progressive web app (PWA)

文章中介紹了什麼是 PWA,也講解了如何透過簡單的 4 個步驟讓你的網站轉換成可以安裝在電腦或手機上的應用程式!(其實更讓我驚訝的是作者的年紀才 17 歲!😂)

Don’t comment your code

雖然這篇文章有點標題殺人,但作者想表達的意思其實是「註解存在的意義應該是要增加價值,而不是讓人更難理解甚至是產生混亂。」文章中舉了滿多種不適當的註解(個人最受不了的就是明明就有用 Git 但還註解程式碼)。

access control allow origin

相信很多前端工程師一定會遇到這個問題,但其實 CORS 可以說是瀏覽器用來存取 API 限制器,很多初學者都會覺得 CORS 是我某個 header 沒帶到而導致的錯誤,但其實 CORS 是 response 被瀏覽器屏蔽的起來,所以基本上遇到 CORS 問題是沒辦法純前端解決的一定要靠後端。

When to useMemo and useCallback

基本上這個問題應該已經被問到爛了,但有些前端工程師為了優化還是會濫用這些方法,但有時候反而會讓整個優化後的效能更差,畢竟優化都是要付出代價的,其實 React 已經會做初步的優化了,如果還要自己進行優化的話真的要更了解自己的架構不要為了優化而優化。

穩定排序和不穩定排序

最近在研究前端的 sort api 時無意間看到這個文章,才知道原來排序有那麼多眉角還有分穩定跟不穩定,不是只有單純的排序而已,讓只會氣泡排序的我真的是看到了一個新世界XD

Node.js

Dependency Confusion: How I Hacked Into Apple, Microsoft and Dozens of Other Companies

這大概是近期我看過最有趣的攻擊方式XD,他的原理是利用 npm install 在安裝時,如果遇到某個 package 的名稱在 private registery 跟 npm 上都有,那會優先選擇版本比較新的。所以只要猜一下別人的公司的 private package 叫什麼,然後到 npm 上發佈一樣名字的惡意 package,對方就會意外執行到你寫的程式碼

New JavaScript Features You Can Expect in ES2021

雖然 2021 年才剛開始而已,但 ES2021 可能會有的新 feature 已經出來啦~包括前陣子討論度很高的 Promise.any 跟 WeakRefs 都在這個版本裡面,快來事先預習一下吧

JavaScript Symbols: But Why?

JS 的 Symbol 有一些很有趣的特性,像是每個 Symbol 都是獨一無二的,而且還可以被拿來當 property 名稱,因此可以拿來做一些有趣的應用,像是防止 property 撞名、模擬 private property 等等

DevOps

How they SRE

許多技術組織或是公司都會定期在各種公開平台 (例如 技術部落格,研討會,小聚…等) 提出並分享其最佳實踐,工具,技術還有工程文化的見解,而作者很熱心地把這所有的文章,書籍,影片都收集到這個 How they SRE 的 GitHub Repository 中,涵蓋的主題主要分為底下幾個大類

  • Site Reliability Engineering
  • Hiring and Building SRE teams
  • SRE Culture
  • DevOps
  • Monitoring & Observability
  • Alerting
  • Incident Response & Post-Mortem
  • On-Call
  • Testing in Production
  • Chaos Engineering
  • Automation
  • Performance

Extending applications on Kubernetes with multi-container pods

這篇文章介紹要如何在不修改程式碼的情況之下,透過 Ambassador, Adapter, Sidecar 和 Init Container 來擴展運行在 K8s 中的應用服務功能,例如讓不支援 TLS 加密的服務透過 Nginx Proxy Container 來達成 TLS 加密傳輸;並且詳細解說在 Multi-Container 運行的 Pod 中,裡面的每個 Container 在網路跟資料層面上要會如何運作

Command Line Interface for Terraform Enterprise/Cloud: tecli

連續好幾週都會介紹一個工具類的開源專案,而這週要談的是一個叫做 TECLI 的 CLI 工具,作者要大家想像在一個一切雲端資源都是由 Terraform 所掌控的世界裡,要如何方便地透過 Terraform Cloud API 操控 Terraform 進而管理所有的雲端資源?!當然就是透過今天介紹的這個 TECLI CLI 工具,在維運人員終端機器上或是 CI/CD 系統上執行簡單的命令,讓 Terraform 幫你管理好所有的雲端資源,有在使用 Terraform Cloud 的人千萬不要錯過了!

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 粉絲專頁 與我們聯繫。