feat(infra): add alerts

assets/docs/scss/custom/structure/_general.scss

@@ -83,6 +83,9 @@ p {
   margin-top: 1.25rem; /* custom rule */
   margin-bottom: 1.25rem; /* custom rule */
 }
+.alert > div > p {
+  margin-top: 0; /* custom rule */
+}
 
 /* disabled by custom */
 /* img {

content/docs/infra/3. Docker.md

@@ -29,8 +29,6 @@ weight = 330
 - Dockerfile을 이용하여 이미지를 만들고 배포해봅니다.  
   (알아볼 속성: FROM, RUN, COPY, CMD, ENV, WORKDIR, ENTRYPOINT, ADD, HEALTHCHECK)
 
-> 더 공부해보면 좋을 것들(선택): Docker Best Practices
-
 #### 참고 자료
 
 - **[노마드코더 "Docker 가 왜 좋은지 5분안에 설명해줌" (약 5분)](https://youtu.be/chnCcGCTyBg?si=FWg6DVKfOjTCgCOb)**: 도커가 무엇인지, 왜 쓰는지를 간단하게 설명해줍니다.
@@ -45,8 +43,7 @@ Nginx는 웹 서버로, 요즘은 대부분의 서버가 Nginx를 사용합니
 - Proxy(reverse vs. forward)와 Load Balancing의 개념을 이해합니다.
 - Nginx를 설치하고 설정하는 방법을 배웁니다.
 
-> [!WARNING]  
-> Nginx 연습은 Docker로 하는 걸 권장합니다! 로컬에 설치한 Nginx는 기존에 설치된 서버와 충돌할 수 있고, 원복이 어려울 수 있습니다. [Nginx 이미지](https://hub.docker.com/_/nginx)로 컨테이너를 만들고, 로컬의 nginx.conf 파일을 볼륨으로 연결해보세요.
+{{< alert context="warning" text="Nginx 연습은 Docker로 하는 걸 권장합니다! 로컬에 설치한 Nginx는 기존에 설치된 서버와 충돌할 수 있고, 원복이 어려울 수 있습니다. [Nginx 이미지](https://hub.docker.com/_/nginx)로 컨테이너를 만들고, 로컬의 nginx.conf 파일을 볼륨으로 연결해보세요." />}}
 
 #### 참고 자료
 
@@ -77,8 +74,7 @@ flowchart LR
 - Express 어플리케이션을 Dockerize합니다. [공식 Node.js Docker Image](https://hub.docker.com/_/node/)를 Dockerfile에서 `FROM`으로 사용해주세요.
 - Nginx 이미지는 공식 이미지를 그대로 사용하면 됩니다. nginx.conf와 index.html 파일을 볼륨으로 연결해주세요. (week2.html의 이름을 변경해주세요!)
 
-> [!NOTE]  
-> **Dockerize란,** 서비스 코드와 의존성을 container에 담는 Dockerfile을 작성하고, Docker CLI를 이용하여 이미지를 빌드하고 컨테이너를 실행하는 과정입니다.
+{{< alert text="**Dockerize란,** 서비스 코드와 의존성을 container에 담는 Dockerfile을 작성하고, Docker CLI를 이용하여 이미지를 빌드하고 컨테이너를 실행하는 과정입니다." />}}
 
 > **Challenge! 🔥 (선택)**  
 > Express 컨테이너를 두 개 띄우고, Nginx(또는 Caddy)에서 load balancing 기능을 사용해보세요.  

content/docs/infra/4. AWS: EC2, Network.md

@@ -30,11 +30,9 @@ AWS(Amazon Web Services)는 클라우드 컴퓨팅 플랫폼으로, 현재 전
 - **[AWS Console](https://console.aws.amazon.com/console/home)**: AWS에 회원가입하고, AWS Console에 로그인해봅니다.
 - **[아마존 웹 서비스 AWS 2단계 인증 활성화하는 방법](https://www.lainyzine.com/ko/article/how-to-enable-multi-factor-authentication-on-amazon-web-service/)**: AWS 계정에 MFA를 설정하는 방법을 설명합니다.
 
-> [!IMPORTANT]  
-> AWS 계정을 소중하게 다뤄주세요! AWS 계정이 해킹되면 순식간에 수천만원이 과금될 수 있습니다. MFA 설정을 꼭 해주시고, 각종 secret과 token이 외부에 노출되지 않도록 각별히 유의해주세요. **(GitHub에 절대 올리면 안돼요!)**
+{{< alert context="danger" text="AWS 계정을 소중하게 다뤄주세요! AWS 계정이 해킹되면 순식간에 수천만원이 과금될 수 있습니다. MFA 설정을 꼭 해주시고, 각종 secret과 token이 외부에 노출되지 않도록 각별히 유의해주세요. **(GitHub에 절대 올리면 안돼요!)**" />}}
 
-> [!NOTE]  
-> 앞으로 AWS 실습하면서 최대한 free tier 한도 내에서 실습하겠지만, 일부 실습은 소정의 요금이 발생할 수 있습니다. 요금이 발생할 수 있는 실습은 주의해서 진행해주세요!
+{{< alert context="warning" text="앞으로 AWS 실습하면서 최대한 free tier 한도 내에서 실습하겠지만, 일부 실습은 소정의 요금이 발생할 수 있습니다. 요금이 발생할 수 있는 실습은 주의해서 진행해주세요!" />}}
 
 ### 2. Amazon EC2
 
@@ -52,8 +50,7 @@ AWS의 가장 기본 서비스라고 할 수 있는 EC2를 사용해봅니다. E
 - **[생활코딩 "AWS - EC2 기본 사용법" (약 15분)](https://youtu.be/Pv2yDJ2NKQA?si=QaQlK6SNN_hZ03Cx)**: EC2를 세팅해보는 실습 영상입니다. 영상의 UI가 최신이 아니라서 실제 UI와 좀 다를 수 있지만 감안하면서 따라해보세요.
 - **["EIP(탄력적 IP) 개념 & 사용 세팅 정리" (글)](https://inpa.tistory.com/entry/AWS-%F0%9F%93%9A-%ED%83%84%EB%A0%A5%EC%A0%81-IP-Elastic-IP-EIP-%EB%9E%80-%EB%AC%B4%EC%97%87%EC%9D%B8%EA%B0%80)**: Elastic IP의 개념과 사용 방법을 정리한 글입니다.
 
-> TIP: 아래 링크에서 EC2 instance type을 쉽게 비교해볼 수 있어요.  
-> https://instances.vantage.sh
+{{< alert icon="💡" text="TIP: 아래 링크에서 EC2 instance type을 쉽게 비교해볼 수 있어요.<br>https://instances.vantage.sh" />}}
 
 ### 3. AWS Network
 
@@ -96,8 +93,7 @@ curl -fsSL https://get.docker.com | sudo sh -
 - Elastic IP로 고정 IP를 할당해보세요.
 - [도메인 등록 가이드](../reference/Free%20Domain.md)에 따라 무료 도메인(.tech)를 발급받아 Elastic IP를 등록해보세요.
 
-> [!NOTE]  
-> 브라우저에 IP 주소나 도메인을 입력하면 기본적으로 HTTPS 연결을 시도합니다. HTTPS 연결을 위해서는 SSL 인증서가 필요한데, 이번 실습에서는 SSL 인증서를 발급받지 않고 HTTP로만 연결합니다. 반드시 앞에 `http://`를 붙이고 접속을 시도해주세요!
+{{< alert text="브라우저에 IP 주소나 도메인을 입력하면 기본적으로 HTTPS 연결을 시도합니다. HTTPS 연결을 위해서는 SSL 인증서가 필요한데, 이번 실습에서는 SSL 인증서를 발급받지 않고 HTTP로만 연결합니다. 반드시 앞에 `http://`를 붙이고 접속을 시도해주세요!" />}}
 
 > **Challenge! 🔥 (선택)**  
 > EC2를 VPC 내부에 구성하고, internet gateway로 외부와 통신할 수 있도록 설정해보세요.

content/docs/infra/6. AWS: ECS.md

@@ -2,9 +2,15 @@
 title = "6. AWS: ECS"
 description = "AWS의 컨테이너 관리 서비스인 ECS에 대해 알아봅니다."
 icon = "article"
-date = "2023-09-11"
-lastmod = "2023-10-05"
+date = "2023-10-30"
+lastmod = "2023-10-30"
 weight = 360
 +++
 
-{{< alert context="info" text="작성 준비 중입니다! 조금만 기다려주세요. 🥹" />}}
+Amazon ECS는 AWS에서 제공하는 컨테이너 관리 서비스입니다. 쿠버네티스와 비슷하지만, 조금 더 쉽게 사용할 수 있어요.
+
+이번 시간에는 스꾸딩 인프라 팀의 꽃이라고 할 수 있는 ECS에 대해 알아보겠습니다.
+
+## 공부할 내용 📚
+
+## 프로젝트 실습 🎈