flex-shrink 是當設定 flex 的情況之下，子元素的總寬度大於父元素的寬度時，就會依比例的減去子元素的寬度空間。
XD Plugin 入門 - 建立與 UI 介面篇
上禮拜公司的設計師和我說，他想要有一個可以拖曳 icon 的 XD 插件，然後說 XD 文件上說只要會 HTML, CSS 和 JS 就可以做了，最後烙下一句狠話：『這個你不會做的話，那還說你是前端工程師？』聽到這句話，燃起我的熊熊鬥志，趁著清明連假、防疫之餘，就找個時間研究一下～
HTML img 也能有 bg-image 的 cover 效果
一說到讓不同寬高的圖片都可以填充在一區塊裡，大多數人應該都是先想到使用 background-image + background-size: cover。
TypeScript - Interfaces
Interfaces + Classes = TS 提高程式碼複用性。
這一篇主要是介紹與了解 Interfaces 的作用，並會在下一篇文章介紹 Classes 與兩者併用的技巧與好處。
TypeScript - 資料型別 和 Type Annotations
你是否有打開過某一個專案，發現裡面的變數名稱是 a, b, c 等，完全無法透過變數直接了解其作用？此時若是使用 TypeScript，就可以透過型別的註釋，加速了解正在傳遞的數據類型，進而提高程式碼的可讀性。