軲轆 UI
軲轆 UI 是一個不太一樣的 UI 框架。
本 UI 框架是一個「面向原始碼閱讀者」的框架。如果對你有幫助，請不要吝惜你的 star。
也就是說，我製作這個框架的目的就是讓前端新人學習輪子的製作思路。所有程式碼都追求可讀性。
- 你可以通過檢視逐個 commit 來學習本框架的製作思路
- 也可以通過我錄製的視訊來學習 （抱歉，由於製作非常耗時，所以視訊是收費的。不過專案搭建過程的錄屏是免費的，這幾節視訊能幫你快速從零開始本專案。）
如果你想從第一個commit 開始看，請點選這裡。
如果你對程式碼有疑問，歡迎提issue，我會回答你的疑問。也可以在本文末尾加群諮詢。
本 UI 框架是基於 Vue 2 實現的。
注意：本 UI 框架的程式碼尚未完全完工（目前程式碼大概完成 50%），請不要在生產環境中使用本 UI 框架。
你能學到什麼
- 單元測試、覆蓋率、持續整合等工程概念
- 重構、TDD/BDD、設計模式、單向資料流等技術概念
- Vue 的幾乎所有功能，並且是深入理解這些功能，而不是膚淺理解
有哪些輪子
- 簡單輪子：按鈕、輸入框、網格、佈局、Toast、Tabs、Popover、手風琴（程式碼已完成）
- 進階輪子：級聯選擇、無縫輪播、響應式導航條、分頁、表單驗證、Table、圖片上傳、Sticky、Tree、Suggestion、Datepicker（程式碼未完成）
- 其他：路由、狀態管理（程式碼未完成）
注意：這只是目前的計劃，具體要完成的輪子可能與上面有出入。
專案特點
- 使用 Travis CI 進行持續整合
- 有豐富的單元測試，專案完成時，期望測試覆蓋率超過 90%
- 自說明的程式碼，即使沒有註釋，你也能看懂
- 初期我使用 parcel 構建方便新人上手，後期改為 Vue Cli 3 以實現更多功能
背景
我幾年前曾經發表過《笨辦法學前端》一文， 當時我覺得開源社群裡雖然有很多不錯的庫，但是這些庫都是以實用為主，其原始碼並不適合新人閱讀。
於是我業餘時間用原生 JS 造了幾個輪子放在 GitHub，沒想到居然有幾百人關注，還希望我能釋出更詳細的教程。
但是我當時並沒有時間來做更詳細的教程。
現在我終於……還是很忙，不過我決定用每週六和週日來錄製「造輪子」的視訊。
這一次為了順應前端的潮流，我直接採用 Vue 2 來造輪子。如果你正在學習 Vue 2，那麼軲轆 UI 的原始碼會非常適合你閱讀。
視覺稿
本 UI 框架借鑑了一些成熟 UI 框架（如 Framework7、Element UI 和 Ant Design）的外觀，簡化之後我自己製作了一個視覺稿。
如果你發現視覺稿有什麼不足的地方，可以直接在上面留言，我也會看到。
為什麼叫軲轆UI
因為軲轆就是「輪子」的意思。