<?xml version="1.0" encoding="UTF-8"?>
<rss version="2.0" xmlns:atom="http://www.w3.org/2005/Atom" xmlns:dc="http://purl.org/dc/elements/1.1/">
  <channel>
    <title>DEV Community: Wing Hoe Yee</title>
    <description>The latest articles on DEV Community by Wing Hoe Yee (@icemanywh1992).</description>
    <link>https://dev.to/icemanywh1992</link>
    <image>
      <url>https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F4237539%2F2c1f19b3-142b-4655-a735-5c81d040ec12.jpg</url>
      <title>DEV Community: Wing Hoe Yee</title>
      <link>https://dev.to/icemanywh1992</link>
    </image>
    <atom:link rel="self" type="application/rss+xml" href="https://dev.to/feed/icemanywh1992"/>
    <language>en</language>
    <item>
      <title>Monitoring a Dockerized React Application on AWS EC2 with Amazon CloudWatch</title>
      <dc:creator>Wing Hoe Yee</dc:creator>
      <pubDate>Tue, 10 Nov 2026 17:03:59 +0000</pubDate>
      <link>https://dev.to/icemanywh1992/monitoring-a-dockerized-react-application-on-aws-ec2-with-amazon-cloudwatch-56pn</link>
      <guid>https://dev.to/icemanywh1992/monitoring-a-dockerized-react-application-on-aws-ec2-with-amazon-cloudwatch-56pn</guid>
      <description>&lt;p&gt;&lt;em&gt;How I used AWS CloudWatch to monitor infrastructure performance, visualize resource usage, and configure a CPU utilization alarm for my cloud-hosted React application.&lt;/em&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Introduction: Why Monitoring Matters
&lt;/h2&gt;

&lt;p&gt;Deploying a web application to the cloud is exciting, but getting the application running is only the beginning. Once an application becomes publicly accessible, it is important to understand how the underlying infrastructure performs and how to detect problems before they affect users.&lt;/p&gt;

&lt;p&gt;For this project, I used &lt;strong&gt;Amazon CloudWatch&lt;/strong&gt; to monitor a React web application that I previously deployed on an Amazon EC2 instance running Ubuntu Linux and Docker.&lt;/p&gt;

&lt;p&gt;My application was accessible through the public IP address:&lt;/p&gt;

&lt;p&gt;&lt;code&gt;http://44.249.176.43:3000&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;The goal was to monitor CPU utilization, network traffic, and instance health while creating a dashboard and an alarm that could help identify potential performance problems.&lt;/p&gt;

&lt;p&gt;This project helped me understand how cloud monitoring supports application reliability, troubleshooting, and operational security.&lt;/p&gt;

&lt;h2&gt;
  
  
  My Application Environment
&lt;/h2&gt;

&lt;p&gt;Before implementing monitoring, I already had a React application deployed inside a Docker container on an AWS EC2 instance.&lt;/p&gt;

&lt;p&gt;The environment consisted of:&lt;/p&gt;

&lt;ul&gt;
&lt;li&gt;
&lt;strong&gt;Amazon EC2:&lt;/strong&gt; Hosted the application infrastructure.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Ubuntu Linux:&lt;/strong&gt; Served as the instance operating system.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Docker:&lt;/strong&gt; Containerized the React application.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;React:&lt;/strong&gt; Provided the web application interface.&lt;/li&gt;
&lt;li&gt;
&lt;strong&gt;Amazon CloudWatch:&lt;/strong&gt; Collected and displayed infrastructure monitoring metrics.&lt;/li&gt;
&lt;/ul&gt;

&lt;p&gt;Users accessed the application over the internet through port 3000.&lt;/p&gt;

&lt;p&gt;Although the application was running, I wanted better visibility into the infrastructure supporting it.&lt;/p&gt;

&lt;h2&gt;
  
  
  Why I Chose Amazon CloudWatch
&lt;/h2&gt;

&lt;p&gt;I selected Amazon CloudWatch because my application was already running on AWS.&lt;/p&gt;

&lt;p&gt;CloudWatch integrates directly with Amazon EC2, making it possible to monitor infrastructure without installing and managing an entirely separate monitoring platform.&lt;/p&gt;

&lt;p&gt;For this project, I focused on four types of metrics.&lt;/p&gt;

&lt;div class="table-wrapper-paragraph"&gt;&lt;table&gt;
&lt;thead&gt;
&lt;tr&gt;
&lt;th&gt;Metric&lt;/th&gt;
&lt;th&gt;What it tells me&lt;/th&gt;
&lt;/tr&gt;
&lt;/thead&gt;
&lt;tbody&gt;
&lt;tr&gt;
&lt;td&gt;CPUUtilization&lt;/td&gt;
&lt;td&gt;How much EC2 CPU capacity is being used&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;NetworkIn&lt;/td&gt;
&lt;td&gt;How much network data the instance receives&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;NetworkOut&lt;/td&gt;
&lt;td&gt;How much network data the instance sends&lt;/td&gt;
&lt;/tr&gt;
&lt;tr&gt;
&lt;td&gt;StatusCheckFailed&lt;/td&gt;
&lt;td&gt;Whether EC2 instance or system health checks have failed&lt;/td&gt;
&lt;/tr&gt;
&lt;/tbody&gt;
&lt;/table&gt;&lt;/div&gt;

&lt;p&gt;These metrics provide useful information about the health and performance of the server hosting my application.&lt;/p&gt;

&lt;p&gt;CloudWatch also supports dashboards and alarms, which make it easier to visualize performance and identify unusual conditions.&lt;/p&gt;

&lt;h3&gt;
  
  
  Why not Prometheus or Grafana?
&lt;/h3&gt;

&lt;p&gt;Prometheus and Grafana are powerful tools, especially for environments requiring detailed application metrics and advanced visualization.&lt;/p&gt;

&lt;p&gt;However, CloudWatch was a better fit for this project because it required less setup and integrated directly with the EC2 instance.&lt;/p&gt;

&lt;p&gt;One limitation is that standard EC2 metrics do not automatically reveal everything happening inside Docker or React. More detailed container and application monitoring would require additional instrumentation or agents.&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 1: Accessing EC2 Metrics in CloudWatch
&lt;/h2&gt;

&lt;p&gt;The first step was to open the AWS Management Console and navigate to Amazon CloudWatch.&lt;/p&gt;

&lt;p&gt;From there, I selected:&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;CloudWatch → Metrics → EC2 → Per-Instance Metrics&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;This section displayed monitoring information associated with my EC2 instance.&lt;/p&gt;

&lt;p&gt;I focused on CPU utilization, incoming network traffic, outgoing network traffic, and EC2 status checks.&lt;/p&gt;

&lt;p&gt;These metrics helped me understand how AWS collects performance information from the infrastructure hosting my Dockerized application.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;[Insert screenshot: CloudWatch EC2 metrics showing CPUUtilization, NetworkIn, and NetworkOut]&lt;/strong&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 2: Creating a CloudWatch Dashboard
&lt;/h2&gt;

&lt;p&gt;Next, I created a CloudWatch dashboard named:&lt;/p&gt;

&lt;p&gt;&lt;code&gt;StudentAppDashboard&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;I added widgets for CPU utilization, incoming network traffic, and outgoing network traffic.&lt;/p&gt;

&lt;p&gt;The dashboard provided a centralized view of the EC2 instance's performance.&lt;/p&gt;

&lt;p&gt;Instead of opening individual metric graphs every time I wanted to check the server, I could view multiple measurements in one location.&lt;/p&gt;

&lt;p&gt;This is useful when investigating potential performance problems. For example, a sudden increase in CPU utilization could indicate heavier processing activity, while a change in network traffic could suggest increased application usage.&lt;/p&gt;

&lt;p&gt;However, these infrastructure metrics alone cannot establish exactly how many users visited the React application or whether individual HTTP requests succeeded.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;[Insert screenshot: StudentAppDashboard with CPU and network widgets]&lt;/strong&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 3: Configuring a High CPU Alarm
&lt;/h2&gt;

&lt;p&gt;Monitoring metrics is useful, but checking a dashboard manually all day is not practical.&lt;/p&gt;

&lt;p&gt;To address this, I configured a CloudWatch alarm named:&lt;/p&gt;

&lt;p&gt;&lt;code&gt;HighCPUAlarm&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;The alarm was designed to enter the alarm state when CPU utilization exceeded 80% according to its configured evaluation period.&lt;/p&gt;

&lt;p&gt;This threshold could help identify situations where the EC2 instance is experiencing unusually high CPU demand.&lt;/p&gt;

&lt;p&gt;For example, if the application begins receiving more traffic or another process consumes significant CPU resources, the alarm can indicate that further investigation may be needed.&lt;/p&gt;

&lt;p&gt;CloudWatch alarms can also be connected to notification services such as Amazon SNS. An alarm does not automatically send an email unless an appropriate notification action has been configured.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;[Insert screenshot: HighCPUAlarm configuration and current state]&lt;/strong&gt;&lt;/p&gt;

&lt;h2&gt;
  
  
  Step 4: Verifying the Application and Monitoring
&lt;/h2&gt;

&lt;p&gt;To confirm the application environment, I used the following command on the Ubuntu EC2 instance:&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight shell"&gt;&lt;code&gt;sudo docker ps
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;This command lists running Docker containers, including information such as the container name, image, status, and exposed ports.&lt;/p&gt;

&lt;p&gt;I also accessed the application through its public address:&lt;/p&gt;

&lt;p&gt;&lt;code&gt;http://44.249.176.43:3000&lt;/code&gt;&lt;/p&gt;

&lt;p&gt;I then reviewed the CloudWatch dashboard to inspect the metrics collected for the EC2 instance.&lt;/p&gt;

&lt;p&gt;My original project evidence included the running React application, Docker container status, EC2 monitoring metrics, the CloudWatch dashboard, and the CPU alarm configuration.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;[Insert screenshot: React application running in the browser]&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;[Insert screenshot: Docker container status from sudo docker ps]&lt;/strong&gt;&lt;/p&gt;

&lt;p&gt;Together, these screenshots demonstrate the relationship between the application deployment and its underlying infrastructure monitoring.&lt;/p&gt;

&lt;p&gt;It is important to distinguish monitoring configuration from alarm testing: creating an alarm does not necessarily prove that the threshold was triggered or that a notification was delivered.&lt;/p&gt;

&lt;h2&gt;
  
  
  Security Considerations
&lt;/h2&gt;

&lt;p&gt;Security is an important part of cloud monitoring because the monitoring environment can expose information about infrastructure performance and system behavior.&lt;/p&gt;

&lt;h3&gt;
  
  
  Network security
&lt;/h3&gt;

&lt;p&gt;AWS Security Groups control network traffic to the EC2 instance.&lt;/p&gt;

&lt;p&gt;My application required access to port 3000, while SSH access used port 22.&lt;/p&gt;

&lt;p&gt;For a production environment, SSH should be restricted to authorized sources or replaced with a more controlled management solution. Application traffic should also be protected with HTTPS.&lt;/p&gt;

&lt;h3&gt;
  
  
  Identity and Access Management
&lt;/h3&gt;

&lt;p&gt;CloudWatch permissions are managed through AWS Identity and Access Management (IAM).&lt;/p&gt;

&lt;p&gt;Only authorized users and services should be able to view monitoring data, create alarms, or modify dashboards.&lt;/p&gt;

&lt;p&gt;Following the principle of least privilege reduces the risk of unauthorized changes to monitoring configurations.&lt;/p&gt;

&lt;h3&gt;
  
  
  Sensitive information
&lt;/h3&gt;

&lt;p&gt;Passwords, API keys, authentication tokens, and other sensitive information should never be exposed in application logs, screenshots, or dashboards.&lt;/p&gt;

&lt;p&gt;Monitoring data should be retained and accessed according to organizational security requirements.&lt;/p&gt;

&lt;h2&gt;
  
  
  Application Monitoring Architecture
&lt;/h2&gt;

&lt;p&gt;The following diagram shows how the application and monitoring components fit together.&lt;br&gt;
&lt;/p&gt;

&lt;div class="highlight js-code-highlight"&gt;
&lt;pre class="highlight plaintext"&gt;&lt;code&gt;                  Internet Users
                        |
                        v
                AWS Security Group
                        |
                        v
                Amazon EC2 Instance
                   Ubuntu Linux
                        |
                        v
                  Docker Container
                        |
                        v
                 React Application


               Amazon EC2 Metrics
                        |
                        v
                 Amazon CloudWatch
                    /         \
                   v           v
             Dashboard      CPU Alarm
          StudentAppDashboard HighCPUAlarm
&lt;/code&gt;&lt;/pre&gt;

&lt;/div&gt;



&lt;p&gt;The React application runs inside Docker on EC2. CloudWatch collects EC2 infrastructure metrics independently and makes those measurements available through dashboards and alarms.&lt;/p&gt;

&lt;p&gt;This separation is important because the dashboard measures the hosting infrastructure, not the internal performance of every React component or user interaction.&lt;/p&gt;

&lt;h2&gt;
  
  
  What I Learned
&lt;/h2&gt;

&lt;p&gt;This project taught me that deploying an application and operating an application are two different responsibilities.&lt;/p&gt;

&lt;p&gt;Before implementing CloudWatch, I mainly focused on whether my React application was running and accessible.&lt;/p&gt;

&lt;p&gt;After working with CloudWatch, I began thinking more about the health of the underlying infrastructure.&lt;/p&gt;

&lt;p&gt;Three lessons stood out.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;First, visibility is essential.&lt;/strong&gt; Without monitoring, performance issues may remain unnoticed until users report them.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Second, dashboards make troubleshooting easier.&lt;/strong&gt; Viewing CPU and network metrics together provides useful context when investigating unusual system behavior.&lt;/p&gt;

&lt;p&gt;&lt;strong&gt;Third, alarms support proactive operations.&lt;/strong&gt; A threshold-based alarm can draw attention to a potential issue without requiring an administrator to constantly watch the dashboard.&lt;/p&gt;

&lt;p&gt;I also learned that infrastructure monitoring has limitations. To understand application errors, response times, and container-specific resource consumption, I would need to expand the monitoring solution beyond the standard EC2 metrics.&lt;/p&gt;

&lt;h2&gt;
  
  
  What I Would Improve Next
&lt;/h2&gt;

&lt;p&gt;If I continued developing this project, I would improve the monitoring environment in several ways.&lt;/p&gt;

&lt;p&gt;I would configure Amazon SNS notifications so that alarm state changes could notify an administrator. I would also investigate the CloudWatch Agent and container-level monitoring to collect additional memory, disk, and Docker metrics.&lt;/p&gt;

&lt;p&gt;Another improvement would be adding application-level health checks and request monitoring. These would help determine not only whether the EC2 instance is healthy, but also whether the React application is responding correctly.&lt;/p&gt;

&lt;p&gt;Finally, I would consider automating the monitoring configuration using Infrastructure as Code so dashboards and alarms could be reproduced consistently.&lt;/p&gt;

&lt;h2&gt;
  
  
  Conclusion
&lt;/h2&gt;

&lt;p&gt;Monitoring is an essential part of managing cloud applications.&lt;/p&gt;

&lt;p&gt;Through this project, I used Amazon CloudWatch to observe the EC2 infrastructure supporting my Dockerized React application, organize important metrics into a dashboard, and configure an alarm for high CPU utilization.&lt;/p&gt;

&lt;p&gt;The experience demonstrated how AWS monitoring tools can provide useful operational visibility without requiring a separate monitoring server.&lt;/p&gt;

&lt;p&gt;Most importantly, I learned that keeping an application available requires more than deploying it successfully. It also requires monitoring, troubleshooting, and planning for potential failures.&lt;/p&gt;

&lt;h2&gt;
  
  
  References
&lt;/h2&gt;

&lt;ul&gt;
&lt;li&gt;&lt;a href="https://docs.aws.amazon.com/AmazonCloudWatch/latest/monitoring/WhatIsCloudWatch.html" rel="noopener noreferrer"&gt;Amazon CloudWatch Documentation&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://docs.aws.amazon.com/AWSEC2/latest/UserGuide/using-cloudwatch.html" rel="noopener noreferrer"&gt;Amazon EC2 Monitoring with CloudWatch&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://docs.aws.amazon.com/AmazonCloudWatch/latest/monitoring/AlarmThatSendsEmail.html" rel="noopener noreferrer"&gt;Creating CloudWatch Alarms&lt;/a&gt;&lt;/li&gt;
&lt;li&gt;&lt;a href="https://docs.docker.com/" rel="noopener noreferrer"&gt;Docker Documentation&lt;/a&gt;&lt;/li&gt;
&lt;/ul&gt;




&lt;p&gt;&lt;em&gt;Suggested tags: AWS, CloudWatch, Docker, React, CloudComputing&lt;/em&gt;&lt;/p&gt;

</description>
      <category>aws</category>
      <category>devops</category>
      <category>docker</category>
      <category>monitoring</category>
    </item>
  </channel>
</rss>
