让我们开发一个 Angular 应用程序 – Angular 应用程序的基本架构
介绍
在本文中，我试图介绍 Angular 的基本架构和安装步骤。
这是我的文章系列“让我们开发一个 Angular 应用程序”的介绍性文章。
在进入 Angular 的世界之前，让我们先了解一下 Angular 的一些基础知识。
众所周知，angular 是一个 Javascript 框架，用于创建单页应用程序（SPA）。这意味着我们的应用程序有一个页面来显示所有信息 (Index.html)。页面加载后，Angular 会动态更改页面内容。这样，最终用户会认为我们有多个页面。Angular 是最常用的前端技术之一，可帮助开发人员创建出色的应用程序。
Angular 应用程序具有以下特点：
- 结构良好
- 易于维护
- 代码可重用性
- 关注点分离
- 反应灵敏
Angular 应用程序是使用 TypeScript 语言构建的。
TypeScript 是 JavaScript 的超集。因此，TypeScript 具有 JavaScript 的所有功能和一些附加功能。TypeScript 支持强类型。与 JavaScript 不同，我们可以为 TypeScript 变量指定数据类型。这将帮助我们为应用程序提供更多安全性，并帮助我们在编写代码或调试时尽早识别和消除错误。
在编译 TypeScript 代码时，它将被转换为 JavaScript。这个过程称为“转译”。
Angular 应用的剖析
Angular 应用程序由组件和服务组成。
请参考下图。
服务
这些服务用于提供跨组件的功能。最好的方法是将业务逻辑实现为服务，并通过使用它来执行 UI 相关逻辑来保持组件类的轻量级。
这不仅可以帮助我们保持组件类的轻量级，还可以让我们与其他组件共享业务逻辑
组件
每个组件都有自己的类文件，其中包含组件的值和逻辑。CSS 文件也与每个组件相关联。在一个组件的 CSS 文件中定义的样式将仅适用于该组件。
模块
Angular 模块将我们的组件保持在一起。这将帮助我们将我们的应用程序组织成内聚的功能块。
如果需要，我们可以为应用程序创建任意数量的Angular 模块。
重要的一点是所有的 Angular 应用程序都应该至少有一个模块——app 模块。
app 模块是 angular 在创建 angular 项目时提供的默认模块。
设置环境
要设置 angular 环境以开发 Angular 应用程序，我们必须安装 2 个实用程序。
- Node.js
- Angular CLI
首先，我们需要安装 Node.js
通过安装 Node，npm（Node Package Manager）就可以使用了。
Npm 是一个命令行实用程序，可以与开源项目的存储库进行交互。
Npm 可用于安装库、包、应用程序以及依赖项。
转译过程也是 npm 的职责。
要获取 Node.js，请访问nodejs.org。
接下来，我们需要安装 Angular CLI。
这也是一个命令行实用程序，负责创建用于设置 angular 应用程序的样板文件。Angular CLI 可用于创建项目、生成应用程序代码、执行各种开发任务，例如测试、构建、部署等。
我们可以使用 npm 命令安装 Angular CLI。
- 打开终端或控制台窗口
- 执行以下 npm 命令
npm install -g @angular/cli
我们可以通过执行以下命令来检查 angular 版本：
ng – -version
我们将得到如下结果：
成功安装 npm 和 Angular CLI 后，我们可以通过执行以下命令来创建 Angular 项目：
ng new our-project-name
这将需要几分钟来创建项目。
创建项目后，我们可以执行项目并通过执行以下命令查看结果。
ng serve –open
需要更多阅读吗？, 点击 >> 这里
结论
在本文中，我试图给出一个关于 Angular 应用程序的介绍性想法。接下来，我们应该了解 angular 应用程序如何执行和启动组件，我在下一篇文章中已经解释过。
要阅读我的下一篇文章，请单击 >> #2- Angular Bootstrapping Process
常见问题FAQ
- 程序仅供学习研究，请勿用于非法用途，不得违反国家法律，否则后果自负，一切法律责任与本站无关。
- 请仔细阅读以上条款再购买，拍下即代表同意条款并遵守约定，谢谢大家支持理解！
