React Apigee X Inspector

A reusable React component to inspect API Products and Developer Apps associated with a specific Apigee X API Proxy.

This client-side tool allows you to quickly query the Apigee Management API directly from your browser without needing a backend.

Features

• Connect to Apigee Management API using Basic Auth or a Bearer Token.
• Fetches all API Products associated with a given API Proxy.
• For each product, finds all associated Developer Apps.
• Displays results in a clear, structured table.
• Built-in loading and error states.
• Styled with Tailwind CSS.

Installation

npm install react-apigee-x-inspector
# or
yarn add react-apigee-x-inspector

Usage

You need to import the main component and its corresponding stylesheet into your React application.

import React from 'react';
import { ApigeeProxyInspector } from 'react-apigee-x-inspector';
import 'react-apigee-x-inspector/styles.css';

function MyPage() {
  return (
    <div className="container mx-auto p-8">
      <h1 className="text-2xl font-bold mb-4">My Apigee Inspector</h1>
      <ApigeeProxyInspector />
    </div>
  );
}

export default MyPage;

The component is self-contained and handles all its own state and API calls.

Security Note

All API calls are made directly from the user's browser to the Apigee API endpoints. Credentials are used for the Authorization header and are never stored or sent to any other server.

License

MIT