Local log viewer without dependencies. Use `yoink()` to write logs and `yoink` to start the browser UI.
npm install yoink-my-logsA better console.log for debugging. Zero dependencies. Drop yoink() calls anywhere in your code, Node.js or browser, and watch them stream live to a clean web UI with filtering, search, and proper JSON formatting.

More screenshots



``bash`
npm install yoink-my-logs
`javascript
import yoink from "yoink-my-logs"
// Log data directly
yoink({ userId: 123, cart: items, total: 49.99 })
// Data with a message (data first, message second)
yoink({ userId: 123 }, "User signed in")
// With tags for different log levels
yoink.info({ port: 3000 }, "Server started")
yoink.success({ amount: 49.99 }, "Payment processed")
yoink.warn({ current: 95 }, "Rate limit approaching")
yoink.error({ code: "ETIMEDOUT" }, "Connection failed")
yoink.debug({ requestBody: data }) // data-only works with tags too
`
`bash`
npx yoink
Open http://localhost:7337 to see your logs stream in real-time.
You can also call yoink() from your frontend code. Logs are sent to the yoink server via HTTP.
`javascript
import yoink from "yoink-my-logs/browser"
yoink({ url: location.href, user: currentUser }) // data only
yoink({ url: location.href }, "page loaded") // data + message
yoink.info({ type: "click" }, "user action")
`
Add the script tag to your HTML (served by the yoink server):
`html`
If the yoink server is running on a non-default port or a different host:
`javascript
import yoink from "yoink-my-logs/browser"
// Custom port
yoink.init({ port: 8080 })
// Custom host (e.g., for LAN access from mobile)
yoink.init({ host: "192.168.1.50" })
// Both
yoink.init({ host: "192.168.1.50", port: 8080 })
yoink("hello from mobile")
`
The init() call is optional — if you don't call it, it defaults to localhost:7337.
- Logs are stored in ~/.yoink-my-logs/ as daily JSON files (YYYY-MM-DD.log)YYYY-MM-DD_2.log
- The browser UI connects via Server-Sent Events (SSE) for live updates
- When you open the viewer, it shows today's log history and streams new entries as they arrive
- File rotation: When a log file exceeds 100MB, a new file is created (, YYYY-MM-DD_3.log, etc.)
- Entry limit: Individual log entries larger than 100KB are rejected to prevent runaway logging
| Variable | Default | Description |
|----------|---------|-------------|
| YOINK_PORT | 7337 | Port for the web UI |YOINK_LOG_DIR
| | ~/.yoink-my-logs | Directory where log files are stored |YOINK_REPLACE_CONSOLE_LOG
| | - | When set, replaces console.log, console.info, console.warn, console.error, and console.debug with yoink equivalents |
`bashCustom port
YOINK_PORT=8080 npx yoink
Default port is
7337.$3
You can automatically replace
console.log and other console methods with yoink by setting the YOINK_REPLACE_CONSOLE_LOG environment variable:`bash
YOINK_REPLACE_CONSOLE_LOG=1 node your-app.js
`When enabled, the following console methods are replaced:
-
console.log → yoink()
- console.info → yoink.info()
- console.warn → yoink.warn()
- console.error → yoink.error()
- console.debug → yoink.debug()Other console methods (like
console.dir, console.table, console.trace, etc.) remain unchanged.Browser usage: In the browser, set
window.YOINK_REPLACE_CONSOLE_LOG = true before importing yoink:`javascript
window.YOINK_REPLACE_CONSOLE_LOG = true
import yoink from "yoink-my-logs/browser"// Now console.log will use yoink
console.log("This goes to yoink!")
`API
$3
Flexible argument handling:
| Call | Data | Message |
|------|------|---------|
|
yoink({ user: 1 }) | { user: 1 } | "" |
| yoink({ id: 1 }, "clicked") | { id: 1 } | "clicked" |
| yoink("hello") | undefined | "hello" |- Single non-string argument → treated as data
- Single string argument → treated as message
- Two arguments → first is data, second is message
$3
All tagged methods accept the same flexible arguments as
yoink():| Method | Tag | Color |
|--------|-----|-------|
|
yoink.info() | INFO | Blue |
| yoink.success() | SUCCESS | Green |
| yoink.warn() | WARN | Amber |
| yoink.error() | ERROR | Red |
| yoink.debug() | DEBUG | Purple |$3
When debugging large arrays, you often only need to see a subset of the data. These methods let you log only the first or last items:
| Method | Description |
|--------|-------------|
|
yoink.first(data, message?) | Logs only the first item of an array |
| yoink.last(data, message?) | Logs only the last item of an array |
| yoink.five(data, message?) | Logs the first 5 items of an array |
| yoink.last.five(data, message?) | Logs the last 5 items of an array |
| yoink.ten(data, message?) | Logs the first 10 items of an array |
| yoink.last.ten(data, message?) | Logs the last 10 items of an array |`javascript
const users = await fetchUsers() // Returns 500 users// Log just the first user
yoink.first(users, "First user")
// Log just the last user
yoink.last(users, "Most recent user")
// Log first 5 users
yoink.five(users, "Top 5 users")
// Log last 5 users
yoink.last.five(users, "Recent signups")
// Log first 10 users
yoink.ten(users, "First page of users")
// Log last 10 users
yoink.last.ten(users, "Latest 10 users")
`Behavior notes:
- If the data is not an array, it's logged as-is (no slicing applied)
- Empty arrays return
[] for .five(), .ten(), .last.five(), .last.ten() and undefined for .first(), .last()
- If the array has fewer items than requested, all items are logged$3
The browser module (
yoink-my-logs/browser) has the same API as above, plus:####
yoink.init(options?)| Option | Type | Default | Description |
|--------|------|---------|-------------|
|
host | string | localhost | Hostname or IP address of the yoink server |
| port | number | 7337 | Port number of the yoink server |Demo
$3
Generate sample logs to test the UI:
`bash
npm run demo
`Or after installing the package:
`bash
npx yoink-demo
`$3
For more comprehensive testing, check out the
demo/ directory which includes:-
node-demo.js - A Node.js application demonstrating various logging scenarios
- browser-demo.html - A standalone HTML page for browser-based logging
- continuous-demo.js - Continuously generates logs for testing live streamingTo use the demo project:
1. Start the yoink server:
npm run start (or npx yoink)
2. Run the Node.js demo: node demo/node-demo.js
3. Open demo/browser-demo.html in your browserSee
demo/README.md for more details.Development
`bash
npm test
``MIT