Angular具有大部分开源项目不具备的完善的文档与指导体系，在开始上手Angular之前， 强烈建议阅读Angular快速上手文档，按照官方文档指导完成快速开始项目以及英雄指南项目。

1 Angular安装

和其他JavaScript项目一样，Angular开发环境需要安装Nodejs版本10以上，Angular采用TypeScript作为标准开发语言，因此还需要安装TypeScript等包。快速开始一个Angular项目可以通过安装Angular命令行通过脚手架指令快速搭建：

  1. npm install -g @angular/cli    #全局安装Angular命令行工具
  2. ng new my-app #利用脚手架快速搭建一个名称为my-app的项目
  3. cd my-app & npm i #进入项目根目录并通过npm安装需要的所有包文件
  4. ng serve #编译并运行项目，在浏览器中输入 http://localhost:4200 可以看到通过开发服务器运行起来的网站

2 Angular组件库NG-ZORRO和ng-alain

如果仅仅使用Angular作为前端Web开发框架的话，还需要大量的工作才能实现生产环境的项目开发，因此，通常的项目开发中还会使用封装好的组件库作为开发基础，Angular中最常用的几个组件库分别有官方的MATERIAL，蚂蚁金服主导的NG-ZORRO（Ant design组件库的Angular版本）以及华为的DEVUI，当然，对于有经验的团队，也可以直接使用更具有通用性的Bootstrap等库作为基础来开发。
为了进一步抽象业务，在组件库基础上，还有类似ng-alain之类的优秀项目，提供针对中-后台或者特定领域的业务实现库，虽然每个新库都需要一定的学习成本，但了解之后确实可以在他人工作基础之上避免重复制造轮子来提高开发效率。

NG-ZORRO的安装

  1. ng new PROJECT_NAME #通过标准的angular命令行命令开始新项目
  2. PROJECT_NAME
  3. ng add ng-zorro-antd # 通过ng add指令添加ng-zorro组件库以开始ng-zorro项目
  5. #如果要进一步添加并开始一个ng-alain项目
  6. #注意，以下指令暂时仍只支持angular 8，如果使用（目前）最新的angular 9可能需要下载ng-alain库以开始项目
  7. ng add ng-alain #通过ng add指令添加ng-alain并开始ng-alain项目

3 VS Code中的Angular插件

在VS Code编辑器中可以通过安装 Angular Essentials (version 9) 插件来安装一整套的 VSCode angular插件。如果要使用Angular 8，那么则需要安装对应的 version 8版本。当然，如果不希望安装所有插件（建议都安装），也可以分别安装进行Angular项目开发可能需要的VS Code插件。包括了：

  • Angular Essentials(Version 12) 。使用angular常见的插件合集
  • Angular Snippets
  • Angular Language Service
  • Angular Console
  • Beautify 。 代码美化工具
  • Bracket Pair Colorizer 2 。括号自动配对工具
  • Chrome Debugger。代码调试工具
  • Edge Debugge
  • ESlint。 Lint工具
  • Live Share/Live Share Audio/Live Share Extesion Pack 。代码培训远程共享工具
  • NG-ALAIN Extension Pack 。 ng-alain扩展包
  • NG-ZORRO Snippets 。 ng-zorro代码片段
  • Peacock 工作共享工具
  • Remote-SSH。远程开发插件
  • Rest Client 。Rest接口调试工具
  • Todo Tree。 代码TODO标签管理工具
  • Typescript Hero。 TypeScript语言相关工具
  • VSCode Nestjs Snippets。Nestjs 代码片段。

4 浏览器插件Augury

为了快速检查和分析基于Angular开发的网站（这在调试中是非常有用的），可以安装（仅支持Chrome和Firefox浏览器）Angury插件，安装完该插件后，在Chrome或者Firefox的开发者工具栏中，可以看到Augury选项，如果网站采用Angular开发，则在Augury标签下可以看到网站的模块与组织，对网络开发者非常实用。

  • Augury项目网站
  • 鉴于以上原因，Angular开发者应该安装Chrome或（和）Firefox浏览器进行项目开发与调试