A comprehensive web application for monitoring AWS resource usage and costs. This full-stack solution provides real-time insights into your AWS infrastructure with an intuitive dashboard interface.
- Cost Analysis: Monthly cost tracking using AWS Cost Explorer
- EC2 Instances: Monitor running instances, types, and status
- RDS Databases: Track database instances and configurations
- S3 Storage: Bucket analysis and storage metrics
- Lambda Functions: Function monitoring and execution stats
- Load Balancers: ELB/ALB monitoring and health checks
- EBS Volumes: Storage volume tracking and utilization
- Elastic IPs: IP address allocation and usage
- Secure AWS credential handling
- Authentication-based access control
- No credential storage (credentials used only for session)
- AWS CLI integration for secure configuration
- Modern React-based dashboard
- Real-time data updates
- Service-specific detail views
- Cost visualization with charts
- Responsive design for all devices
- Location:
AWSUsageScriptUI/ - Port: 3000
- Framework: React 19.1.0 with React Router
- Features: Component-based architecture, API integration, responsive UI
- Location:
AWSUsageScript/ - Port: 8000
- Framework: FastAPI with uvicorn
- Features: RESTful API, AWS SDK integration, CORS support
- Python 3.11+ (for backend)
- Node.js 16+ (for frontend)
- AWS CLI (for retrieving real-time resources' information)
- Git (for cloning the repository)
- AWS Account with programmatic access
- IAM user with the following permissions:
AmazonEC2ReadOnlyAccessAmazonRDSReadOnlyAccessAmazonS3ReadOnlyAccessAWSLambdaReadOnlyAccessElasticLoadBalancingReadOnlyAWSCostExplorerServiceReadOnly
# Clone the repository
git clone <repository-url>
cd AWSScript_v1
# Run the automated setup script
winStart.bat# Clone the repository
git clone <repository-url>
cd AWSScript_v1
# Make scripts executable
chmod +x linuxStart.bat
# Run the automated setup script
./linuxStart.bat# Navigate to backend directory
cd AWSUsageScriptBackEnd
# Create virtual environment
python -m venv venv
# Activate virtual environment
# Windows:
venv\Scripts\activate
# Linux/macOS:
source venv/bin/activate
# Install dependencies
pip install "fastapi[standard]"
pip install -r requirements.txt
# Start the backend server
fastapi dev app.py --port 8000# Open new terminal and navigate to frontend directory
cd AWSUsageScriptFrontEnd
# Install dependencies
npm install
# Start the development server
npm start# Navigate to backend directory
cd AWSUsageScriptBackEnd
# Build the Docker image
docker build -t aws-usage-backend .
# Run the container
docker run -p 8000:8000 aws-usage-backendCreate a Dockerfile in AWSUsageScriptUI/ directory:
FROM node:18-alpine
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
EXPOSE 3000
CMD ["npm", "start"]POST /configure- Configure AWS credentialsGET /health- Health check endpoint
GET /region- Get current AWS regionGET /costs- Retrieve monthly cost dataGET /ec2- List EC2 instancesGET /rds- List RDS instancesGET /s3- List S3 buckets and metricsGET /lambda- List Lambda functionsGET /elb- List Load BalancersGET /ebs- List EBS volumesGET /eip- List Elastic IP addresses
- Development:
http://localhost:8000 - Production: Configure according to your deployment
Create a .env file in the backend directory:
AWS_DEFAULT_REGION=ap-southeast-2
CORS_ORIGINS=http://localhost:3000
API_ROOT_PATH=/apiThe application supports multiple authentication methods:
- Web Interface: Enter credentials through the login form
- AWS CLI: Configure using
aws configure - Environment Variables: Set
AWS_ACCESS_KEY_IDandAWS_SECRET_ACCESS_KEY - IAM Roles: For EC2 instances or containerized deployments
cd AWSUsageScriptBackEnd
python -m pytest tests/cd AWSUsageScriptFrontEnd
npm testAWSScript_v1/
βββ AWSUsageScript/ # Backend FastAPI application
β βββ usageScript.py # Main API application
β βββ requirements.txt # Python dependencies
β βββ dockerfile # Docker configuration
β βββ tests/ # Backend tests
β βββ venv/ # Python virtual environment
β
βββ AWSUsageScriptUI/ # Frontend React application
β βββ src/
β β βββ components/ # React components
β β β βββ auth/ # Authentication components
β β β βββ dashboard/ # Dashboard components
β β β βββ login/ # Login components
β β βββ api/ # API service layer
β β βββ constants/ # Application constants
β β βββ App.js # Main application component
β βββ public/ # Static assets
β βββ package.json # Node.js dependencies
β βββ README.md # Frontend documentation
β
βββ winStart.bat # Windows startup script
βββ winStop.bat # Windows shutdown script
βββ linuxStart.bat # Linux/macOS startup script
βββ linuxStop.bat # Linux/macOS shutdown script
βββ README.md # This file
- Credentials: Never commit AWS credentials to version control
- CORS: Configure appropriate CORS origins for production
- HTTPS: Use HTTPS in production environments
- IAM: Follow principle of least privilege for AWS permissions
- Container Security: Run containers with non-root users
For detailed AWS CLI installation instructions for your operating system, please refer to the official AWS documentation: Installing or updating to the latest version of the AWS CLI
Ensure the backend CORS configuration includes your frontend URL:
allow_origins=["http://localhost:3000"]- Backend default port: 8000
- Frontend default port: 3000
- Change ports if conflicts occur
Verify your IAM user has the required read permissions for all AWS services being monitored.
- Fork the repository
- Create a feature branch (
git checkout -b feature/amazing-feature) - Commit your changes (
git commit -m 'Add amazing feature') - Push to the branch (
git push origin feature/amazing-feature) - Open a Pull Request
This project is created by Anthony Tran
Note: This application is for monitoring purposes only. Ensure you have appropriate AWS permissions and follow your organization's security policies.