{"id":31057247,"url":"https://github.com/qduc/json-viewer","last_synced_at":"2025-09-15T06:52:39.133Z","repository":{"id":310960379,"uuid":"1041886064","full_name":"qduc/json-viewer","owner":"qduc","description":null,"archived":false,"fork":false,"pushed_at":"2025-08-21T08:36:37.000Z","size":128,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-08-21T09:43:29.729Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"TypeScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":null,"status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/qduc.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":null,"code_of_conduct":null,"threat_model":null,"audit":null,"citation":null,"codeowners":null,"security":null,"support":null,"governance":null,"roadmap":null,"authors":null,"dei":null,"publiccode":null,"codemeta":null,"zenodo":null}},"created_at":"2025-08-21T06:47:47.000Z","updated_at":"2025-08-21T08:36:40.000Z","dependencies_parsed_at":"2025-08-21T09:43:34.653Z","dependency_job_id":"10ee37df-7449-4bc2-a366-e4cc14b0c1b9","html_url":"https://github.com/qduc/json-viewer","commit_stats":null,"previous_names":["qduc/json-viewer"],"tags_count":null,"template":false,"template_full_name":null,"purl":"pkg:github/qduc/json-viewer","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/qduc%2Fjson-viewer","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/qduc%2Fjson-viewer/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/qduc%2Fjson-viewer/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/qduc%2Fjson-viewer/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/qduc","download_url":"https://codeload.github.com/qduc/json-viewer/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/qduc%2Fjson-viewer/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":275219525,"owners_count":25425888,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2022-07-04T15:15:14.044Z","status":"online","status_checked_at":"2025-09-15T02:00:09.272Z","response_time":75,"last_error":null,"robots_txt_status":"success","robots_txt_updated_at":"2025-07-24T06:49:26.215Z","robots_txt_url":"https://github.com/robots.txt","online":true,"can_crawl_api":true,"host_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub","repositories_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories","repository_names_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repository_names","owners_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners"}},"keywords":[],"created_at":"2025-09-15T06:52:34.112Z","updated_at":"2025-09-15T06:52:39.110Z","avatar_url":"https://github.com/qduc.png","language":"TypeScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# 🧩 JSON Formatter \u0026 Explorer\n\nA fast, developer-friendly **single-page React app** for working with JSON.  \nValidate, beautify, minify, escape/unescape, and explore JSON with a collapsible tree view and powerful filtering.  \n\nBuilt with **React + TypeScript + Vite**, designed for speed (handles multi-MB JSON), and optimized for everyday developer workflows.\n\n---\n\n## ✨ Features\n\n- **Validation**\n  - Real-time linting with line/column error messages\n  - Highlights errors directly in the editor\n\n- **Formatting**\n  - Beautify (configurable indentation)\n  - Minify (compact output)\n  - Escape → turn text into a JSON string literal\n  - Unescape → parse JSON string literals back into raw text\n\n- **Tree Explorer**\n  - Collapse/expand nodes\n  - Expand all / collapse all\n  - Expand by depth level\n  - Copy key, value, or JSONPath\n  - Breadcrumb navigation\n\n- **Filter \u0026 Search**\n  - Find by key or value\n  - Regex support\n  - Highlights matches and preserves parent context\n  - Navigate matches with keyboard\n\n- **Developer Experience**\n  - Monaco/CodeMirror editor with syntax highlighting\n  - Resizable split panes\n  - Light/dark themes (system preference aware)\n  - Large file support via Web Workers\n  - Copy to clipboard \u0026 download as `.json` or `.txt`\n  - Local storage persistence\n\n---\n\n## 🚀 Demo\n\n👉 [Live Demo](#) *(coming soon)*  \n\n![screenshot editor](docs/screenshot-editor.png)  \n![screenshot tree](docs/screenshot-tree.png)  \n\n---\n\n## ⌨️ Keyboard Shortcuts\n\n| Action           | Shortcut             |\n|------------------|----------------------|\n| Validate JSON    | `Ctrl/Cmd + Enter`  |\n| Beautify         | `Ctrl/Cmd + Shift + B` |\n| Minify           | `Ctrl/Cmd + Shift + M` |\n| Expand All       | `Ctrl/Cmd + Shift + K` |\n| Collapse All     | `Ctrl/Cmd + K` |\n| Focus Filter     | `Ctrl/Cmd + F` |\n| Clear Filter     | `Esc` |\n\n---\n\n## 🛠️ Getting Started\n\n### Prerequisites\n- Node.js ≥ 18\n- pnpm / yarn / npm (choose one)\n\n### Install\n```bash\ngit clone https://github.com/your-username/json-formatter.git\ncd json-formatter\npnpm install\n````\n\n### Run in Dev Mode\n\n```bash\npnpm dev\n```\n\nApp will be available at `http://localhost:5173`\n\n### Build for Production\n\n```bash\npnpm build\npnpm preview\n```\n\n### Run Tests\n\n```bash\npnpm test\n```\n\n---\n\n## 📂 Project Structure\n\n```\nsrc/\n ├── components/   # UI components (Editor, TreeView, Toolbar, etc.)\n ├── utils/        # JSON helpers (validate, beautify, escape/unescape, filter)\n ├── workers/      # Web Worker code for parsing/formatting\n ├── hooks/        # Custom React hooks\n └── App.tsx       # Main entry point\n```\n\n---\n\n## 🔍 Examples\n\n### Input\n\n```json\n{\"a\":1,\"b\":[1,2,{\"c\":\"x\\\\ny\"}],\"d\":{\"e\":true,\"f\":null}}\n```\n\n### Beautified Output\n\n```json\n{\n  \"a\": 1,\n  \"b\": [\n    1,\n    2,\n    {\n      \"c\": \"x\\n y\"\n    }\n  ],\n  \"d\": {\n    \"e\": true,\n    \"f\": null\n  }\n}\n```\n\n### Escaped Output\n\n```json\n\"{\\\"a\\\":1,\\\"b\\\":[1,2,{\\\"c\\\":\\\"x\\\\ny\\\"}],\\\"d\\\":{\\\"e\\\":true,\\\"f\\\":null}}\"\n```\n\n---\n\n## 🤝 Contributing\n\nContributions are welcome!\n\n* Fork the repo\n* Create a feature branch: `git checkout -b feature/awesome-feature`\n* Commit changes: `git commit -m \"feat: add awesome feature\"`\n* Push and open a Pull Request\n\nPlease run tests before submitting PRs.\n\n---\n\n## 📌 Roadmap\n\n* [ ] JSON Schema validation\n* [ ] JSON diff/compare mode\n* [ ] CSV/TSV to JSON converter\n* [ ] Import JSON from URL\n* [ ] Deploy demo to GitHub Pages/Netlify\n\n---\n\n## 📄 License\n\nMIT License © 2025 qduc\n","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fqduc%2Fjson-viewer","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fqduc%2Fjson-viewer","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fqduc%2Fjson-viewer/lists"}