Public
Like
PinoViewer
Val Town is a collaborative website to build and scale JavaScript apps.
Deploy APIs, crons, & store data β all from the browser, and deployed in milliseconds.
index.ts
https://wolf--573bd59c472111f0aa7476b3cceeab13.web.val.run
A beautiful, interactive log viewer for structured JSON logs with filtering, search, and real-time capabilities.
- π High-Density Table View: Ultra-compact table showing maximum logs with all data visible
- π Reverse Chronological Order: Most recent logs appear at the top
- π Complete Data Display: Shows ALL log data in a compact format, not just method names
- π Advanced Filtering: Filter by log level, method, time range, and custom fields
- π¨ Syntax Highlighting: Color-coded log levels and JSON formatting
- β‘ Maximum Information Density: See 50+ logs at once in table view
- π± Responsive Design: Works on desktop and mobile devices
- π Deep Linking: Share specific log views with URL parameters
- Visit the application at the deployed URL
- Paste your logs in the input area or upload a log file
- Click "Parse Logs" or use "Load Sample" to see example data
- Use the filters to narrow down the logs you want to see:
- Filter by log level (trace, debug, info, warn, error, fatal)
- Search across all log content
- Filter by specific methods or hostnames
- Set time range filters
- Switch between Table View (high-density) and List View (detailed)
- Click on individual log entries to expand and see detailed JSON view
- Use "Expand All" / "Collapse All" for bulk operations in List View
The viewer supports structured JSON logs with fields like:
level: Log level (info, warn, error, debug)time: Timestampmethod: Method namemsg: Log messageparams: Additional parameters- Custom fields
βββ backend/
β βββ index.ts # Main Hono server
β βββ routes/
β βββ logs.ts # Log processing endpoints
βββ frontend/
β βββ index.html # Main HTML template
β βββ components/
β β βββ App.tsx # Main application component
β β βββ LogViewer.tsx # Log display component
β β βββ LogFilters.tsx # Filter controls
β βββ utils/
β βββ logParser.ts # Log parsing utilities
βββ shared/
βββ types.ts # Shared TypeScript types