Postbox

A thedevlabs-io VS Code extension: an API client that lives in your editor. Group requests into spaces, share values with variables, keep a history of every call, and export the whole thing as JSON — without your API keys riding along.

Why another API client

Because the request you're debugging is three feet from the code that makes it, and because a collection export shouldn't be a credential leak waiting to be committed. Secret variables live in your OS keychain; exports carry the names and leave the values behind.

What's in it

• Spaces — group requests that share a base URL and variables (thedevlabs API, Internal, Staging).
• Requests — every method, query params, headers, JSON/text/form bodies.
• Auth helpers — Bearer, Basic, or an API key header, rather than hand-assembling an Authorization value.
• Variables — {{base}}/users, resolved space-first then global, so a space can override a shared default.
• History — every call with its request, response, status, timing and size.
• Export / import — a JSON file you can commit and a teammate can import. The Spaces view title bar has both; a space's right-click menu exports just that one.
• Copy as code — curl, fetch, or axios, for pasting into a ticket.

The request tab

┌────────────────────────────────────────────────────────────┐
│ [GET ▾] {{base}}/users?id={{userId}}   Send  Copy as…  …   │
│ {{base}} {{userId}}          ← green if defined, red if not │
├──────────────────────────┬─────────────────────────────────┤
│ Params│Headers│Body│Auth │ 200 OK · 143 ms · 1.2 KB        │
│                          │ Pretty│Raw│Preview│Headers      │
│  id   {{userId}}      ☑  │ {                               │
│  page 1               ☑  │   "users": [ … ]                │
└──────────────────────────┴─────────────────────────────────┘
                           ↑ drag to resize, double-click to reset

• URL and params stay in step, both ways. Type ?id=1 in the URL and it appears as a row; edit or tick a row and the URL rewrites. Disabled rows are kept even though they can't appear in the URL, and {{placeholders}} are never percent-encoded in front of you.
• Variable chips under the URL list every variable the request references — green when it resolves, red when nothing defines it — so a typo is visible before you send. The offending field is outlined too.
• Split layout: request left, response right, with a draggable divider (double-click to restore, Expand to give the response the whole tab).
• Response views: Pretty (JSON, coloured), Raw, Headers, and Preview for HTML responses — rendered in a sandboxed frame with scripts, forms and remote assets blocked, so previewing a page can't run anything.

Secrets

Mark a variable secret and its value goes to VS Code's SecretStorage — Keychain on macOS, Credential Manager on Windows, gnome-keyring/KWallet on Linux. From then on:

• The value is never written to the extension's JSON files.
• Exports carry the name and an empty value. Importing tells you which secrets need filling in. The file is safe to commit.
• History stores {{token}}, not the token. Before a call is recorded, any resolved secret value is written back to its variable name.
• Copy as code produces {{placeholders}} too, so a snippet in a ticket isn't a live credential.

Two things to know:

• Response bodies are stored in history by default, and a response can contain a token that Postbox has no way to recognise. Turn off postbox.history.storeResponseBodies to keep only status, timing and headers.
• On Linux without a keyring available, VS Code falls back to a weaker local store. The rest of the extension is unaffected.

Nothing is written into your workspace folder, so nothing lands in git by accident.

Settings

Develop / run locally

npm install
npm run lint && npm test
npm run build

Press F5 to launch an Extension Development Host.

Package & install

npm run package
code --install-extension postbox-0.1.0.vsix

License

MIT © thedevlabs-io