Developer Documentation

Integrating
Codebase Architect

Embed interactive, AI-powered codebase architecture maps directly into your own applications, web pages, or internal tools.

The `/embed` Route

Codebase Architect provides a specialized /embed route that renders the graph visualizer without any of the landing page UI elements. It is designed to be responsive and will automatically fit the bounds of its container.

Basic Usage

Simply pass the target GitHub repository URL via the url search parameter.

<iframe 
  src="https://yourdomain.com/embed?url=https://github.com/facebook/react" 
  width="100%" 
  height="600px" 
  frameborder="0" 
  style="border: 1px solid rgba(255,255,255,0.1); border-radius: 12px; overflow: hidden;"
></iframe>

URL Parameters

urlRequired

The full URL to the public GitHub repository you wish to visualize.

Example: https://github.com/vercel/next.js

patOptional

A GitHub Personal Access Token (PAT). Passing this parameter overrides the application's default token and allows the visualizer to fetch data from private repositories the token has access to.

Warning: Do not expose your PAT in an iframe on a public website.

Consuming the Raw API

If you just want the repository tree mapped out in a flat format suitable for D3, React Flow, or other libraries, you can make a `POST` request directly to the internal API route:

fetch("/api/repo", {method: "POST", headers: { "Content-Type": "application/json" }, body: JSON.stringify({url: "https://github.com/owner/repo"})}) .then(res => res.json()) .then(data => console.log(data));