JSONL Formatter

Web app to validate JSONL and pretty-print each line as readable JSON.

Live demo

Screenshot

Why this project

JSONL is easy to generate, hard to inspect manually. This tool helps with:

• quick validation
• per-line parse errors with line numbers
• readable JSON expansion per line
• markdown preview for long string fields

Features

• Split-pane editor and output view.
• Real-time validation while typing.
• Per-line status (Valid / Invalid) with counters.
• Expand/minimize each line output.
• Markdown modal preview for large text values (80+ chars).
• Trailing final empty line accepted (JSONL-friendly behavior).
• SEO metadata + JSON-LD (WebApplication) + sitemap/robots/manifest.
• Static export for GitHub Pages.

Quick start

Prerequisites

• Node.js 22+ (CI uses Node 22)
• npm

Install and run

npm install
npm run dev

Open http://localhost:3000.

Usage

1. Paste JSONL into the left editor (one JSON object/value per line).
2. Check summary badge for overall validity.
3. Expand any line on the right to inspect formatted JSON or error.
4. For long text fields, hover value and click View Markdown.
5. Use Sample to load demo data, Clear to reset.

Example input:

{"event":"signup","user_id":101}
{"event":"purchase","amount":49.99}

Scripts

npm run dev      # local dev server
npm run lint     # eslint
npm run test     # vitest
npm run build    # production static build (out/)
npm run deploy   # publish out/ to gh-pages

Deployment

GitHub Actions (recommended)

Workflow: .github/workflows/deploy.yml

• triggers on push to main
• builds static output (out/)
• publishes to gh-pages

Manual publish

next.config.ts derives basePath from GITHUB_REPOSITORY in production builds. Set it before deploy:

export GITHUB_REPOSITORY=your-user/your-repo
npm run deploy

Project structure

src/app/              # Next.js app router pages + metadata routes
src/lib/jsonl.ts      # JSONL parser and per-line formatting
src/lib/markdown-fields.ts  # long-string markdown field discovery
src/lib/*.test.ts     # vitest unit tests
public/               # static assets (including screenshot)

Quality checks

Before opening a PR:

npm run lint
npm run test
npm run build

Contributing

Issues and PRs welcome.

Suggested flow:

1. Fork and create a feature branch.
2. Keep changes scoped and add tests for behavior changes.
3. Run quality checks locally.
4. Open PR with a clear summary and before/after behavior.

Acknowledgements

• JSONL validator behavior references: wardi/jsonlines validator.js
• Formatting model reference: jsonformatter.org jsontools-min.js

License

No license file is currently present in this repository.