{"id":51383713,"url":"https://github.com/koniz-dev/json-formatter","last_synced_at":"2026-07-03T18:11:20.344Z","repository":{"id":315352720,"uuid":"1059138682","full_name":"koniz-dev/json-formatter","owner":"koniz-dev","description":null,"archived":false,"fork":false,"pushed_at":"2025-09-18T05:58:19.000Z","size":11,"stargazers_count":0,"open_issues_count":0,"forks_count":0,"subscribers_count":0,"default_branch":"main","last_synced_at":"2025-09-18T06:08:27.808Z","etag":null,"topics":[],"latest_commit_sha":null,"homepage":null,"language":"JavaScript","has_issues":true,"has_wiki":null,"has_pages":null,"mirror_url":null,"source_name":null,"license":"mit","status":null,"scm":"git","pull_requests_enabled":true,"icon_url":"https://github.com/koniz-dev.png","metadata":{"files":{"readme":"README.md","changelog":null,"contributing":null,"funding":null,"license":"LICENSE","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,"notice":null,"maintainers":null,"copyright":null,"agents":null,"dco":null,"cla":null}},"created_at":"2025-09-18T03:50:31.000Z","updated_at":"2025-09-18T05:58:22.000Z","dependencies_parsed_at":"2025-09-18T06:08:29.976Z","dependency_job_id":"da7a3d59-6e36-4739-a510-2640b2051d83","html_url":"https://github.com/koniz-dev/json-formatter","commit_stats":null,"previous_names":["koniz-dev/json-formatter"],"tags_count":null,"template":false,"template_full_name":null,"purl":"pkg:github/koniz-dev/json-formatter","repository_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/koniz-dev%2Fjson-formatter","tags_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/koniz-dev%2Fjson-formatter/tags","releases_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/koniz-dev%2Fjson-formatter/releases","manifests_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/koniz-dev%2Fjson-formatter/manifests","owner_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/owners/koniz-dev","download_url":"https://codeload.github.com/koniz-dev/json-formatter/tar.gz/refs/heads/main","sbom_url":"https://repos.ecosyste.ms/api/v1/hosts/GitHub/repositories/koniz-dev%2Fjson-formatter/sbom","scorecard":null,"host":{"name":"GitHub","url":"https://github.com","kind":"github","repositories_count":286080680,"owners_count":35096187,"icon_url":"https://github.com/github.png","version":null,"created_at":"2022-05-30T11:31:42.601Z","updated_at":"2026-05-26T15:22:16.424Z","status":"online","status_checked_at":"2026-07-03T02:00:05.635Z","response_time":110,"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":"2026-07-03T18:11:19.563Z","updated_at":"2026-07-03T18:11:20.334Z","avatar_url":"https://github.com/koniz-dev.png","language":"JavaScript","funding_links":[],"categories":[],"sub_categories":[],"readme":"# JSON Formatter\n\n\u003cdiv align=\"center\"\u003e\n\n![JSON Formatter](https://img.shields.io/badge/JSON-Formatter-blue?style=for-the-badge\u0026logo=json)\n![License](https://img.shields.io/badge/License-MIT-green?style=for-the-badge)\n![GitHub Pages](https://img.shields.io/badge/Deploy-GitHub%20Pages-brightgreen?style=for-the-badge)\n![Version](https://img.shields.io/badge/Version-1.0.0-orange?style=for-the-badge)\n\n**A professional, fast, and feature-rich JSON formatting tool built with vanilla JavaScript**\n\n[🚀 Live Demo](https://koniz-dev.github.io/json-formatter) • [📖 Documentation](#-features) • [🐛 Report Bug](https://github.com/koniz-dev/json-formatter/issues) • [💡 Request Feature](https://github.com/koniz-dev/json-formatter/issues)\n\n\u003c/div\u003e\n\n---\n\n## 📋 Table of Contents\n\n- [✨ Features](#-features)\n- [🚀 Quick Start](#-quick-start)\n- [🛠️ Usage](#️-usage)\n- [⌨️ Keyboard Shortcuts](#️-keyboard-shortcuts)\n- [🏗️ Architecture](#️-architecture)\n- [🚀 Deployment](#-deployment)\n- [🛠️ Technologies](#️-technologies)\n- [📱 Browser Support](#-browser-support)\n- [🤝 Contributing](#-contributing)\n- [📄 License](#-license)\n\n---\n\n## ✨ Features\n\n### 🎯 Core Functionality\n- **🔄 JSON Formatting** - Convert minified JSON to beautifully formatted, readable code\n- **🔍 JSON Validation** - Real-time syntax validation with detailed error reporting\n- **📦 JSON Minification** - Compress JSON to reduce file size\n- **🎨 Syntax Highlighting** - Color-coded JSON elements for better readability\n- **🔧 Auto-Fix Errors** - Automatically correct common JSON syntax issues\n\n### 🚀 Advanced Features\n- **📋 Clipboard Integration** - One-click copy/paste functionality\n- **💾 File Export** - Download formatted JSON as `.json` files\n- **📁 File Upload** - Upload and process JSON files directly\n- **🔗 URL Loading** - Load JSON data from remote URLs\n- **🌳 Tree View** - Interactive hierarchical view of JSON structure\n- **🔍 Search \u0026 Filter** - Find specific keys or values within JSON\n- **📊 Statistics** - View file size, depth, key count, and array statistics\n- **⚙️ Customizable Options** - Sort keys, multiple indent options, and JSON standards\n- **⌨️ Keyboard Shortcuts** - Power user shortcuts for faster workflow\n- **📱 Responsive Design** - Optimized for desktop, tablet, and mobile devices\n- **🌙 Modern UI** - Clean, professional interface with smooth animations\n\n### 🔧 Developer Features\n- **🚫 No Dependencies** - Pure vanilla JavaScript, no frameworks required\n- **⚡ Fast Performance** - Optimized for large JSON files\n- **🔒 Privacy-First** - All processing happens client-side, no data sent to servers\n- **♿ Accessibility** - WCAG compliant with keyboard navigation support\n- **📏 Multiple JSON Standards** - Support for RFC 8259, RFC 7159, RFC 4627, and ECMA-404\n- **🎯 Flexible Indentation** - 2, 3, 4 spaces or tab indentation options\n\n---\n\n## 🚀 Quick Start\n\n### Option 1: Use Online (Recommended)\nVisit the live application: **[https://koniz-dev.github.io/json-formatter](https://koniz-dev.github.io/json-formatter)**\n\n### Option 2: Run Locally\n```bash\n# Clone the repository\ngit clone https://github.com/koniz-dev/json-formatter.git\ncd json-formatter\n\n# Open in browser (no build process required)\nopen index.html\n# or\npython -m http.server 8000\n# then visit http://localhost:8000\n```\n\n---\n\n## 🛠️ Usage\n\n### Basic JSON Formatting\n1. **Input**: Paste, type, upload, or load JSON from URL\n2. **Format**: Click \"Format JSON\" or press `Ctrl+Enter`\n3. **Output**: View the formatted result with syntax highlighting\n\n### JSON Validation\n1. **Input**: Enter JSON to validate\n2. **Validate**: Click \"Validate\" button\n3. **Result**: See validation status with error details if invalid\n4. **Auto-Fix**: Enable auto-fix to automatically correct common errors\n\n### Input Methods\n- **📝 Manual Input**: Type or paste JSON directly\n- **📁 File Upload**: Click \"Upload File\" to select a `.json` file\n- **🔗 URL Loading**: Click \"Load URL\" to fetch JSON from a remote URL\n- **💡 Example**: Click \"Example\" to load sample JSON data\n\n### Advanced Options\n- **Sort Keys**: Automatically alphabetize object keys\n- **Indentation**: Choose 2, 3, 4 spaces or tab indentation\n- **JSON Standard**: Select from RFC 8259, RFC 7159, RFC 4627, or ECMA-404\n- **Auto-Fix Errors**: Automatically correct common JSON syntax issues\n- **Minify**: Compress JSON to minimal size\n\n### View Options\n- **🌳 Tree View**: Switch to interactive hierarchical view\n- **🔍 Search**: Find specific keys or values within JSON\n- **📊 Statistics**: View file size, depth, key count, and array statistics\n\n### Export Options\n- **Copy**: Copy formatted JSON to clipboard\n- **Download**: Save as `.json` file\n\n---\n\n## ⌨️ Keyboard Shortcuts\n\n| Shortcut | Action | Description |\n|----------|--------|-------------|\n| `Ctrl+Enter` | Format JSON | Format the current input |\n| `Ctrl+K` | Clear All | Clear input and output |\n| `Ctrl+Shift+C` | Copy Result | Copy output to clipboard |\n| `Ctrl+V` | Paste | Paste from clipboard (when input focused) |\n| `Ctrl+U` | Upload File | Open file upload dialog |\n| `Ctrl+L` | Load URL | Open URL loading modal |\n| `Ctrl+F` | Search | Focus search input |\n| `Ctrl+T` | Tree View | Toggle tree view mode |\n| `Ctrl+E` | Example | Load example JSON |\n| `Escape` | Close Modal | Close any open modal |\n\n---\n\n## 🏗️ Architecture\n\n```\njson-formatter/\n├── 📄 index.html          # Main application structure\n├── 🎨 styles.css          # Responsive styling and animations\n├── ⚡ script.js           # Core application logic\n├── 📖 README.md           # Project documentation\n├── 📄 LICENSE             # MIT License\n├── 🚫 .gitignore          # Git ignore rules\n└── 🖼️ favicon/            # Favicon assets\n    ├── favicon.ico\n    ├── favicon-16x16.png\n    ├── favicon-32x32.png\n    ├── apple-touch-icon.png\n    └── site.webmanifest\n```\n\n### Key Components\n\n- **JSONFormatter Class**: Main application controller with comprehensive functionality\n- **Syntax Highlighter**: Custom JSON syntax highlighting engine\n- **Error Handler**: Comprehensive error reporting system with auto-fix capabilities\n- **Clipboard Manager**: Cross-browser clipboard integration\n- **File Exporter**: Client-side file download functionality\n- **URL Loader**: Remote JSON fetching with CORS handling\n- **File Upload Handler**: Local file processing and validation\n- **Tree View Renderer**: Interactive hierarchical JSON visualization\n- **Search Engine**: Real-time JSON content search and filtering\n- **Statistics Calculator**: JSON structure analysis and metrics\n- **Modal Manager**: User interface modal handling\n- **Toast Notification System**: User feedback and status messages\n\n---\n\n## 🚀 Deployment\n\n### GitHub Pages (Current)\nThis project is automatically deployed to GitHub Pages:\n\n1. **Repository**: [koniz-dev/json-formatter](https://github.com/koniz-dev/json-formatter)\n2. **Live URL**: [https://koniz-dev.github.io/json-formatter](https://koniz-dev.github.io/json-formatter)\n3. **Auto-deploy**: Updates automatically on every push to `main` branch\n\n### Custom Deployment\nDeploy to any static hosting service:\n\n```bash\n# Build (no build process needed - just copy files)\ncp -r . /path/to/web/server/\n\n# Or use with any static site generator\n# Files are ready for Netlify, Vercel, AWS S3, etc.\n```\n\n---\n\n## 🛠️ Technologies\n\n### Core Technologies\n- **HTML5** - Semantic markup and modern web standards\n- **CSS3** - Advanced styling with Flexbox, Grid, and animations\n- **Vanilla JavaScript (ES6+)** - Modern JavaScript without frameworks\n- **Web APIs** - Clipboard API, File API, Blob API, and Fetch API\n\n### External Resources\n- **Google Fonts** - Inter font family for typography\n- **Font Awesome 6.0** - Professional icon set via CDN\n- **CSS Gradients** - Modern visual design\n- **Web App Manifest** - PWA capabilities\n\n### Performance Optimizations\n- **Debounced Input** - Optimized real-time validation and search\n- **Efficient Parsing** - Fast JSON processing with error recovery\n- **Minimal DOM Manipulation** - Smooth user experience\n- **Event Delegation** - Optimized event handling\n- **Lazy Loading** - Resources loaded on demand\n- **Memory Management** - Efficient tree view rendering\n- **Caching** - Smart caching for URL-loaded content\n\n### Browser APIs Used\n- **Clipboard API** - Copy/paste functionality\n- **File API** - File upload and processing\n- **Blob API** - File download generation\n- **Fetch API** - Remote JSON loading\n- **URL API** - URL validation and processing\n- **History API** - Browser history management\n\n---\n\n## 📱 Browser Support\n\n| Browser | Version | Support |\n|---------|---------|---------|\n| Chrome | 60+ | ✅ Full Support |\n| Firefox | 55+ | ✅ Full Support |\n| Safari | 12+ | ✅ Full Support |\n| Edge | 79+ | ✅ Full Support |\n| IE | 11+ | ⚠️ Limited Support |\n\n### Feature Support\n- **Clipboard API**: Modern browsers only (Chrome 66+, Firefox 63+, Safari 13.1+)\n- **File Download**: All supported browsers\n- **File Upload**: All supported browsers\n- **URL Loading**: All supported browsers (with CORS support)\n- **JSON Parsing**: Universal support\n- **Tree View**: All supported browsers\n- **Search \u0026 Filter**: All supported browsers\n- **Statistics**: All supported browsers\n\n---\n\n## 🤝 Contributing\n\nWe welcome contributions! Here's how you can help:\n\n### 🐛 Bug Reports\n1. Check existing [issues](https://github.com/koniz-dev/json-formatter/issues)\n2. Create a new issue with detailed description\n3. Include browser version and steps to reproduce\n\n### 💡 Feature Requests\n1. Open an [issue](https://github.com/koniz-dev/json-formatter/issues)\n2. Describe the feature and its benefits\n3. Use the \"enhancement\" label\n\n### 🔧 Code Contributions\n1. Fork the repository\n2. Create a feature branch: `git checkout -b feature/amazing-feature`\n3. Make your changes\n4. Test thoroughly\n5. Commit: `git commit -m 'Add amazing feature'`\n6. Push: `git push origin feature/amazing-feature`\n7. Open a Pull Request\n\n### 📋 Development Guidelines\n- Follow existing code style\n- Add comments for complex logic\n- Test on multiple browsers\n- Ensure responsive design\n- Update documentation if needed\n\n---\n\n## 📄 License\n\nThis project is licensed under the MIT License - see the [LICENSE](LICENSE) file for details.\n\n---\n\n\u003cdiv align=\"center\"\u003e\n\n**⭐ If you found this project helpful, please give it a star!**\n\n[⬆ Back to Top](#json-formatter)\n\n\u003c/div\u003e","project_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkoniz-dev%2Fjson-formatter","html_url":"https://awesome.ecosyste.ms/projects/github.com%2Fkoniz-dev%2Fjson-formatter","lists_url":"https://awesome.ecosyste.ms/api/v1/projects/github.com%2Fkoniz-dev%2Fjson-formatter/lists"}