在本系列的第 2 部分我们已经介绍身份认证，授权，功能规划以及数据建模。

接下来本系列的第 3 部分将介绍如何通过 Node API 从 MongoDB 检索数据以及通过 Angular 在前段显示和过滤数据:

1. API:获取 Events 数据

在本系列的第 1 部分我们已经介绍了如何配置云托管的 MongoDB, Node 服务器，还有 Angular 前端项目。

接下来本系列的第 2 部分将介绍身份验证、授权、功能模块规划和数据建模:

1. Angular:身份验证
2. 角色授权

本系列教程的第一部分将介绍如何为实际的 Angular 应用程序设置云托管的 MongoDB 数据库、Node 服务器和前端。

1. 介绍：我们打算做什么？
2. 配置 Angular 应用
3. 配置托管的 MongoDB
4. Auth0 的配置
5. Node.js 服务器设置
6. Angular: 创建 HomeComponent
7. Angular: 布局和全局组件

Angular 实战系列将会带领你构建和部署一个完整的 JavaScript 应用程序，基于托管的MongoDB,Express,Angular以及Node.js技术栈（MEAN）.

系列索引

Using Services & Dependency Injection

Service Creation

1
2
3
4
5

export class LoggingService {
  logStatusChange(status: string) {
    console.log('new status:' + status);
  }
}

Components & Databinding Deep Dive

Usually we splitting Apps into Components. so how does component communicate with each other?

Property Binding

Generally all properties or components are only accessible inside these components not from outside. But you can expose property to the world by adding @Input decorator, so that any parent component is now able to pass data to our exposed properties downstream.

Component Selector

1
2
3
4
5
6
7
8
9
10

# component selector
## element
'app-demo'
usage: <app-demo></app-demo>
## attribute
'[app-demo]'
usage: <div app-demo></div>
## class
'.app-demo'
usage: <div class='app-demo'></div>

随着Angular 6的发布, Angular CLI在一定程度上可以说是有了很大的提升。Angular CLI集成ng-packagr构建生成 Angular 库就是其中之一。ng-packagr 是由 David Herges 创建的一个很棒的工具，用于将你的库代码转换成官方约定的Angular 包格式。

接下来的内容中，你将体验创建一个自己的 Angular 库的具体过程。并且，为了避免陷入不必要的麻烦，创建的过程中我会着重强调一些实用的规则。

相应的GitHub 代码

介绍

通过ng new Angular CLI 为我们创建了一个新的工作区(workspace).

# 前面

Google Cloud Platform 是 Google 提供的云端服务,目前提供 365 天免费的 300 美金优惠试用,并且超过 365 天或者赠金已消费完,没有你的允许它也不会继续扣款,以下是我在上面搭建个人 VPN 的过程,欢迎参考:D

整体大概流程：申请免费谷歌云服务 => 创建虚拟实例 => 在实例搭建SSR或L2TP/IPsecVPN 服务

# 申请谷歌云服务