A beágyazott JSON konvertálása HTML táblázattá - React, Javascript

Egy egyszerű reakciókomponens bármely beágyazott JSON-objektum vagy tömb HTML-táblává konvertálásához.

Ehhez a megvalósításhoz létrehozunk egy egyszerű komponenst a React-ben, amely minden beágyazott JSON-objektumot HTML-táblává alakít át. A bootstrap osztályokat használtam a táblázat megjelenítésére ebben a példában. De a beállítást minimális szinten tartják, hogy az igényeinek megfelelően változtathasson.

Munka közben számos adminisztrációs panelt fejlesztünk vállalati megoldásainkhoz. Az adminisztrációs panel létrehozásakor az egyik kérdés az adatok SQL-ből történő renderelése a HTML-adatbázisokba. Mivel nehezen fér el az összes információ egy táblázatsoron belül és több oszlop vízszintesen elosztva, a fejlesztők kibővíthető sorok segítségével további információkat jelenítenek meg, és/vagy külön részlet-oldalt hoznak létre, amely az entitás teljes információit mutatja.

Természetesen olyan keretekkel, mint a Laravel, a Blade fantasztikus. Akkor is hasznosnak találja ezt a JS alapú HTML táblák konvertálásához.

Az interneten nem sok megoldás áll rendelkezésre, amely zökkenőmentesen konvertálhatja a JSON-t HTML-táblává. Néhány létező nyílt forráskódú program nem működik jól a könyvtárakkal, például a next.js-sel, hogy hogyan kezelték a globális cs-fájlokat. Ezért meg akartam osztani egy egyszerű Codepen megvalósítást egy minta számára.