add angular & terraform quick guide

main
Yik Teng Hie 5 years ago
parent 5f282f66b2
commit 4cd23964ec

@ -54,3 +54,20 @@ Quick guide on how to get started with common Frontend and Backend framework
## Docker ## Docker
* Build docker [image](./docker/README.md) * Build docker [image](./docker/README.md)
## Angular
* [Angular](./angular/README.md) Quick Start
```sql
mysql> CREATE USER 'razerpay'@'%' IDENTIFIED BY 'razerpay-singapore';
mysql> GRANT All PRIVILEGES ON *.* TO 'razerpay'@'%';
mysql> FLUSH PRIVILEGES;
mysql> SHOW GRANTS FOR 'razerpay'@'%';
mysql> REVOKE ALL PRIVILEGES ON *.* FROM 'razerpay'@'%';
mysql> DROP USER 'razerpay'@'%';
```

@ -0,0 +1,136 @@
# Angular Quick Guide
* Angular written in Typescript. AngularJS written in Javascript
* [Reference](https://angular.io)
* [Tutorial](https://www.simplilearn.com./tutorials/angular-tutorial)
* Using *Jasmine* + *Karma* testing framework
* [Spring security + angular](https://spring.io/guides/tutorials/spring-security-and-angular-js/)
## Installation
```shell
$ npm i -g @angular-cli
// create app
$ ng new my-app
// run app
$ cd my-app
$ ng serve [--open] // --open : automatically open browser @ localhost:4200
```
## Coding
```sh
// create component
$ ng generate component <component-name>
// generates
// component file: <component-name>.component.ts
// template file : <component-name>.component.html
// CSS file : <component-name>.component.css
// testing file : <component-name>.component.spec.ts
```
## Routing (Multi Page app)
```shell
$ ng new routing-app --routing
```
* Create each routes components
```shell
$ cd routing-app
$ ng generate component first
$ ng generate component second
```
* update `AppRoutingMOdule` `app-routing.module.ts`
```ts
import { FirstComponent } from './first/first.component';
import { SecondComponent } from './second/second.component';
const routes: Routes = [
{ path: 'first-component', component: FirstComponent },
{ path: 'second-component', component: SecondComponent },
];
```
* add links on landing html page `app.component.html`
```html
<h1>Angular Router App</h1>
<nav>
<ul>
<li><a routerLink="/first-component" routerLinkActive="active">First Component</a></li>
<li><a routerLink="/second-component" routerLinkActive="active">Second Component</a></li>
</ul>
</nav>
<router-outlet></router-outlet>
```
## Add Service for getting data
* [Reference](https://www.techniediaries.com/routing-angular-router/)
```shell
$ ng generate service data
// this generates
// src/app/data.service.ts
// src/app/data.service.spec.ts
```
* generated `data.service.ts`
```ts
import { Injectable } from '@angular/core';
@Injectable({
providedIn: 'root'
})
export class DataService {
constructor() { }
}
```
## Add pipes
* [Reference](https://www.simplilearn.com./tutorials/angular-tutorial)
* data transformation interface
```shell
$ ng g pipe <nameofthepipe>
// generates
// my-pipe.pipe.spec.ts
// my-pipe.pipe.ts
```
* generated `my-pipe.pipe.ts`
```ts
import { Pipe, PipeTransform } from '@angular/core';
@Pipe({
name: 'myPipe'
})
export class MyPipePipe implements PipeTransform {
transform(value: unknown, ...args: unknown[]): unknown {
return null;
}
}
```

@ -0,0 +1,190 @@
# Terraform
* [Terraform]()
* Sample terraform `main.tf`
```terraform
providers "aws" {
region = ""
access_key = ""
secret_key = ""
}
# 1. create VPC
resource "aws_vpc" "main" {
cidr_block = "10.0.0.0/16"
}
# 2. Create Internet Gateway
resource "aws_internet_gateway" "gw" {
vpc_id = aws_vpc.prod-vpc.id
}
# 3. Create Custom Route Table
resource "aws_route_table" "prod-route-table" {
vpc_id = aws_vpc.prod-vpc.id
route {
cidr_block = "0.0.0.0/0"
gateway_id = aws_internet_gateway.gw.id
}
route {
ipv6_cidr_block = "::/0"
gateway_id = aws_internet_gateway.gw.id
}
tags = {
Name = "Prod"
}
}
# 4. Create subnet
resource "aws_subnet" "subnet-1" {
vpc_id = aws_vpc.prod-vpc.id
cidr_block = "10.0.1.0/24"
availability_zone = "us-east-1a"
tags = {
Name = "prod-subnet"
}
}
# 5. Associate subnet to route table
resource "aws_route_table_association" "a" {
subnet_id = aws_subnet.subnet-1.id
route_table_id = aws_route_table.prod-route-table.id
}
# 6. Create Security Group
resource "aws_security_group" "allow_web" {
name = "allow_tls"
description = "Allow TLS inbound traffic"
vpc_id = aws_vpc.prod-vpc.id
ingress {
description = "HTTPS"
from_port = 443
to_port = 443
protocol = "tcp"
cidr_blocks = ["0.0.0.0/0"]
}
ingress {
description = "HTTP"
from_port = 80
to_port = 80
protocol = "tcp"
cidr_blocks = ["0.0.0.0/0"]
}
ingress {
description = "SSH"
from_port = 22
to_port = 22
protocol = "-1"
cidr_blocks = ["0.0.0.0/0"]
}
egress {
from_port = 0
to_port = 0
protocol = "-1"
cidr_blocks = ["0.0.0.0/0"]
ipv6_cidr_blocks = ["::/0"]
}
tags = {
Name = "allow_web"
}
}
# 7. Create network interface
resource "aws_network_interface" "web-server-nic" {
subnet_id = aws_subnet.subnet-1.id
private_ips = ["10.0.1.50"]
security_groups = [aws_security_group.allow_web.id]
}
# 8. Elastic IP
resource "aws_eip" "lb" {
vpc = true
instance = aws_instance.web-server-nic.id
associate_with_private_ip = "10.0.1.50"
depends_on = [aws_internet_gateway.gw]
}
# 9. Create ubuntu server
resource "aws_instance" "web-server-instance" {
ami = ""
instance_type = "t2.micro"
availability_zone = "us-east-1a"
key_name = "main-key"
network_interface {
device_index = 0
network_interface_id = aws_network_interface.web-server-nic.id
}
user_data = <<-EOF
#!/bin/bash
sudo apt update -y
sudo apt install apache2 -y
sudo systemctl start apache2
sudo bash -c 'echo your very first web server > /var/www/html/index.html'
EOF
tags = {
Name = "web-server"
}
}
# console log value
output "server_private_ip" {
value = aws_instance.web-server-instance.private_ip
}
```
* Commands
```bash
$ terraform init
$ terraform apply --auto-approve
$ terraform apply [-target <instance>]
$ terraform destroy
$ terraform destroy [-target <instance>]
$ terraform state list
$ terraform state show <name>
$ terraform refresh
$ terraform output
```
* variable. `terraform.tfvars`
```terraform variable
# string variable
subnet_prefix = "10.0.200.0/24"
# list of objects
subnet_prefix = [{cidr_block = "10.0.1.0/24", name="subnet-1"}, {cidr_block = "10.0.2.0/64", name= "subnet-2"}]
```
*
Loading…
Cancel
Save