AWS CloudWatch - VSCode Extension

Access and review your AWS CloudWatch logs directly from VSCode - faster, easier, and more convenient than the AWS console.

Screenshot

🚀 Overview

AWS CloudWatch extension brings powerful log viewing capabilities directly into Visual Studio Code, eliminating the need to switch between your IDE and the AWS console. View, search, and filter your CloudWatch logs with a streamlined interface designed for developers.

✨ Key Features

🌍 Multi-Region Support - Add log groups and streams from different AWS regions
⚡ Lightning Fast - Loads logs faster than the AWS console
🔍 Advanced Filtering - Search, filter, hide, and date/time range filtering
⭐ Favorites - Mark frequently accessed logs for quick access
📦 Centralized View - Manage all your logs in one place
🎯 Real-time Updates - Auto-refresh with configurable intervals
💾 Export Logs - Save logs to local files for offline analysis
🎨 Syntax Highlighting - Color-coded error and exception messages
📝 Text Wrapping - Toggle text wrapping for better readability
⏱️ Time-based Filtering - Filter logs by date and hour

💿 Installation

From VSCode Marketplace

Open VSCode
Press Ctrl+P (Windows/Linux) or Cmd+P (Mac)
Type: ext install NecatiARSLAN.aws-cloudwatch-vscode-extension
Press Enter

From GitHub

# Clone the repository
git clone https://github.com/necatiarslan/aws-cloudwatch.git

# Install dependencies
cd aws-cloudwatch
npm install

# Compile the extension
npm run compile

# Package the extension
vsce package

🔑 AWS Credentials Setup

Prerequisites

This extension requires AWS credentials to be configured on your system. You have several options:

Option 1: AWS CLI Configuration (Recommended)

# Install AWS CLI
# https://docs.aws.amazon.com/cli/latest/userguide/getting-started-install.html

# Configure credentials
aws configure

You'll be prompted for:

AWS Access Key ID: Your access key
AWS Secret Access Key: Your secret key
Default region name: e.g., us-east-1
Default output format: json

Option 2: Manual Configuration

Create or edit ~/.aws/credentials:

[default]
aws_access_key_id = YOUR_ACCESS_KEY_ID
aws_secret_access_key = YOUR_SECRET_ACCESS_KEY

[profile-name]
aws_access_key_id = ANOTHER_ACCESS_KEY_ID
aws_secret_access_key = ANOTHER_SECRET_ACCESS_KEY

Create or edit ~/.aws/config:

[default]
region = us-east-1

[profile profile-name]
region = eu-west-1

Option 3: Environment Variables

export AWS_ACCESS_KEY_ID="your-access-key-id"
export AWS_SECRET_ACCESS_KEY="your-secret-access-key"
export AWS_DEFAULT_REGION="us-east-1"

📚 Additional Resources

Required IAM Permissions

Your AWS user/role needs the following permissions:

{
  "Version": "2012-10-17",
  "Statement": [
    {
      "Effect": "Allow",
      "Action": [
        "logs:DescribeLogGroups",
        "logs:DescribeLogStreams",
        "logs:GetLogEvents"
      ],
      "Resource": "*"
    }
  ]
}

🎯 Getting Started

Quick Start Guide

Open the Extension
- Click the AWS CloudWatch icon in the Activity Bar (left sidebar)
Select AWS Profile (if you have multiple profiles)
- Click the account icon in the toolbar
- Select your AWS profile from the dropdown
Add a Log Group
- Click the folder icon (📁) in the toolbar
- Enter the AWS region (e.g., us-east-1)
- Select log group(s) from the list
Add Log Streams
- Right-click on a log group
- Select "Add Log Stream By Name" or "Add All Log Streams"
- For time-based: "Add Log Streams By Date"
View Logs
- Click on any log stream
- Click the preview icon (👁️) to open the log viewer

🎨 Features

1. Multi-Region Support

Manage log groups from multiple AWS regions in a single interface.

📁 us-east-1
  └── 📄 /aws/lambda/my-function
      └── 📜 2024/01/15/[$LATEST]abc123
📁 eu-west-1
  └── 📄 /aws/ecs/my-service
      └── 📜 2024/01/15/task-123

2. Advanced Filtering

Search - Find specific text in logs

Search: "error" → highlights all instances

Filter - Show only matching logs

Filter: "status=200" → displays only matching entries

Hide - Exclude unwanted logs

Hide: "health-check" → hides all health check logs

Date/Time Filter - Filter by date and hour

☑️ Date/Time Filter | From: [2024-01-15] Hour: [14 ▼]
Shows logs from 2024-01-15 14:00 onwards

3. Text Wrapping

Toggle between wrapped and unwrapped text for better readability:

☑️ Wrapped - Long messages break across multiple lines
☐ Unwrapped - Messages display on single line with horizontal scroll

4. Real-time Updates

Auto-refresh with configured intervals
Pause/Resume button to control updates
Visual indicator when loading new logs

5. Export Logs

Save logs to local files:

Click "Export Logs" button
Logs saved to temporary file
Automatically opened in new VSCode tab

6. Favorites

Mark frequently accessed log groups/streams:

Right-click → "Fav" to add to favorites
Filter by favorites using the bookmark icon (🔖)
Quick access to important logs

7. Syntax Highlighting

Automatically highlights:

🔴 Errors and exceptions in red
🟡 Search matches in yellow
Clean, readable log display

📖 Usage

Icon	Action	Description
🔖	Show Only Favorite	Filter to show only favorited items
🔍	Filter	Apply global filter to log groups
📁	Add Log Group (From List)	Browse and add log groups
📂	Add Log Group (By Name)	Search and add specific log groups
👤	Select AWS Profile	Switch between AWS profiles
🔄	Refresh	Reload the tree view

Log Group:

Add to Favorites / Remove from Favorites
Remove Log Group
Add Log Stream By Name
Add All Log Streams
Add Log Streams By Date
Remove All Log Streams

Log Stream:

Add to Favorites / Remove from Favorites
Show Logs (opens viewer)
Remove Log Stream

Log Viewer Controls

First Row:

[Pause/Resume] - Control auto-refresh
[Refresh] - Manually reload logs
[Export Logs] - Save to file
[Search] - Find text in logs
[Filter] - Show only matching logs
[Hide] - Exclude matching logs
[☑️ Wrap] - Toggle text wrapping

Second Row:

[☐ Date/Time Filter] - Enable time-based filtering
[Date Input] - Select start date
[Hour Dropdown] - Select start hour (0-23)

Keyboard Shortcuts

Enter in Search/Filter/Hide fields - Apply filter without refresh

⚙️ Configuration

Proxy Settings

If you're behind a corporate proxy:

Open VSCode Settings (Ctrl+, or Cmd+,)
Search for "proxy"
Set http.proxy to your proxy URL:
```
http://proxy.company.com:8080
```

Custom AWS Endpoint

For LocalStack or custom AWS endpoints:

Right-click in the tree view
Select "Update Aws EndPoint"
Enter your custom endpoint URL
Leave empty to return to AWS default

🔧 Troubleshooting

Common Issues

"Credentials Not Found" Error

Solution:

Verify AWS credentials are configured:
```
cat ~/.aws/credentials
```
Check environment variables:
```
echo $AWS_ACCESS_KEY_ID
```
Run aws configure to reconfigure

"Access Denied" Error

Solution:

Verify your IAM user/role has CloudWatch Logs permissions
Check the Required IAM Permissions section

"Network Error" / Connection Timeout

Solution:

Check your internet connection
Configure proxy settings if behind corporate firewall
Verify AWS service endpoints are accessible

Extension Not Loading

Solution:

Check OUTPUT panel → "AWS CloudWatch-Log"
Reload VSCode window (Ctrl+R or Cmd+R)
Reinstall the extension

Logs Not Appearing

Solution:

Click Refresh button
Verify log stream has recent logs
Check date/time filter settings
Review filter/hide/search settings

🗺️ Roadmap

Planned Features

[ ] Log Stream Filter Groups
[ ] Log Stream Name Filter
[ ] Enhanced log viewing for long messages
[ ] JSON log formatting and navigation
[ ] Custom log parsing rules
[ ] Log analytics and statistics
[ ] CloudWatch Insights integration
[ ] Multi-log stream comparison
[ ] Markdown export support

Feature Requests

Have an idea? Open an issue with the enhancement label.

🤝 Contributing

Contributions are welcome! Here's how you can help:

Reporting Bugs

Check existing issues
Create a new issue
Include:
- Extension version
- VSCode version
- Steps to reproduce
- Expected vs actual behavior
- Screenshots if applicable

Contributing Code

Fork the repository
Create a feature branch: git checkout -b feature/amazing-feature
Make your changes
Test thoroughly
Commit: git commit -m 'Add amazing feature'
Push: git push origin feature/amazing-feature
Open a Pull Request

Development Setup

# Clone your fork
git clone https://github.com/YOUR-USERNAME/aws-cloudwatch.git

# Install dependencies
npm install

# Run in development mode
# Press F5 in VSCode to launch Extension Development Host

# Compile
npm run compile

# Run tests
npm test

# Lint code
npm run lint

💬 Support

Get Help

Stay Connected

Show Your Support

If you find this extension helpful:

📄 License

This project is licensed under the Apache License 2.0 - see the LICENSE file for details.

Copyright 2024 Necati ARSLAN

Licensed under the Apache License, Version 2.0 (the "License");
you may not use this file except in compliance with the License.
You may obtain a copy of the License at

    http://www.apache.org/licenses/LICENSE-2.0

Unless required by applicable law or agreed to in writing, software
distributed under the License is distributed on an "AS IS" BASIS,
WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
See the License for the specific language governing permissions and
limitations under the License.

🙏 Acknowledgments

Special thanks to all contributors who have helped improve this extension.

Built with ❤️ by Necati ARSLAN

📧 Contact

Necati ARSLAN

📧 Email: necatia@gmail.com
💼 LinkedIn: necati-arslan
🐙 GitHub: @necatiarslan

⬆ Back to Top

Made with ❤️ for AWS developers

Aws CloudWatch

Necati ARSLAN

AWS CloudWatch - VSCode Extension

🚀 Overview

✨ Key Features

📋 Table of Contents

💿 Installation

From VSCode Marketplace

From GitHub

🔑 AWS Credentials Setup

Prerequisites

Option 1: AWS CLI Configuration (Recommended)

Option 2: Manual Configuration

Option 3: Environment Variables

📚 Additional Resources

Required IAM Permissions

🎯 Getting Started

Quick Start Guide

🎨 Features

1. Multi-Region Support

2. Advanced Filtering

3. Text Wrapping

4. Real-time Updates

5. Export Logs

6. Favorites

7. Syntax Highlighting

📖 Usage

Toolbar Actions

Context Menu Actions

Log Viewer Controls

Keyboard Shortcuts

⚙️ Configuration

Proxy Settings

Custom AWS Endpoint

🔧 Troubleshooting

Common Issues

"Credentials Not Found" Error

"Access Denied" Error

"Network Error" / Connection Timeout

Extension Not Loading

Logs Not Appearing

🗺️ Roadmap

Planned Features

Feature Requests

🤝 Contributing

Reporting Bugs

Contributing Code

Development Setup

💬 Support

Get Help

Stay Connected

Show Your Support

📄 License

🙏 Acknowledgments

📧 Contact