Merge pull request #183 from Baejw0111/master

Translate containers.md, text.md, icons.md into Korean

i18n/ko/docusaurus-plugin-content-docs/current/tour/connections.md

@@ -1,10 +1,10 @@
-# 연결(Connections)
+# 커넥션(Connections)
 
-연결은 도형 간의 관계를 정의합니다.
+커넥션은 셰이프 간의 관계를 정의합니다.
 
 ## 기본
 
-도형 사이의 하이픈 또는 화살표는 연결을 정의합니다.
+셰이프 사이의 하이픈 또는 화살표는 커넥션을 정의합니다.
 
 ```d2
 Write Replica Canada <-> Write Replica Australia
@@ -15,10 +15,10 @@ Write Replica -> Master
 Read Replica 1 -- Read Replica 2
 ```
 
-연결에서 선언되지 않은 도형을 참조하는 경우 해당 도형이 새로 생성됩니다([hello world](hello-world.md)에서 확인 가능).
+커넥션에서 선언되지 않은 셰이프를 참조하는 경우 해당 셰이프가 새로 생성됩니다([hello world](hello-world.md)에서 확인 가능).
 
 :::info
-4가지 방법으로 연결을 정의할 수 있습니다.
+4가지 방법으로 커넥션을 정의할 수 있습니다.
 
 - `--`
 - `->`
@@ -27,22 +27,22 @@ Read Replica 1 -- Read Replica 2
 
 :::
 
-### 연결 레이블(Connections labels)
+### 커넥션 라벨(Connections labels)
 
 ```d2
 Read Replica 1 -- Read Replica 2: Kept in sync
 ```
 
-### 연결 시 레이블이 아닌 도형의 키를 참조해야 합니다.
+### 커넥션 시 라벨이 아닌 셰이프의 키를 참조해야 합니다.
 
 ```d2
 be: Backend
 fe: Frontend
 
-# 새로운 도형이 생성됩니다
+# 새로운 셰이프가 생성됩니다
 Backend -> Frontend
 
-# 기본 레이블(키)에 대한 연결을 정의합니다.
+# 기본 라벨(키)에 대한 커넥션을 정의합니다.
 be -> fe
 ```
 
@@ -61,10 +61,10 @@ super long shape id here --\
 
 <div className="embedSVG" dangerouslySetInnerHTML={{__html: require('@site/static/img/generated/connections-1.svg2')}}></div>
 
-## 반복 연결(Repeated connections)
+## 반복 커넥션(Repeated connections)
 
-반복된 연결 선언은 기존 연결을 재정의하지 않습니다.
-대신 새로운 연결이 생성됩니다.
+반복된 커넥션 선언은 기존 커넥션을 재정의하지 않습니다.
+대신 새로운 커넥션이 생성됩니다.
 
 ```d2
 Database -> S3: backup
@@ -74,12 +74,12 @@ Database -> S3: backup
 
 <div className="embedSVG" dangerouslySetInnerHTML={{__html: require('@site/static/img/generated/connections-2.svg2')}}></div>
 
-## 연결 체이닝(Connection chaining)
+## 커넥션 체이닝(Connection chaining)
 
-가독성을 위해, 한 줄에 여러 연결을 정의하는 것이 더 자연스럽게 보일 수 있습니다.
+가독성을 위해, 한 줄에 여러 커넥션을 정의하는 것이 더 자연스럽게 보일 수 있습니다.
 
 ```d2
-# 레이블은 연결 체인의 각 연결에 적용됩니다.
+# 라벨은 커넥션 체인의 각 커넥션에 적용됩니다.
 High Mem Instance -> EC2 <- High CPU Instance: Hosted By
 ```
 
@@ -96,7 +96,7 @@ Stage Four -> Stage One: repeat
 
 ## 화살표 머리(Arrowheads)
 
-기본 화살표 머리의 모양을 재정의하거나 화살표 머리 옆에 레이블을 지정하려면 `source-arrowhead` 또는 `target-arrowhead`라는 속성을 사용해 정의합니다.
+기본 화살표 머리의 모양을 재정의하거나 화살표 머리 옆에 라벨을 지정하려면 `source-arrowhead` 또는 `target-arrowhead`라는 속성을 사용해 정의합니다.
 
 ```d2
 a: The best way to avoid responsibility is to say, "I've got responsibilities"
@@ -105,13 +105,15 @@ c: I still maintain the point that designing a monolithic kernel in 1991 is a
 
 a -> b: To err is human, to moo bovine {
   source-arrowhead: 1
+
   target-arrowhead: * {
     shape: diamond
   }
 }
 
 b <-> c: "Reality is just a crutch for people who can't handle science fiction" {
   source-arrowhead.label: 1
+
   target-arrowhead: * {
     shape: diamond
     style.filled: true
@@ -139,12 +141,12 @@ d -> a -> c
 :::
 
 :::info
-화살표 머리의 레이블은 짧게 하는 것이 좋습니다.
-일반 레이블처럼 최적의 위치 지정을 위해 자동 레이아웃이 이뤄지지 않으므로 레이블이 길 경우 주변 개체와 충돌할 가능성이 큽니다.
+화살표 머리의 라벨은 짧게 하는 것이 좋습니다.
+일반 라벨처럼 최적의 위치 지정을 위해 자동 레이아웃이 이뤄지지 않으므로 라벨이 길 경우 주변 개체와 충돌할 가능성이 큽니다.
 :::
 
 :::caution
-화살표 머리 속성 부여 시 연결 내에 해당하는 화살표 머리가 존재하지 않는다면 아무 작업도 수행하지 않습니다.
+화살표 머리 속성 부여 시 커넥션 내에 해당하는 화살표 머리가 존재하지 않는다면 아무 작업도 수행하지 않습니다.
 다음 예시의 경우, 출발점에 화살표 머리가 없기 때문에 아무 작업도 수행하지 않습니다.
 
 ```d2
@@ -155,9 +157,9 @@ x -> y: {
 
 :::
 
-## 연결 참조(Referencing connections)
+## 커넥션 참조(Referencing connections)
 
-원래 ID 뒤에 인덱스를 지정하여 연결을 참조할 수 있습니다.
+원래 ID 뒤에 인덱스를 지정하여 커넥션을 참조할 수 있습니다.
 
 ```d2
 x -> y: hi

i18n/ko/docusaurus-plugin-content-docs/current/tour/containers.md

@@ -0,0 +1,100 @@
+# 컨테이너(Containers)
+
+```d2
+server
+# 셰이프 안에 셰이프를 선언
+server.process
+
+# 컨테이너와 자식을 동시에 선언할 수 있습니다.
+im a parent.im a child
+
+# 연결도 키를 선언할 수 있으므로 아래와 같은 것도 가능합니다.
+apartment.Bedroom.Bathroom -> office.Spare Room.Bathroom: Portal
+```
+
+<div className="embedSVG" dangerouslySetInnerHTML={{__html: require('@site/static/img/generated/containers-1.svg2')}}></div>
+
+## 중첩 구문
+
+중첩 구문을 통해 중첩 맵을 생성하면 컨테이너를 반복적으로 작성하지 않아도 됩니다.
+
+```d2
+clouds: {
+  aws: {
+    load_balancer -> api
+    api -> db
+  }
+
+  gcloud: {
+    auth -> db
+  }
+
+  gcloud -> aws
+}
+```
+
+<div className="embedSVG" dangerouslySetInnerHTML={{__html: require('@site/static/img/generated/containers-2.svg2')}}></div>
+
+## 컨테이너 라벨
+
+컨테이너 라벨을 정의하는 방법에는 두 가지가 있습니다.
+
+### 1. 약식 정의
+
+```d2
+gcloud: Google Cloud {
+  ...
+}
+```
+
+### 2. 예약된 키워드 `label`을 사용하는 방법
+
+```d2
+gcloud: {
+  label: Google Cloud
+  ...
+}
+```
+
+## 예시
+
+```d2
+clouds: {
+  aws: AWS {
+    load_balancer -> api
+    api -> db
+  }
+
+  gcloud: Google Cloud {
+    auth -> db
+  }
+
+  gcloud -> aws
+}
+
+users -> clouds.aws.load_balancer
+users -> clouds.gcloud.auth
+
+ci.deploys -> clouds
+```
+
+<div className="embedSVG" dangerouslySetInnerHTML={{__html: require('@site/static/img/generated/containers-3.svg2')}}></div>
+
+## 부모 참조
+
+Sometimes you want to reference something outside of the container from within. The underscore (`_`) refers to parent.
+내부에서 컨테이너 외부의 무언가를 참조하고 싶을 때 사용합니다.
+언더바 기호(`_`)로 외부의 다른 부모 컨테이너를 참조하고 있다는 것을 나타냅니다.
+
+```d2
+christmas: {
+  presents
+}
+birthdays: {
+  presents
+  _.christmas.presents -> presents: regift
+  _.christmas.style.fill: "#ACE1AF"
+}
+```
+
+<div className="embedSVG" dangerouslySetInnerHTML={{__html: require('@site/static/img/generated/containers-underscore.svg2')}}></div>