update english for 3, 4, 5, 6, 7, 8, 9

content/3-prepare-for-deployment/3.1-push-image-to-ecr/_index.md

@@ -5,3 +5,44 @@ weight = 1
 chapter = false
 pre = "<b>3.1. </b>"
 +++
+
+#### Push the Image to ECR
+
+First, go to the ECR Console interface
+
+- Select the Frontend image
+- Copy **URI**
+
+![3.1.1](/images/3-prepare-for-deployment/3.1.1.png)
+
+Go back to the EC2 instance that we configured earlier
+
+- Navigate to the project directory.
+- Enter the **frontend** folder.
+- Use the following command and replace "image-uri" with your corresponding image URI.
+
+```bash
+sudo docker build . -t "image-uri":latest -f Dockerfile.prod
+```
+
+![3.1.2](/images/3-prepare-for-deployment/3.1.2.png)
+
+{{% notice note %}}
+In this frontend directory, you’ll notice there are two Docker files: **Dockerfile** and **Dockerfile.prod**, as well as two nginx config files: **default.conf** and **default.conf.template**. The difference with **Dockerfile.prod** is that Docker will copy the **default.conf.template** file to the **/etc/nginx/templates** directory so that during the build process, the `envsubst` command can be used to replace the **${BACKEND_HOST}** and **${BACKEND_PORT}** parameters in the **default.conf.template** file. Once these parameters are replaced, the template file will be used by nginx for configuration. I will explain these two parameters more clearly when configuring them later. 
+{{% /notice %}}
+
+After building the image, switch to Root User to push the image to ECR.
+
+```bash
+docker push "image-uri":latest
+```
+
+![3.1.3](/images/3-prepare-for-deployment/3.1.3.png)
+
+Now, go back to the ECR Console
+
+- Go to the frontend repository (Named `fcjresbar-fe`)
+
+![3.1.4](/images/3-prepare-for-deployment/3.1.4.png)
+
+Ok, now we’ve successfully pushed the new image to ECR. In this tutorial, I’ll use `latest` to tag the Docker image, but you should ideally version each tag you change to manage versions more effectively. You can learn more here: [https://semver.org/](https://semver.org/)

content/3-prepare-for-deployment/3.2-push-image-to-dockerhub/_index.md

@@ -5,3 +5,32 @@ weight = 2
 chapter = false
 pre = "<b>3.2. </b>"
 +++
+
+#### Push the Image to Dockerhub
+
+In the previous step, we successfully pushed the image to ECR, and in this step, we will push the image to Dockerhub.
+
+- Log out (remove ECR credentials) from Docker using `docker logout`.
+- Then log in with `docker login -u "your-docker-username"`.
+
+![3.2.1](/images/3-prepare-for-deployment/3.2.1.png)
+
+List the existing images, and now we won’t rebuild the image but just add another tag for Dockerhub. After tagging, list the images again, and you will see the new tag has been added.
+
+![3.2.2](/images/3-prepare-for-deployment/3.2.2.png)
+
+Now, proceed to push this image to Dockerhub.
+
+![3.2.3](/images/3-prepare-for-deployment/3.2.3.png)
+
+And check the result.
+
+![3.2.4](/images/3-prepare-for-deployment/3.2.4.png)
+
+So, we have successfully pushed the image to both ECR and Dockerhub. Now you can use the image from any registry to deploy the Frontend Service.
+
+
+
+
+
+

content/3-prepare-for-deployment/_index.md

@@ -5,3 +5,12 @@ weight = 3
 chapter = false
 pre = "<b>3. </b>"
 +++
+
+To deploy a Node.js and Nginx with React application, we need to prepare Docker images for both Node.js and Nginx React. The Docker image functions like built and packaged code (in the past, the code would be built and then compressed).
+
+At the end of the previous lesson, we built images for both Node.js and Nginx React, and the Node.js Docker image was able to work properly with ECS Service. However, the Nginx React image needs some adjustments. So in this section, we will rebuild the image for Nginx React.
+
+#### Contents
+
+1. [Push Docker image to ECR](3.1-push-image-to-ecr/)
+2. [Push Docker image to Dockerhub](3.2-push-image-to-dockerhub/)

content/3-prepare-for-deployment/_index.vi.md

@@ -13,4 +13,4 @@ pre = "<b>3. </b>"
 #### Nội dung
 
 1. [Tải Docker image lên ECR](3.1-push-image-to-ecr/)
-2. [Tải Docker image lên Dockerhub](3.1-push-image-to-ecr/)
+2. [Tải Docker image lên Dockerhub](3.2-push-image-to-dockerhub/)

content/4-register-namespace-in-cloudmap/_index.md

@@ -5,3 +5,79 @@ weight = 4
 chapter = false
 pre = "<b>4. </b>"
 +++
+
+The next steps will involve configuring the Frontend and Backend in separate ECS Services. However, we don’t have a way for the services to communicate with each other (even though they are in the same cluster). Therefore, in this section, we will configure Namespace and Service in Cloud Map.
+
+Once we have the Service Discovery Name, the Frontend Service can use that "name" to resolve the IP address of the Backend Service, allowing the Frontend Service to communicate with the Backend Service.
+
+#### Create a namespace
+
+Search for `Cloud Map` on the AWS console
+
+- Select Cloud Map
+
+![4.1](/images/4-register-namespace-in-cloudmap/4.1.png)
+
+In the namespace section
+
+- Click **Create namespace**
+
+![4.2](/images/4-register-namespace-in-cloudmap/4.2.png)
+
+In the create namespace interface
+
+- Name: `fcjresbar.internal`
+- Description: `Use for internal API Calls and DNS`
+- Instance discovery: Select **API calls and DNS queries in VPCs**.
+
+![4.3](/images/4-register-namespace-in-cloudmap/4.3.png)
+
+Next
+
+- Select the VPC that we created earlier
+- TTL (Time to live): 20s
+- Click **Create namespace**
+
+![4.4](/images/4-register-namespace-in-cloudmap/4.4.png)
+
+Our namespace has been successfully created
+
+![4.5](/images/4-register-namespace-in-cloudmap/4.5.png)
+
+#### Create a service in the namespace
+
+Now, we will create a service in the newly created namespace
+
+- Go back to the details of the newly created namespace
+- Scroll down to the bottom
+- Click **Create service**
+
+![4.6](/images/4-register-namespace-in-cloudmap/4.6.png)
+
+Fill in the following information to create the service
+
+- Name: `backend`
+- Description: `Backend Service Discovery Name`
+- Discoverable by: Select **API and DNS**
+
+![4.7](/images/4-register-namespace-in-cloudmap/4.7.png)
+
+{{% notice note %}}
+With the service name backend, the full Service Discovery name for the Backend will be `backend.fcjresbar.internal`. Make sure to copy this name as we will need it when configuring the Task Definition for the Frontend service.
+
+{{% /notice %}}
+
+Next, in the DNS Configuration section
+
+- Routing policy: Select **WEIGHTED**
+- Record type: **A** (for IPv4)
+- TTL: 300
+- Health check option: Select **No health check**
+
+![4.8](/images/4-register-namespace-in-cloudmap/4.8.png)
+
+![4.9](/images/4-register-namespace-in-cloudmap/4.9.png)
+
+Now, we need to wait for a while until the service is fully created.
+
+![4.10](/images/4-register-namespace-in-cloudmap/4.10.png)

content/5-create-ecs-cluster/_index.md

@@ -6,4 +6,42 @@ chapter = false
 pre = "<b>5. </b>"
 +++
 
-#### Creating an Admininistrator Group
+#### Create ECS Cluster
+
+In the search bar
+
+- Type `ECS`
+- Select **Elastic Container Service**
+
+![5.1](/images/5-create-ecs-cluster/5.1.png)
+
+On the main ECS Console interface
+
+- Select **Cluster**
+- Click **Create cluster** to create a new cluster
+
+![5.2](/images/5-create-ecs-cluster/5.2.png)
+
+On the Create Cluster page
+
+- Name: Enter `FCJ-Lab-cluster`
+- Namespace: It will be automatically created
+- Infrastructure: Select **AWS Fargate**.
+
+![5.3](/images/5-create-ecs-cluster/5.3.png)
+
+In the Monitoring section
+
+- Select **Use Container Insight**
+- Click **Create** to create the cluster
+
+![5.4](/images/5-create-ecs-cluster/5.4.png)
+
+{{% notice note %}}
+We enable Container Insight because in a later workshop, we will take a closer look at the ECS Services and the Containers inside a Cluster.
+{{% /notice %}}
+
+Result
+
+![5.5](/images/5-create-ecs-cluster/5.5.png)
+

content/6-create-task-definition/6.1-backend-task-definition/_index.md

@@ -5,3 +5,73 @@ weight = 1
 chapter = false
 pre = "<b>6.1. </b>"
 +++
+
+Note: As mentioned earlier, you can use images from either ECR or Dockerhub in this section.
+
+![6.1.1](/images/6-create-task-definition/6.1.1.png)
+
+![6.1.2](/images/6-create-task-definition/6.1.2.png)
+
+#### Configuring Task Definition for Backend Service
+
+Still within the ECS Console interface:
+
+- Select **Task definitions**
+- Click **Create new task definition**.
+
+![6.1.3](/images/6-create-task-definition/6.1.3.png)
+
+Enter the following information for the task definition:
+
+- Family name: enter `fcjresbar-task-be`
+- In the **Infrastructure requirements** section:
+  - Launch type: choose **AWS Fargate**
+  - OS, Architecture, Network: choose **Linux/x86_64**, and the default network will be **awsvcp** when AWS Fargate is selected.
+
+![6.1.4](/images/6-create-task-definition/6.1.4.png)
+
+Next information:
+
+- CPU: **4 vCPU**
+- Memory: **8 GB**
+- Task role and Task execution role as default.
+
+![6.1.5](/images/6-create-task-definition/6.1.5.png)
+
+In the container definition section, fill in the following details:
+
+- Name: `backend`
+- Image URI: the URI of the backend image from either ECR or Dockerhub; here, we will use ECR.
+- Container port: `5000`; protocol: **TCP**; App protocol: **HTTP**
+- Resource allocation limits:
+  - CPU: `2`
+  - Memory hard limit: `4`
+  - Memory soft limit: `3`
+
+{{% notice note %}}
+When configuring containers in AWS Fargate, you don’t need to worry about the host port, as the host port will default to the container's port. 
+{{% /notice %}}
+
+![6.1.6](/images/6-create-task-definition/6.1.6.png)
+
+Next, add environment variables, which are important. Without this configuration, the NodeJS server inside won’t run. These include:
+
+- `MYSQL_USER` = `admin`
+- `MYSQL_PASSWORD` = `letmein12345`
+- `MYSQL_DATABASE` = `fcjresbar`
+- `DB_HOST` = "your rds endpoint"
+- `DB_DIALECT` = `mysql`
+- `PORT` = `5000`
+- `JWT_SECRET` = `0bac010eca699c25c8f62ba86e319c2305beb94641b859c32518cb854addb5f4`
+
+![6.1.7](/images/6-create-task-definition/6.1.7.png)
+
+Keep the default configurations.
+
+![6.1.8](/images/6-create-task-definition/6.1.8.png)
+
+Finally, click **Create** to create the task definition.
+
+![6.1.9](/images/6-create-task-definition/6.1.9.png)
+
+![6.1.10](/images/6-create-task-definition/6.1.10.png)

content/6-create-task-definition/6.2-frontend-task-definition/_index.md

@@ -5,3 +5,60 @@ weight = 1
 chapter = false
 pre = "<b>6.2. </b>"
 +++
+
+Similarly, now we will create the task definition for the frontend.
+
+#### Configuring Task Definition for Frontend Service
+
+Go back to the Task definition screen:
+
+- Click on **Create new task definition**
+- Select **Create new task definition**
+
+![6.2.1](/images/6-create-task-definition/6.2.1.png)
+
+Continue filling in the basic information:
+
+- Family name: enter `fcjresbar-task-fe`
+- In the **Infrastructure requirements**
+  - Launch type: choose **AWS Fargate**
+  - OS, Architecture, Network: choose **Linux/x86_64**, and the default network will be **awsvcp** when AWS Fargate is selected.
+
+![6.2.2](/images/6-create-task-definition/6.2.2.png)
+
+Next information:
+
+- CPU: **2 vCPU**
+- Memory: **6 GB**
+- Task role and Task execution role as default.
+
+![6.2.3](/images/6-create-task-definition/6.2.3.png)
+
+In the container definition section, fill in the following details:
+
+- Name: `frontend`
+- Image URI: the URI of the frontend image from either ECR or Dockerhub; here, we will use ECR.
+- Container port: `80`; protocol: **TCP**; App protocol: **HTTP**
+- Resource allocation limits:
+  - CPU: `1`
+  - Memory hard limit: `3`
+  - Memory soft limit: `2`
+
+![6.2.4](/images/6-create-task-definition/6.2.4.png)
+
+Next, add the environment variables, which include:
+
+- `BACKEND_HOST` = `backend.fcjresbar.internal`
+- `BACKEND_PORT` = `5000`
+
+![6.2.5](/images/6-create-task-definition/6.2.5.png)
+
+Keep the default configurations.
+
+![6.2.6](/images/6-create-task-definition/6.2.6.png)
+
+Finally, click **Create** to create the task definition.
+
+![6.2.7](/images/6-create-task-definition/6.2.7.png)
+
+![6.2.8](/images/6-create-task-definition/6.2.8.png)

content/6-create-task-definition/_index.md

@@ -6,4 +6,10 @@ chapter = false
 pre = "<b>6. </b>"
 +++
 
-#### Creating an Admininistrator Group
+In order for ECS Service to create and manage containers within the Cluster, we first need to create a Task Definition. In this section, we will create task definitions for both the Frontend and Backend.
+
+#### Contents
+
+1. [Create task definition for backend](6.1-backend-task-definition/)
+2. [Create task definition for frontend](6.2-frontend-task-definition/)
+