DEV Community: open post

Lens: screenshots and click-by-click guides, with no account and no server

open post — Thu, 17 Sep 2026 17:32:09 +0000

I write a lot of documentation that is mostly screenshots. Every tool I tried for it wanted an account, uploaded my screenshots to somebody's bucket, and then charged me to export the result as anything other than a link. So I built Lens, a Chrome and Edge extension (Manifest V3, Chrome 137+) that does the whole job in the browser.

There is no account, no server and no upload. Every feature works for free. A licence removes an occasional reminder, a Ko-fi link and the watermark on saved images, and that is all it removes.

Capture

Three hotkeys, rebindable at chrome://extensions/shortcuts:

	macOS	Windows / Linux
Capture region	`⌘⇧S`	`Alt+Shift+S`
Smart Capture (step guide)	`⌘⇧E`	`Alt+Shift+E`
Record GIF or MP4	`⌘⇧R`	`Alt+Shift+R`

The region selection is draggable with a Retina-accurate size readout, so a crop you measure at 800x600 saves at 800x600.

Edit and save on one screen

Pen, text, box, circle, arrow and blur, plus crop, colour adjustment, rotation and an exact-pixel resize, with the file name and notes next to them.

Marks stay editable instead of being painted into the pixels. Move one, retype a label, delete the one in the middle, undo any of it. Nothing is written to disk until you press Save.

Blur is the exception, because blur rewrites the pixels. That is deliberate, and it matters for the next part.

Private data warnings before you save

Before a capture is saved, Lens reads the DOM under the selection and flags passwords, API keys, tokens, JWTs, private keys, email addresses and Luhn-checked card numbers. The rules are plain DOM rules. No model, no network call.

It offers to blur what it found and never blurs anything for you. Blur is destructive, so it stays your click.

Guides from clicks, without a model

Record a walkthrough with ⌘⇧E and every click becomes a step: a screenshot taken at the moment of the click, cropped to the control you clicked, outlined and numbered. There is no video behind it and no time limit.

The step text comes from the accessible name a screen reader would announce for that control, so "Click Save changes" is generated from the button's own label rather than guessed at by an LLM. Nothing about guide capture involves AI.

Guides open as a document in their own tab. Markdown sits behind the formatting, and a toggle drops you into that Markdown when you would rather type than click. Reorder steps, retitle them, split an animated step back into its clicks, replace or re-edit any screenshot.

Export

guide.html, self-contained, every image inlined, no scripts. One file you can attach to an email, and ⌘P then Save as PDF gets you a PDF.
Markdown, zipped with its screenshots.
Rich text on the clipboard, for Confluence, Notion or a doc.
Every guide at once, as one archive.

Import takes a bundle back from a file or a link. Imports are copies, so nothing already on disk is overwritten. There is also a "Find guides on disk" pass that lists guides whose folders exist but whose metadata entry does not, which is how you repair a lost project_metadata.json.

Where the files live

A project keeps its own captures and guides, so it works with no folder linked at all. Link a folder and every capture is also written there through the File System Access API, with a project_metadata.json beside them holding the timeline.

The interesting failure here is the folder grant. Chrome hands that permission back whenever nothing of the extension is running, which used to mean a folder linked in the morning was asking to be reconnected by lunchtime. Now a lapsed grant only means the copy on disk is behind. The capture is saved regardless, the pending writes are remembered, and they are flushed when the folder is reachable again, either because you reconnected it or because you reopened the browser. The project card tells you how many writes are waiting.

Link a folder to a project that has been running for months and Lens offers to copy the whole history across, tells you how many files and how much disk that is first, and skips files the folder already has.

Bring your own AI, off by default

There is an optional assistant. Configure as many models as you like, including the browser's built-in one, a model running on your own machine, Claude, Gemini, OpenAI or any compatible endpoint, and switch between them per message. Each one is usable only after a test that actually reached it.

The assistant sends what you attach to a message and nothing else. Keys live in their own storage key, read by the service worker and never by a content script sharing a process with the page.

All of it is off until you turn it on, and every AI-written piece of text has a non-AI fallback behind it.

Install

Lens by Vectored on the Chrome Web Store. Same package on Edge Add-ons.

Current version is 1.22.0. If you capture documentation for a living, I would like to know which part of your workflow it still does not cover.

Open Post - Test APIs Without Leaving VS Code

open post — Mon, 30 Mar 2026 17:29:06 +0000

Open Post: Test APIs Without Leaving VS Code

If you're tired of switching between your code editor and Postman, or concerned about your API credentials living in the cloud, I built something you might like.

Open Post is a fully offline REST & GraphQL API client that lives inside VS Code. No accounts, no cloud sync, no telemetry. Just you, your editor, and your APIs.

Why I Built This

I got tired of the constant context-switching. Write code in VS Code, test the API in Postman, copy the cURL command, switch back to VS Code, paste it somewhere... you know the drill.

Plus, I never felt comfortable with my API keys and tokens syncing to someone else's cloud. Call me paranoid, but I prefer my secrets to stay on my machine.

So I built Open Post with three goals:

Stay in VS Code — no more context-switching
Privacy first — everything stays local
Git-friendly — plain JSON files you can commit

Getting Started

Install from VS Code Marketplace:

https://marketplace.visualstudio.com/items?itemName=open-post.open-post

Step-by-step installation:

Open VS Code
Click the Extensions icon in the sidebar (or press Cmd+Shift+X / Ctrl+Shift+X)
Search for "Open Post"
Click Install on the extension by open-post
Once installed, press Cmd+Alt+P (Mac) or Ctrl+Alt+P (Windows/Linux)

The Open Post panel will open automatically. Now try your first request:

GET https://jsonplaceholder.typicode.com/posts/1

Hit Send or press Cmd+Enter. You'll get a formatted response with syntax highlighting, response time, and status code.

Features Worth Mentioning

Encrypted Secret Vault

Store API keys, tokens, and certificates in an AES-256-GCM encrypted vault. No external services needed.

1. Open the Vault tab
2. Create a vault with a master password
3. Add secrets: key="api-key", value="sk-abc123..."
4. Use {{api-key}} in your requests

The vault auto-resolves variables during requests, and you can store TLS certificates for mTLS authentication.

Environment Variables

Create environments (Dev, Staging, Prod) and use {{variable}} syntax anywhere:

URL:    {{base_url}}/users/{{user_id}}
Header: Authorization: Bearer {{token}}
Body:   { "api_key": "{{api_key}}" }

Variables follow a priority chain:

collection vars < global env < vault secrets < local env

Collections with Inheritance

Organize requests into collections with nested folders. Set auth at the collection level, and every request inherits it. Override at the folder or request level when needed.

Same goes for pre-request and test scripts — they cascade down the hierarchy.

Mock Servers

Spin up mock servers right inside VS Code:

Define routes with custom or snapshot-based responses
Auto-generated OpenAPI docs at /_openapi.json
Interactive Swagger UI at /_swagger
Request logging
File-based responses

Perfect for frontend development when the backend isn't ready yet.

AI Integration (MCP)

Open Post supports the Model Context Protocol. Expose your collection requests as tools for AI clients like Claude Desktop, Cursor, or GitHub Copilot.

Enable the built-in Management MCP server, and your AI can:

Create collections and requests
Run API tests
Start/stop mock servers
Import/export data

Connect to http://127.0.0.1:3199/mcp and say:

"Create a new collection called User API"
"Run all requests in the Auth collection"

Code Export

Need to integrate an API call into your codebase? Click the </> button and get code in 14 languages:

cURL (Unix & Windows), PowerShell, JavaScript (Fetch & Axios), Python (Requests & http.client), Go, Java, C#, Ruby, PHP, Rust, Swift

Environment variables are resolved, auth headers are injected, and the code is ready to paste.

Authentication

Supports every auth type you'll need:

Basic Auth
Bearer Token
API Key (header or query param)
OAuth 2.0 (authorization code & client credentials)
AWS Signature V4
Digest Auth (RFC 7616)

All auth types support {{variable}} placeholders.

Body Types

JSON, Form Data, URL Encoded, Raw Text, XML, GraphQL, Binary

All text-based body types support inline comments that are automatically stripped before sending:

{
  "name": "John",
  // "email": "test@example.com",  // Temporarily disabled
  "age": 30
}

Pre-Request & Test Scripts

Automate workflows with JavaScript:

// Pre-request: set dynamic header
request.headers["X-Timestamp"] = Date.now().toString();

// Test: assert response
console.assert(response.status === 200, "Expected 200");
const body = response.json();
console.assert(body.id !== undefined, "Should have id");

Global Storage

Create global collections and environments in ~/.openpost/global/ that are shared across all workspaces. Changes sync automatically across VS Code windows.

Perfect for reusable collections you use across multiple projects.

Import & Export

Postman v2.1 collections
OpenAPI / Swagger specs (auto-generates collections)
cURL commands
Open Post JSON (native format)

Data Storage

All your data lives locally:

.openpost/                    ← per workspace
  ├── collections.json
  ├── environments.json
  ├── history.json
  └── config.json

~/.openpost/global/           ← shared across workspaces
  ├── collections.json
  ├── environments.json
  ├── vault.enc               ← encrypted vault
  └── config.json

No cloud sync. No telemetry. Commit .openpost/ to git to share with your team.

My Daily Workflow

Here's how I use it:

Create a global environment with base_url, api_key, auth_token
Create a collection for each microservice
Set collection-level auth (Bearer token with {{auth_token}})
Add requests using {{base_url}}/endpoint
Write pre-request scripts to refresh tokens
Use test scripts to extract IDs and set them as variables
Run the entire collection to test the full flow
Export to code when integrating into the app

Everything stays in sync across projects, and I never leave VS Code.

Simple vs Advanced Mode

Simple Mode (default) — Clean interface with just the essentials: requests, params, headers, body, auth.

Advanced Mode — Unlocks Mock+MCP servers, Vault, test scripts, and advanced settings. Requires a license key, but includes a built-in trial.

Installation

VS Code Marketplace:

https://marketplace.visualstudio.com/items?itemName=open-post.open-post

Open VSX Registry:

https://open-vsx.org/extension/open-post/open-post

GitHub:

https://github.com/openAPI-Studio/openAPI-Studio

Support the project:

https://ko-fi.com/openpost

Keyboard Shortcuts

Open Open Post: Cmd+Alt+P (Mac) / Ctrl+Alt+P (Windows/Linux)
Send Request: Cmd+Enter / Ctrl+Enter

Who Should Use This?

Open Post is great for:

Privacy-conscious developers
Teams using git for collaboration
VS Code power users who hate context-switching
Backend developers who need quick API testing
DevOps engineers managing multiple environments
API developers who want to mock endpoints
AI enthusiasts exploring MCP integration

What's Coming

The team is working on:

External vault providers (Azure Key Vault, AWS Secrets Manager)
WebSocket support
gRPC support
Request chaining and workflows

Final Thoughts

Open Post isn't trying to replace Postman for everyone. It's for developers who value privacy, simplicity, and keeping their workflow inside VS Code.

If that sounds like you, give it a try. Install from the marketplace, press Cmd+Alt+P, and start making requests. No sign-up required.

Note: This is an actively developed project and there might be bugs. Any feedback, bug reports, or feature requests are greatly appreciated! Feel free to open an issue on GitHub or reach out.

Current Version: 1.3.40

Minimum VS Code: 1.85.0

License: Proprietary

Support Open Post on Ko-fi: https://ko-fi.com/openpost

Questions? Open an issue on GitHub

Quick Reference

Links:

Tags: #vscode #api #rest #graphql #tools #productivity #opensource