> ## Documentation Index
> Fetch the complete documentation index at: https://docs.superblocks.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Backend APIs

export const Alert = ({type, title, children}) => {
  const variant = ["info", "success", "warning", "danger", "note"].includes(type) ? type : "note";
  return <div className={`alert alert--${variant}`}>
      <div className="alert-icon" />
      <div className="alert-content">
        {title && <div className="alert-title">{title}</div>}
        <div className="alert-body">{children}</div>
      </div>
    </div>;
};

Superblocks APIs power the backend of your applications. APIs can call [integrations](/integrations/overview) (databases, REST or GraphQL APIs, SaaS platforms) and run custom TypeScript logic.

## API panel

The API panel shows execution details for each API (docked to bottom of the editor by default).

<img src="https://mintcdn.com/superblocks/B6oCkSI8vKs_41uQ/images/building-with-clark/backend_api.png?fit=max&auto=format&n=B6oCkSI8vKs_41uQ&q=85&s=cc77ae98888945e0e955fda32e7e0ba8" alt="Backend API" width="3456" height="1227" data-path="images/building-with-clark/backend_api.png" />

There you can view a list of API calls and drill into individual API calls. Each API call includes a trace view to view timing and inputs / outputs of the API and individual integration calls.

<img src="https://mintcdn.com/superblocks/B6oCkSI8vKs_41uQ/images/building-with-clark/backend_api_integration_call.png?fit=max&auto=format&n=B6oCkSI8vKs_41uQ&q=85&s=b8f3eb8b9aec23c23d6a63a40994f3fe" alt="Backend API integration call" width="2172" height="1080" data-path="images/building-with-clark/backend_api_integration_call.png" />

## API source code

Under the hood, every API is a TypeScript file that uses the Superblocks API SDK to call your integrations. Click **\<> View code** on any API to inspect the source code. For editing this code directly, see [developing apps in code](/building-with-clark/developing-apps-in-code).

<img src="https://mintcdn.com/superblocks/B6oCkSI8vKs_41uQ/images/building-with-clark/backend_api_source_code.png?fit=max&auto=format&n=B6oCkSI8vKs_41uQ&q=85&s=26eb63e3032b119d8b338058b1e3f93e" alt="Backend API source code" style={{width: '80%'}} width="2310" height="1688" data-path="images/building-with-clark/backend_api_source_code.png" />
