第 26 期 - 讓瀏覽器自己說話原來那麼簡單！

Created on 2020-04-28

本週專欄

Side Project 從無到有-讓網頁自己說話！

目標是讓瀏覽器能夠閱讀 Time for kids 的文章內容，這個部分利用了 Chrome extension 來獲取網頁中的內容，說話的部分也有 JavaScript 的原生方法，SpeechSynthesisUtterance 和 SpeechSynthesis 可以使用，是個簡單好上手的 Project！

神 Q 超人

【無障礙網頁祕技】前端切版前要注意什麼細節呢？

無障礙網頁主要是要讓「視覺障礙者」或「聽覺障礙者」可以使用其他替代方式獲得網頁的資訊內容，為了讓他們能夠更方便地閱讀網站，切版時需要注意哪些事情呢？本篇文章用了一些網站為範本來講解無障礙網站的特色。

如果對無障礙有更深的興趣，也非常推薦第 11 屆鐵人賽的得獎作品「實踐無障礙網頁設計（Web Accessibility）」

10+ Best of Javascript Games

如果你既是個前端工程師也喜歡遊戲，那絕對不能錯過這 10 個有趣的 JavaScript 遊戲！只是第一個和最後一個我實在是捉摸不定他們的玩法 😭

How to Build a Simple Pokémon Web App with React Hooks and the Context API

這是個很有愛的 Side Project 😂，讓我想到之前也曾經因為無聊做了一個神奇寶貝背包，雖然在文章中是用 React 完成的，但因為作者有把思考的一切都用文字清楚地表達出來，所以不妨可以用自己的做法重新跟著做一遍（無聊的話啦 😂），或是想一下要是你會如何去解決碰到的問題！

Larry Lu

What is the `toJSON()` Function in JavaScript?

在 JS 中，當你嘗試把一個物件進行 JSON.stringify 時他會呼叫物件的 toJSON method，所以可以透過自己實作 toJSON 讓那些複雜的物件只顯示出比較重要的資訊，滿實用的一個小技巧

How to Manage Database Timeouts and Cancellations in Go

在開發後端 API 時有時會遇到 SELECT 操作超時，或是資料還沒撈出來但請求已經被取消了，這時就可以用 Go 的 context 優雅的取消資料庫的操作，避免那些需要跑很久的指令把資料庫卡死

How Netflix brings safer and faster streaming experiences to the living room on crowded networks using TLS 1.3

Netflix 最近為了提升使用者體驗開始採用 TLS 1.3，而這篇文章大概介紹了 TLS 是什麼，以及 TLS 1.3 跟舊版比起來有什麼特別厲害之處。雖然 TLS 不是應用層協定所以一般人不太會接觸到，但文章本身不難可以當作增廣見聞看看

LukaTW

7 amazing CSS properties you may not know (yet)

你可能沒看過的 7 個令人驚艷的 CSS 屬性。極度炫炮的 7 個 CSS 屬性，原來還可以這樣喔？嗯嗯嗯嗯阿阿嗯嗯阿。

TDD Changed My Life

TDD 改變了我的生活。學 TDD 有什麼好處？可以學到軟體的經濟學。可以學到五個寫 unit test 必須問自己的問題。可測試的程式碼帶來更好的軟體架構。如何使用更多的 pure funtion？測試 React.js 的元件。

Building a Rails App With Multiple Subdomains

Ruby on Rails 中如何實作 subdomain 呢？看這篇就對了！即使你使用的框架不是 Rails，也可以借此觀念思考看看，你使用的框架該如何實作 subdomain 的功能。

smalltown

來瞧瞧看 Kubernetes Cluster API v1alpha3 多了什麼樣的新功能吧！

Cluster API 是一個 Kubernetes 的專案，希望可以使用宣告式而且類似於 K8S 風格的 API 來新增，設定組態跟管理叢集，而在 v1alpha3 多了不少實用的功能！

Declarative Control Plane Management: 提供 API 讓使用者可以 Deploy 跟 Scale K8S 的 Control Plane (包含 etcd)，這個是很多 Cluster API 使用者很想要的功能，因為現在要做到這些事情，尤其是 etcd 的管理，其實都是有點手工在進行操作的
Support for Distributing Control Plane Nodes Across Failure Domains To Reduce Risk: Cluster API 使用者可以把 Control Plane 節點分成多群的概念，要是今天有某一群的 Control Plane 節點壞掉了也不用擔心，可以切到另外一群去做使用
Automated Replacement of Unhealthy Nodes: 讓一個 K8S 的節點壞掉的原因可能有很多種，新的 Cluster API 現在包含 MachineHealthCheck 這個資源，並且還多了一個 Controller 來監控節點的健康情況，要是今天某一個節點出問題了，就會被自動移除掉；而且可以在 Controller 中設定移除掉的條件，例如要等多久，最多只能移除幾個節點…等
Support for Infrastructure-Managed Node Groups: 假如使用者維護很大的 Cluster，所以可能會需要一次新增或是刪除數以百計的節點，雖然 Public Cloud 可以乘載很大量的節點，但是針對每一個 Node 的管理都要透過分開的 API 請求去達成，這樣的做法太沒有效率跟擴展性了；所以假如 Public Cloud 有提供節點的分群機制，例如 AWS Auto Scaling Grup，Azure Machine Scale Set, GCP Managed Instance Group…等，透過 Infrastructure Providers 整合來支援這個新的 Cluster API 的話，使用者就可以直接 Deploy 整群的節點

StarBugs Weekly

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

Curators:

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

Feedback

想看什麼內容，告訴我們！點我回饋意見