1. Register an app and get an SDK key
Create a free account, register your app in the admin console, and copy the SDK key it generates. The key is a bearer token your SDK uses to authenticate — keep it out of public source where you can.
2. Add a webhook subscriber
In the console, add a subscriber — the URL that should receive reports — and copy its signing secret. Every delivery to that URL is signed with this secret so you can verify it’s genuinely from TraceItX. Don’t have an endpoint yet? Use a request inspector while you’re testing, then point it at your real service.
3. Install and initialise the SDK
Install the SDK for your platform (full per-platform details in installation). For React:
npm i @traceitx/react Wrap your app and provide the SDK key:
import { TraceItXProvider } from '@traceitx/react';
function Root() {
return (
<TraceItXProvider config={{ apiKey: 'txx_live_…' }}>
<App />
</TraceItXProvider>
);
} 4. Trigger a report
Wire any button (or the built-in hotkey) to open the reporter. The user adds a title and description, optionally annotates the screenshot, and submits.
import { useTraceItX } from '@traceitx/react';
function ReportButton() {
const { open } = useTraceItX();
return <button onClick={() => open()}>Report a bug</button>;
} open() resolves with the outcome —
{ status: 'submitted', reportId },
'queued' (saved for retry), or 'cancelled' — so you can
confirm to the user.
5. Receive the report
Within moments your subscriber URL receives a POST with the
AI-ready envelope as the JSON body and a
X-TraceItX-Signature header. Verify the signature, return
2xx, and you’re done — the full context of the bug is now in your
tools. See webhooks for verification code.