https://jsokit.com/blog/tags/react/ Recent content in React on JsonKit Blog Hugo en © 2025 JsonKit Mon, 16 Mar 2026 20:07:38 +0000 https://jsokit.com/blog/posts/linux-df-command-deep-dive-from-disk-space-monitoring-to-inode-exhaustion-troubleshooting/ Mon, 16 Mar 2026 20:07:38 +0000 https://jsokit.com/blog/posts/linux-df-command-deep-dive-from-disk-space-monitoring-to-inode-exhaustion-troubleshooting/ Linux df Command Deep Dive: From Disk Space Monitoring to inode Exhaustion Troubleshooting Server disk full, SSH login fails with No space left on device. First reaction: df -h. But sometimes there’s still space showing, yet errors persist—that’s inode exhaustion. After diving deep into the df command, I found this seemingly simple tool hides quite a few intricacies. df’s Underlying Implementation: statvfs System Call The core data of df comes from the statvfs() system call, which returns filesystem statistics: https://jsokit.com/blog/posts/json-tree-editor-recursive-rendering-and-two-way-sync/ Mon, 09 Mar 2026 17:57:52 +0000 https://jsokit.com/blog/posts/json-tree-editor-recursive-rendering-and-two-way-sync/ JSON Tree Editor: Recursive Rendering and Two-Way Sync Working with complex JSON data recently, plain text editing wasn’t cutting it. I needed a visual tree editor where I could add, delete, and modify nodes directly. So I built one. Here’s the core approach. Data Model for Tree Structure Converting JSON to a tree requires a unified node model: interface TreeNode { id: string // Unique identifier (React key + node lookup) key: string // Key name value: any // Value (primitive stored directly, object/array as reference) type: 'object' | 'array' | 'string' | 'number' | 'boolean' | 'null' children? https://jsokit.com/blog/posts/building-an-icon-library-tool-from-lucide-react-to-search-filtering/ Thu, 19 Feb 2026 11:31:12 +0000 https://jsokit.com/blog/posts/building-an-icon-library-tool-from-lucide-react-to-search-filtering/ Building an Icon Library Tool: From Lucide React to Search Filtering Managing icons in frontend projects is always a hassle. Designers send a bunch of SVGs, developers manually import, name, and wrap them. Recently discovered Lucide React, a clean icon library with simple API and high-quality icons. Built an online icon library tool and documented the implementation approach. Lucide React’s Design Philosophy Lucide is a community-maintained fork of Feather Icons with consistent style and clean lines.