破境Angular（一）初识Angular

一、序言

破境Angular系列是什么以及为什么要写破境系列？
破境系列的初衷是通过归纳核心要点使开发者能够：

1. 快速掌握核心知识，节省时间
2. 巩固和牢记核心知识，为后续的深入扩展奠定基础

因此破镜系列不会讲解大量的代码样例，参考代码样例最好的资源是官网：https://www.angular.cn/，对于有时间，有耐心的人而言官网是个好去处。
～现在，开启破境之旅吧！

二、简介

Angular是一个单页应用(SPA)前端框架，为当今流行的三大前端框架之一，三大流行框架如下：

1. Angular，Google开发
2. ReactJS，facebook开发
3. Vue，最初由国内尤雨溪自筹开发，现在已经有一个开发团队。

2018年stateofjs网站针对前端框架做的调研结果如下：

可以看出三大框架React最热，Angular其次，Vue排在最后；而在使用过该框架不想继续使用的人当中Angular首当其冲，这或许是因为每次修改代码实时编译运行等待时间较长的原因（个人感受）。Vue因为上手快，发展也较快，React阿里巴巴内部在用，并且有配套工具支撑，相信后续仍然会独占鳌头。

三、开发语言

Angular的开发语言为Type Script，是Java Script的超集，和Java Script的关系如下：

Type Script不能直接运行，需要编译为Java Script才能运行，开发态、运行态和语言的对应关系如下：

其中SASS/LASS为可选，它们是CSS的超集，其功能为通过编程的方式编写CSS，减少代码量并提高开发效率，它们需要编译为CSS后运行。SASS学习资源可参考：https://www.sass.hk/

四、开发工具和插件

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栈开发效率。