上禮拜公司的設計師和我說，他想要有一個可以拖曳 icon 的 XD 插件，然後說 XD 文件上說只要會 HTML, CSS 和 JS 就可以做了，最後烙下一句狠話：『這個你不會做的話，那還說你是前端工程師？』聽到這句話，燃起我的熊熊鬥志，趁著清明連假、防疫之餘，就找個時間研究一下～

一說到讓不同寬高的圖片都可以填充在一區塊裡，大多數人應該都是先想到使用 background-image + background-size: cover。

本篇的主旨：

• Class 的運用
• Class + Interface 的運用

圖文說明使用 Vue Cli 開發後，如何將 build 出的靜態檔推到 gh-pages 分支，並使用 GitHub Pages 開啟。

Interfaces + Classes = TS 提高程式碼複用性。
這一篇主要是介紹與了解 Interfaces 的作用，並會在下一篇文章介紹 Classes 與兩者併用的技巧與好處。