Skip to content

Sharpen website quickstart and developer buyer story #27

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
jacobsd32-cpu merged 1 commit into from
Mar 14, 2026
Merged

Sharpen website quickstart and developer buyer story #27

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
1 commit
Select commit
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
76 changes: 76 additions & 0 deletions index.html
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -126,6 +126,7 @@

/* ── How It Works ── */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:24px;margin-top:40px}
.steps-4{grid-template-columns:repeat(4,1fr)}
.step{background:var(--bg2);border:1px solid var(--border);border-radius:var(--radius);padding:36px 28px;position:relative}
.step-num{font-family:'JetBrains Mono',monospace;font-size:48px;font-weight:700;color:var(--accent);opacity:.15;position:absolute;top:16px;right:20px;line-height:1}
.step-tag{font-family:'JetBrains Mono',monospace;font-size:10px;font-weight:600;color:var(--accent);text-transform:uppercase;letter-spacing:.7px;margin-bottom:12px}
Expand Down Expand Up @@ -527,6 +528,49 @@ <h3>Ask for an evaluator decision</h3>

<div class="divider"></div>

<!-- USE CASES -->
<div class="sec" id="use-cases">
<div class="sec-label">Built For</div>
<div class="sec-title">Use DJD when your product has to trust a wallet</div>
<div class="sec-desc">The first buyers are usually developers shipping payouts, marketplaces, or paid agent workflows. DJD sits between a wallet address and a money-moving decision.</div>
<div class="steps steps-4">
<div class="step">
<div class="step-num">1</div>
<div class="step-tag">Marketplaces</div>
<h3>Agent marketplaces</h3>
<p>Screen providers before listing them, rank counterparties more intelligently, and link buyers to profiles, badges, and directory listings they can inspect.</p>
<div class="step-code">score &middot; profile &middot; certify &middot; directory</div>
<a class="step-link" href="/directory" data-track="path_use_case_marketplaces">See the directory flow</a>
</div>
<div class="step">
<div class="step-num">2</div>
<div class="step-tag">Settlement</div>
<h3>Payout and escrow flows</h3>
<p>Route low-confidence wallets into review, require stronger trust signals before release, and use evaluator decisions when a payout should not be fully automatic.</p>
<div class="step-code">/v1/score/evaluator &middot; /v1/score/risk</div>
<a class="step-link" href="/pricing" data-track="path_use_case_payouts">See settlement products</a>
</div>
<div class="step">
<div class="step-num">3</div>
<div class="step-tag">Paid APIs</div>
<h3>Paid agent tools and x402 services</h3>
<p>Check the payer before expensive work starts, reject unknown or risky wallets, and keep the trust decision inside the route that handles monetized requests.</p>
<div class="step-code">x402-agent-score &middot; /premium/*</div>
<a class="step-link" href="#x402-path" data-track="path_use_case_x402">Open the x402 path</a>
</div>
<div class="step">
<div class="step-num">4</div>
<div class="step-tag">Discovery</div>
<h3>Directories and service networks</h3>
<p>Publish an inspectable trust surface for each wallet so other apps, operators, and marketplaces can discover who is active, certified, and settlement-ready.</p>
<div class="step-code">/agent/{wallet} &middot; /v1/score/erc8004</div>
<a class="step-link" href="/docs" data-track="path_use_case_networks">See the docs</a>
</div>
</div>
</div>

<div class="divider"></div>

<!-- SCORE LOOKUP -->
<div class="sec" id="lookup">
<div class="sec-label sec-center">Try It</div>
Expand Down Expand Up @@ -677,6 +721,38 @@ <h3 style="color:var(--accent)">Integrity Systems</h3>
</div>
</div>

<div class="sec" id="quickstart" style="padding-top:0">
<div class="sec-label">Developer Quickstart</div>
<div class="sec-title">Ship the first version in one afternoon</div>
<div class="sec-desc">You do not need the whole trust stack on day one. Most teams start with a free lookup, add enforcement once the workflow is clear, and only then turn on public trust surfaces.</div>
<div class="steps">
<div class="step">
<div class="step-num">1</div>
<div class="step-tag">Dev</div>
<h3>Screen counterparties during development</h3>
<p>Use the free lookup to see how DJD scores real wallets, pick your first threshold, and understand what a safe or risky counterparty looks like in your product.</p>
<div class="step-code">GET /v1/score/basic?wallet=0x...</div>
<a class="step-link" href="#lookup" data-track="path_quickstart_lookup">Run a free lookup</a>
</div>
<div class="step">
<div class="step-num">2</div>
<div class="step-tag">Prod</div>
<h3>Add production enforcement</h3>
<p>When trust decisions need to happen inside a real workflow, switch to a monthly API key for teams or keep x402 as the native payment path for autonomous agents.</p>
<div class="step-code">Authorization: Bearer djd_sk_... &middot; X-PAYMENT</div>
<a class="step-link" href="/pricing" data-track="path_quickstart_pricing">Choose a billing path</a>
</div>
<div class="step">
<div class="step-num">3</div>
<div class="step-tag">Visible Trust</div>
<h3>Publish trust surfaces customers can inspect</h3>
<p>Once trust has to be visible outside your backend, add profiles, Certify, directory listings, and evaluator decisions so buyers and counterparties can see the same context your code uses.</p>
<div class="step-code">/agent/{wallet} &middot; /certify &middot; /directory</div>
<a class="step-link" href="/docs" data-track="path_quickstart_docs">Open the developer docs</a>
</div>
</div>
</div>

<div class="sec" id="register-path" style="padding-top:0">
<div class="sec-label">Identity</div>
<div class="sec-title">Register your agent in one request</div>
Expand Down
2 changes: 1 addition & 1 deletion openapi.json
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,7 +2,7 @@
"openapi": "3.1.0",
"info": {
"title": "DJD Agent Score API",
"description": "Trust infrastructure for AI agent wallets on Base. DJD helps apps and agent operators score wallets, publish public trust surfaces, and enforce payout or settlement policy before money moves. Paid endpoints support x402 on Base or API-key access for developer teams; free endpoints require no authentication. Interactive docs available at /docs.",
"description": "Trust infrastructure for AI agent wallets on Base. DJD helps apps and agent operators score wallets, publish public trust surfaces, and enforce payout or settlement policy before money moves. Use it for agent marketplaces, payout and escrow flows, paid tools, and automated settlement decisions. Paid endpoints support x402 on Base or API-key access for developer teams; free endpoints require no authentication. Interactive docs available at /docs.",
"version": "2.0.0",
"contact": { "email": "drewjacobs32@gmail.com" },
"license": { "name": "MIT", "url": "https://github.com/jacobsd32-cpu/djdagentscore/blob/main/LICENSE" }
Expand Down
231 changes: 195 additions & 36 deletions src/services/discoveryService.ts
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -26,7 +26,36 @@ const OPENAPI_DOCUMENT = JSON.parse(OPENAPI_SPEC) as {
const SERVICE_TITLE = OPENAPI_DOCUMENT.info?.title ?? 'DJD Agent Score API'
const SERVICE_VERSION = OPENAPI_DOCUMENT.info?.version ?? FALLBACK_SERVICE_VERSION

const SWAGGER_HTML = `<!DOCTYPE html>
export function getPublicDiscoveryCacheControl(): string {
return PUBLIC_CACHE_CONTROL
}

export function getOpenApiSpecView(): string {
const server = OPENAPI_DOCUMENT.servers?.[0]
return JSON.stringify(
{
...OPENAPI_DOCUMENT,
info: {
...OPENAPI_DOCUMENT.info,
contact: {
...OPENAPI_DOCUMENT.info?.contact,
email: getSupportEmail(),
},
},
servers: [
{
description: server?.description ?? 'Production',
url: getPublicBaseUrl(),
},
],
},
null,
2,
)
}

export function getDocsHtmlView(): string {
return `<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
Expand All @@ -46,7 +75,7 @@ const SWAGGER_HTML = `<!DOCTYPE html>
.swagger-ui select { font-weight: bold; }
.header-banner {
background: linear-gradient(135deg, #0f3460, #1a1a2e);
padding: 2rem;
padding: 2.25rem 2rem 2rem;
text-align: center;
border-bottom: 2px solid #e94560;
}
Expand All @@ -57,10 +86,12 @@ const SWAGGER_HTML = `<!DOCTYPE html>
margin: 0 0 0.5rem;
}
.header-banner p {
color: #8888aa;
color: #a6afd0;
font-family: system-ui, sans-serif;
margin: 0;
margin: 0 auto;
font-size: 0.95rem;
line-height: 1.7;
max-width: 760px;
}
.header-banner .badge {
display: inline-block;
Expand All @@ -73,12 +104,171 @@ const SWAGGER_HTML = `<!DOCTYPE html>
margin-left: 0.5rem;
vertical-align: middle;
}
.header-actions {
display: flex;
justify-content: center;
gap: 0.75rem;
flex-wrap: wrap;
margin-top: 1rem;
}
.header-link {
display: inline-flex;
align-items: center;
justify-content: center;
gap: 0.35rem;
padding: 0.7rem 1rem;
border-radius: 999px;
border: 1px solid rgba(129, 140, 248, 0.24);
background: rgba(15, 23, 42, 0.35);
color: #c7d2fe;
font-family: system-ui, sans-serif;
font-size: 0.9rem;
font-weight: 600;
text-decoration: none;
}
.header-link:hover { color: #ffffff; text-decoration: none; border-color: rgba(129, 140, 248, 0.5); }
.docs-shell {
max-width: 1120px;
margin: 0 auto;
padding: 2rem;
}
.docs-section {
margin-bottom: 1.5rem;
}
.docs-title {
color: #f8fafc;
font-family: system-ui, -apple-system, sans-serif;
font-size: 1.15rem;
font-weight: 700;
margin-bottom: 0.85rem;
}
.docs-copy {
color: #94a3b8;
font-family: system-ui, sans-serif;
font-size: 0.95rem;
line-height: 1.7;
margin-bottom: 1rem;
max-width: 860px;
}
.docs-grid {
display: grid;
gap: 1rem;
}
.docs-grid-3 {
grid-template-columns: repeat(3, minmax(0, 1fr));
}
.docs-grid-4 {
grid-template-columns: repeat(4, minmax(0, 1fr));
}
.docs-card {
background: rgba(15, 23, 42, 0.58);
border: 1px solid rgba(129, 140, 248, 0.16);
border-radius: 16px;
padding: 1rem;
min-height: 170px;
}
.docs-kicker {
color: #818cf8;
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
font-size: 0.72rem;
font-weight: 700;
letter-spacing: 0.08em;
text-transform: uppercase;
margin-bottom: 0.65rem;
}
.docs-card h3 {
color: #f8fafc;
font-family: system-ui, sans-serif;
font-size: 1rem;
margin: 0 0 0.55rem;
}
.docs-card p {
color: #94a3b8;
font-family: system-ui, sans-serif;
font-size: 0.92rem;
line-height: 1.65;
margin: 0 0 0.8rem;
}
.docs-code {
display: inline-block;
padding: 0.45rem 0.65rem;
border-radius: 10px;
background: rgba(2, 6, 23, 0.85);
border: 1px solid rgba(148, 163, 184, 0.14);
color: #c7d2fe;
font-family: ui-monospace, SFMono-Regular, Menlo, Monaco, Consolas, monospace;
font-size: 0.78rem;
line-height: 1.5;
}
@media (max-width: 920px) {
.docs-grid-3,
.docs-grid-4 {
grid-template-columns: 1fr;
}
}
</style>
</head>
<body>
<div class="header-banner">
<h1>DJD Agent Score <span class="badge">API</span></h1>
<p>Developer docs for scoring wallets, publishing trust surfaces, and gating payouts or x402 routes &middot; <a href="/pricing" style="color:#818cf8;text-decoration:underline">View pricing &amp; plans</a></p>
<p>Developer docs for scoring wallets, publishing trust surfaces, and gating payouts or x402 routes. Start with a free lookup, move into API-key or x402 production auth, then add evaluator, Certify, and directory surfaces when trust needs to become visible.</p>
<div class="header-actions">
<a class="header-link" href="/pricing">View pricing</a>
<a class="header-link" href="/directory">Browse directory</a>
<a class="header-link" href="/certify">Open Certify</a>
</div>
</div>
<div class="docs-shell">
<section class="docs-section">
<div class="docs-title">Ship your first DJD integration</div>
<div class="docs-copy">The simplest path is: screen counterparties in development, choose your production billing path, then add public trust surfaces only when customers or operators need to inspect what your backend already knows.</div>
<div class="docs-grid docs-grid-3">
<article class="docs-card">
<div class="docs-kicker">Step 1</div>
<h3>Screen counterparties during development</h3>
<p>Start with the free score endpoint and test real wallet decisions before you change any production flow.</p>
<div class="docs-code">GET /v1/score/basic?wallet=0x...</div>
</article>
<article class="docs-card">
<div class="docs-kicker">Step 2</div>
<h3>Add production auth</h3>
<p>Human teams usually move to a Bearer API key. Autonomous agents can keep paying per request with x402.</p>
<div class="docs-code">Authorization: Bearer djd_sk_...<br/>X-PAYMENT: &lt;proof&gt;</div>
</article>
<article class="docs-card">
<div class="docs-kicker">Step 3</div>
<h3>Layer in trust surfaces</h3>
<p>When the trust decision needs to be inspectable, add evaluator, directory, certification, and standards-facing outputs.</p>
<div class="docs-code">/v1/score/evaluator<br/>/v1/certification/directory<br/>/v1/score/erc8004</div>
</article>
</div>
</section>
<section class="docs-section">
<div class="docs-title">Use DJD when you're building</div>
<div class="docs-copy">DJD fits best anywhere a wallet can cost you money, fulfillment quality, or customer trust. These are the strongest customer wedges in the product today.</div>
<div class="docs-grid docs-grid-4">
<article class="docs-card">
<div class="docs-kicker">Marketplaces</div>
<h3>Agent marketplaces</h3>
<p>Score providers before listing them and link buyers to profiles, badges, and certification surfaces they can inspect.</p>
</article>
<article class="docs-card">
<div class="docs-kicker">Settlement</div>
<h3>Payout and escrow flows</h3>
<p>Use score, risk, and evaluator outputs before releasing funds or treating a counterparty as settlement-ready.</p>
</article>
<article class="docs-card">
<div class="docs-kicker">Paid APIs</div>
<h3>x402 and paid agent tools</h3>
<p>Check the payer before expensive work starts and keep trust gating inside the same monetized route.</p>
</article>
<article class="docs-card">
<div class="docs-kicker">Discovery</div>
<h3>Directories and service networks</h3>
<p>Publish machine-readable trust documents and public pages so other apps can discover certified, inspectable wallets.</p>
</article>
</div>
</section>
</div>
<div id="swagger-ui"></div>
<script src="https://unpkg.com/swagger-ui-dist@5/swagger-ui-bundle.js" crossorigin></script>
Expand All @@ -100,37 +290,6 @@ const SWAGGER_HTML = `<!DOCTYPE html>
</script>
</body>
</html>`

export function getPublicDiscoveryCacheControl(): string {
return PUBLIC_CACHE_CONTROL
}

export function getOpenApiSpecView(): string {
const server = OPENAPI_DOCUMENT.servers?.[0]
return JSON.stringify(
{
...OPENAPI_DOCUMENT,
info: {
...OPENAPI_DOCUMENT.info,
contact: {
...OPENAPI_DOCUMENT.info?.contact,
email: getSupportEmail(),
},
},
servers: [
{
description: server?.description ?? 'Production',
url: getPublicBaseUrl(),
},
],
},
null,
2,
)
}

export function getDocsHtmlView(): string {
return SWAGGER_HTML
}

export function getX402DiscoveryView(requestUrl: string, forwardedProto?: string | null) {
Expand Down
Loading