Note：這個專案只適合初學者，對 Angular 熟悉的可以跳過。
相信很多Angular初學者在學習過程中都閱讀過成熟開源專案的程式碼，比如：ngx-admin，primeng。這些專案，內容豐富，結構良好，唯一的缺點就是太大了，新手剛接觸的時候會比較懵，不知道如何下手。
我當初也有過這樣的經歷，突擊學習 Angular 一個月然後做專案，過程中的血和淚不再細表。學習過程中，折騰我最久和讓我印象最深刻的地方有兩點：
- 如何引入第三方外掛庫
- 如何理解和使用路由
第一點，我以前在 SegmentFault 上問過這個問題 Angular 4.X版本如何引入第三方JS的庫，已經有了很好的回答，這裡就不再贅述。
第二點才是我這篇文章的目的，我將真實專案中的結構簡化抽取出來，著重於演示切分頁面使用路由，寫了一個簡單易懂，對初學者比較友好的，很容易理解並模仿的小專案 HW-admin。
主介面如下：
很典型的企業應用，此專案遵循 Angular 推薦的結構規範，層次清晰明瞭，也包括懶載入，預載入等功能。主要的樣式暫時使用 Bootstrap，將一些常用的第三方庫封裝進來，比如 jQuery，Echarts等。
程式碼量不大，結構也很簡單，假如看過之後理解了，寫類似專案的佈局應該是輕而易舉的事情。
熟悉 Angular 的小夥伴假如對移動端開發感興趣的，我推薦下 ionic ，基於 Angular 的， 可以看我另一個ionic 小專案 hw-basic。
歡迎 fork 和 star