破境Angular（一）初識Angular

1、序言

破境Angular系列是什麼以及爲何要寫破境系列？
破境系列的初衷是經過概括核心要點使開發者可以：

1. 快速掌握核心知識，節省時間
2. 鞏固和牢記核心知識，爲後續的深刻擴展奠基基礎

所以破鏡系列不會講解大量的代碼樣例，參考代碼樣例最好的資源是官網：https://www.angular.cn/，對於有時間，有耐心的人而言官網是個好去處。
～如今，開啓破境之旅吧！

2、簡介

Angular是一個單頁應用(SPA)前端框架，爲當今流行的三大前端框架之一，三大流行框架以下：

1. Angular，Google開發
2. ReactJS，facebook開發
3. Vue，最初由國內尤雨溪自籌開發，如今已經有一個開發團隊。

2018年stateofjs網站針對前端框架作的調研結果以下：

能夠看出三大框架React最熱，Angular其次，Vue排在最後；而在使用過該框架不想繼續使用的人當中Angular首當其衝，這或許是由於每次修改代碼實時編譯運行等待時間較長的緣由（我的感覺）。Vue由於上手快，發展也較快，React阿里巴巴內部在用，而且有配套工具支撐，相信後續仍然會獨佔鰲頭。

3、開發語言

Angular的開發語言爲Type Script，是Java Script的超集，和Java Script的關係以下：

Type Script不能直接運行，須要編譯爲Java Script才能運行，開發態、運行態和語言的對應關係以下：

其中SASS/LASS爲可選，它們是CSS的超集，其功能爲經過編程的方式編寫CSS，減小代碼量並提升開發效率，它們須要編譯爲CSS後運行。SASS學習資源可參考：https://www.sass.hk/

4、開發工具和插件

Aangular可以使用微軟的Visual Studio Code開發，它有不少好用的插件用以提升開發效率，下面是我用到的一些：

1. Chinese (Simplified) Language: 漢化工具
2. Debugger for chrome：調試工具
3. Angular 7 Snippets：
4. HTML Snippets：
5. JavaScript(ES6) code snippets：
6. HTML CSS Support：
7. Angular Follow Selector：
8. Path Autocomplete for Visual Studio Code：
9. Path Intellisense：
10. Angular Language Service：
11. Bracket Pair Colorizer：
12. Indenticator：
13. Git History：版本管理
14. GitLens：版本管理
15. Version Lens：版本管理
16. SimonTest：測試工具
17. Angular 2 TypeScript Test Snippets：測試工具

OK，首篇破境之旅就介紹到這裏！

下期預告：【破境Angular（二）Angular構件之模塊】

.End

---

Java棧實戰營---關注Java棧及其衍生技術，經過實戰經驗分享，傳播Java棧技術和提升Java棧開發效率。