AWS Services Catalog
Learn to build a customizable React app that organizes AWS services by category with search functionality, making service discovery faster for your team.
Anonymous User
Amazon Employee
Published May 7, 2025
As AWS continues to expand its service offerings, keeping track of all available services and their use cases becomes increasingly challenging. In this article, I'll walk you through how I built an interactive AWS Services Catalog web application that helps developers and architects quickly find and understand AWS services based on categories and search criteria. This project stemmed from my own need to have a centralized, searchable reference for AWS services that I could customize to my team's specific requirements.
Working with AWS often means navigating through hundreds of services across multiple domains. The AWS Console provides categorization, but I wanted something more:
• A lightweight, standalone application that works offline
• Custom categorization based on my team's common use patterns
• The ability to add our own notes and use cases to services
• A simple, responsive interface that works on all devices
The AWS Services Catalog is built using React and Bootstrap, making it lightweight and responsive. The application organizes AWS
services by category, provides search functionality, and allows filtering by service attributes.
- Categorized Service Browsing: Services organized into logical categories like Compute, Storage, Database, etc.
- Powerful Search: Find services by name, description, or use cases
- Category Filtering: Quickly narrow down services by their primary function
- Responsive Design: Works seamlessly across desktop, tablet, and mobile devices
- Extensible Data Model: Easily add new services or categories as AWS evolves
The application follows a standard React project structure:
The heart of the application is the awsServices.js file, which contains a structured representation of AWS services. Here's a simplified example of how services are defined:
This structure makes it easy to add new services or update existing ones as AWS evolves.
The search functionality is implemented using JavaScript's filter method, which allows users to find services based on multiple criteria:
This approach provides a responsive search experience without requiring a backend server.
Want to create your own version? Follow these steps:
• Node.js and npm installed on your machine
• Basic familiarity with React (though the code is straightforward)
The application will open in your browser at http://localhost:3000.
The real power of this application comes from customization. Open src/data/awsServices.js and modify the services list to include the services most relevant to your team. You can add your own descriptions, use cases, and even internal documentation links.
For example, to add a new service:
Once customized, you can build the application for production:
This creates a build directory with optimized files that can be deployed to any static hosting service like Amazon S3 with CloudFront, GitHub Pages, or Netlify.
You might want to organize services differently than the default AWS categories. This can be done by:
1. Adding new categories to the categories array in CategoryFilter.js
2. Assigning these categories to services in awsServices.js
A valuable extension would be adding detailed pages for each service:
Another useful feature would be service comparison tables for similar services:
Building this catalog taught me several valuable lessons:
- Data Structure Matters: Spending time on a clean, extensible data structure paid off when adding new services
- React's Component Model Shines: Breaking the UI into small, focused components made development and maintenance easier
- Client-Side Search is Powerful: For moderate-sized datasets, client-side filtering provides excellent performance without server dependencies
- Customization is Key: The most valuable aspect is the ability to add team-specific knowledge to the service descriptions
The AWS Services Catalog project demonstrates how a relatively simple application can significantly improve productivity when working with AWS. By providing quick access to service information in a customizable format, teams can make better architectural decisions and discover services that might otherwise be overlooked.
I encourage you to fork the repository, customize it for your team's needs, and contribute improvements back to the community. As AWS
continues to innovate and release new services, having a personalized catalog becomes increasingly valuable.
Have you built similar tools to help navigate the AWS ecosystem? What features would you add to this catalog? I'd love to hear your thoughts and suggestions in the comments below.
Any opinions in this post are those of the individual author and may not reflect the opinions of AWS.