Technology Apr 21, 2026 · 2 min read

Gnoke flatJSON — My JSON detection logic is now a library you can use.

Gnoke-flatjson ⚠️ Users would import a JSON file and the table would either crash, show [object Object] in cells, or worse — silently drop entire columns without warning. The problem wasn't the table renderer. It was that JSON has no single shape. An API response looks like this:...

DE
DEV Community
by Ekong Ikpe
Gnoke flatJSON — My JSON detection logic is now a library you can use.

Gnoke-flatjson

⚠️ Users would import a JSON file and the table would either crash, show [object Object] in cells, or worse — silently drop entire columns without warning.

The problem wasn't the table renderer. It was that JSON has no single shape.

An API response looks like this:

[{ "name": "Alice", "age": 30 }]

A database export looks like this:

{ "people": [["name","age"], ["Alice", 30]] }

A spreadsheet export looks like this:

[["name","age"], ["Alice", 30]]

They all mean the same thing. But every shape needs different handling.

🔧 So I wrote a normalizer — a function that accepts any of these shapes and always returns the same thing:

{
  headers: ["name", "age"],
  rows: [["Alice", "30"]]
}

Over time it grew to handle 8 formats: silent column drops, [object Object] cells, broken row ordering on mixed arrays — all handled at the normalization layer, before any renderer ever sees the data.

Eventually I realised — this logic deserves its own home.

So I extracted it.

📦 Meet gnoke-flatjson

One function. Any JSON in. Clean { headers, rows } out.

npm install gnoke-flatjson
const flatJson = require('gnoke-flatjson');

const result = flatJson(data);
// result.headers — column names
// result.rows    — all cells as strings

Or drop it straight into any HTML file — no npm needed:

<script src="https://cdn.jsdelivr.net/gh/edmundsparrow/gnoke-flatjson/index.js"></script>

🗂️ What it handles

Input shape Example
Array of objects [{ name: "Alice" }]
Array of arrays [["name"],["Alice"]]
Entity-wrapped { "people": [["name"],["Alice"]] }
Explicit headers/rows { headers:[], rows:[[]] }
Single object { name: "Alice" }
Array of primitives ["Alice","Bob"]
Inconsistent keys Missing keys become empty strings, no columns dropped
Nested objects Stringified as JSON instead of [object Object]

🔗 Try it live

There's a demo page where you can paste any JSON and see the result instantly — including a rendered table.

👉 edmundsparrow.github.io/gnoke-flatjson

✂️ The utility was born from a real app solving a real problem. Gnoke DataForge was the inspiration.

Zero dependencies. MIT licensed. 68 lines.

— Edmund Sparrow, Gnoke Suite

DE
Source

This article was originally published by DEV Community and written by Ekong Ikpe.

Read original article on DEV Community
Back to Discover

Reading List