第 70 期 - 天上的 Bug 笑地上的工程師

本週專欄

來征服資料結構與演算法吧 | 關於 Linked List 的基本介紹 feat. JavaScript

不曉得大家會不會和我一樣,每一次打開 LeetCode 看到什麼 Linked List 或是 Tree 的題目,腦袋就直接當機,呈現失智狀態。雖然要完全搞懂得花一番功夫,但學會後絕對是想忘也忘不掉啦(畢竟是曾經那麼苦惱的記憶 😂)!本篇文章就來分享關於 Linked List 的學習心得和一些相關題目的解析方式。

前端開發

Maximally optimizing image loading for the web in 2021

如果你正愁著該如何優化圖片載入的速度,或是不想要破壞使用者的操作體驗,那一定不能錯過這一篇!文章裡提到了 8 種載入圖片的方式,來看看哪種最適合應用到你的網頁上!

A beginner’s guide to applying color in UI design

這是一篇非常棒的文章!作者用一個簡單的 Product card,一步步解釋該如何配色可以讓整個畫面更協調,整個過程包含了確定主題、如何利用陰影,以及尋找一個單一的原色到應用!雖然一步一步往下看會覺得 Product card 沒什麼變化,但是當你看到最後,再往上滑到修改前的樣子,就會有「哇!那麼神奇!」的感覺!

Add A Little Whimsy to Your Forms

這篇不算是什麼技術分享的文章,但是卻能給人滿滿的歡樂!有時候我們在做作品時總是一成不變的在切版、寫 JS 串 API 或是前端操作邏輯,那些看起來很有趣的作品早就已經是像公式一樣的存在了,但也許今天你只要小小的加入一些有趣的元素,例如在填寫完表單,並按下送出按鈕時噴射出七彩的紙屑怎麼樣?我們在做的東西,應該是更有趣的才對,對吧?😊

Promise 中的三兄弟 .all(), .race(), .allSettled()

為了要在 Promise 陣列中可以順利回傳資料回來,以前都會用 Promise.all 但這個 method 有個問題就是要全部的 Promise 都 resolved 才會回傳值,可是現在很多網站如果都用這種方式來取得資料的話可能會讓使用者體驗下降,因此後來官方又推出了一個 Promise.allSettled,這個方法是會把 Promise array 中所有的 Promise 都執行完畢,即便有 Promise 被 rejected 也會回傳,這樣就可以針對一些錯誤的資料做例外處理了非常方便。

Moment Timezone

有時候在對接一些 API 時會需要傳入跟時間相關的 query string,假如產品是架設在雲端機器上那就一定會有時差問題,這時候就必須要考慮 timezone 了,而大家最常用的時間套件 moment.js 也有針對 timezone 做 plugin,這樣就可以無痛使用 moment.js 來處理 server time 跟 client time 的時差問題了。

React app中常見的跨站攻擊漏洞

以前我一直以為 React 已經完美的防範 XSS 攻擊了,直到我看到這篇文章才知道原來如果今天用的是 Isomorphic Rendering,就有可能會讓黑客有機可趁了,這時候就需要用到 sanitize-html 的方式來解析 html

Golang

用 10 分鐘了解 Go 語言 context package 使用場景及介紹

很多人(包括我)在初學 Go 時都會不知道 context 是做什麼用的,碰到參數需要傳 context 的情況就直接用 ‘context.Background()` 矇混過去XD,而這篇文章解釋了為什麼會需要 context,看完後除了會用 context 之外,也不會再覺得官方為什麼要把這樣種奇怪的寫法納入標準

Go is not an easy language

雖然 Go 被認為是個很簡單、易學的程式語言,但這篇文章認為那僅有在實現簡單的功能時是這樣,如果想要寫出高效能的程式,那很多時候程式碼就沒辦法那麼直觀,甚至會變得有點複雜

50 Shades of Go: Traps, Gotchas, and Common Mistakes

這篇文章列出了 50 個在寫 Go 時最常犯的小錯誤,看了一下真的有一些我自己也犯過的錯XD,建議大家都可以看看(不想看英文的話文章最上方有中文翻譯的連結)

DevOps

APIs vs. WebSockets vs. WebHooks: What to Choose?

當 Client 和 Server 要進行溝通時,可以使用 API, WebSocket 或是 WebHook 這三種的其中一種,雖然這三種都可以達成溝通的目的,但其實彼此之間有很大的不同點,所以作者透過這篇文章來討論這三種方法是如何運行,以及如何根據使用情境來選擇三者之中最合適的方法

50 Reasons Kubernetes Sucks

有人覺得其實 K8s 根本就不是一個好的平台,但卻沒有人敢站出來說,所以作者條列了 50 個為什麼他覺得 K8s 很爛的原因,例如:API 總是進行不相容的大改動,Service Meshes 根本是把垃圾構築在一堆垃圾上面,有種你用兩年前的版本來更新看看…等,老實說自己看完覺得有些不無道理

Kubecost

本週最後不免俗要來介紹個人看到滿有趣的開源工具叫做 Kubecost,它提供的模型可以讓使用 Kubernetes 的團隊了解目前 K8s 資源使用情況,而且他還可以直接把這些資源所反映的真實成本根據不同的應用服務,團隊或是部門…等給計算出來,很簡單的就可以知道目前 K8s 燒錢的狀況XD

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 倍工程師!
  • @LukaJoJo - 一名全身都是死角的工程師。
  • @smalltown - 熱愛鑽研各種可以提升雲端服務品質及增進團隊開發效率的開源技術。

Feedback

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