Toolsy
Back to blog

Tech

CSV to JSON for API mocks and test fixtures

11 min read

You export a CSV from a spreadsheet, then need JSON for an API mock, a Storybook story, or a fixtures/users.json file in your repo. Manual typing does not scale past ten rows. A converter turns the header row into object keys and each line into one JSON object. Toolsy CSV to JSON runs in the browser: paste or upload, preview, download. US search volume for "csv to json" sits near 2,400 monthly queries, mostly developers and analysts who already know both formats. This guide focuses on mock data and fixtures, not on reversing JSON back to CSV.

Why CSV still feeds API mocks

Product and design teams live in spreadsheets. PMs tweak columns in Google Sheets; support exports ticket samples from a BI tool. Backends speak JSON. The handoff is almost always CSV because Excel is the lowest-friction editor for non-developers.

Mocks and fixtures need stable shapes: same keys on every object, predictable types, IDs that do not collide when tests run in parallel. CSV is a fine authoring surface if you clean types and hidden characters before conversion. Skip the converter when you only have three rows; type those by hand.

Prepare the CSV before you convert

Garbage columns become garbage keys. One extra semicolon in a header becomes a key nobody's TypeScript interface expects.

Put field names on row 1. Use snake_case or camelCase consistently; do not mix user_id and UserName in one sheet. Remove total rows and blank lines at the bottom. Excel "grand total" rows become nonsense JSON objects with empty keys.

Quote fields that contain commas. If a cell holds Acme, Inc., the CSV line needs quotes or the split breaks. Export UTF-8 from Sheets or Excel. BOM and smart quotes cause import pain; see Invisible characters breaking your CSV imports. Before you merge sheets into one fixture file, follow Data cleaning before you merge CSV files.

Headers, types, and nulls

Decide how empty cells should appear. JSON null, empty string "", or omit the key entirely. Most online converters emit empty strings unless you edit after download. For mocks, empty string is usually fine; for strict APIs, search-replace "" to null in your editor.

Keep IDs as strings when they have leading zeros ("0042"). Spreadsheets strip leading zeros on numeric columns. Format ID columns as text before export.

Trim invisible characters early

Copy-paste from Slack, Notion, or Word drags zero-width spaces and non-breaking spaces into cells. Columns look aligned in Excel but fail in JSON parsers. Run suspicious sheets through Hidden Characters on header cells before CSV export, or clean after conversion if keys look duplicated.

Walkthrough: CSV to JSON for a mock API

Imagine a /api/users mock with id, name, email, and role. Ten rows are enough for Storybook and Jest.

  1. Build the sheet with text-formatted id column.
  2. Export CSV (UTF-8).
  3. Open CSV to JSON, paste or upload.
  4. Confirm the preview shows an array of objects, not nested chaos.
  5. Download users.json into src/mocks/ or __fixtures__/.
  6. Wire the mock server or MSW handler to read that file.

Check one object by hand. Emails should be strings. Roles should match your enum ("admin" | "member"). Fix the sheet and re-export if a number column became a float.

Array of objects vs other shapes

Most mocks want [{...}, {...}]. Some tools emit { "data": [...] } wrappers when you configure an API envelope. Toolsy's converter targets the flat array case common in fixtures. Wrap in { "data": yourArray } manually when your OpenAPI spec demands it.

Large files and repo hygiene

Thousand-row exports belong in git-lfs or a generated script, not in a PR as a static fixture. Trim mocks to the smallest set that exercises your UI states: empty list, one row, pagination boundary, error role.

Commit .json with pretty-print when humans review diffs. Minify in build steps if size matters.

Code paths when the browser is not enough

"Python csv to json" and "csv to json javascript" searches reflect repeatable pipelines. Use code when CSV arrives nightly from a warehouse, not when a designer hands you twelve rows once.

Python and Node one-offs

Python's csv.DictReader and Node csv-parse read headers into objects. Pin the script in scripts/csv-to-fixtures.py when the same export repeats every sprint. Keep the browser converter for ad hoc PM sheets.

npm packages in CI

csvtojson and similar packages fit build steps. Validate schema with Zod or JSON Schema after conversion so bad rows fail CI instead of production mocks.

IDs, UUIDs, and referential mocks

Mocks with foreign keys need consistent IDs across files. orders.csv must reference user_id values that exist in users.json.

When you need version-7 time-sortable IDs versus random v4, read UUID v4 vs v7 for databases and APIs. Spreadsheet =UUID() functions differ by platform; paste final strings as text before export.

Validate JSON before you ship

Run jq . users.json or your IDE formatter. Invalid JSON usually means an unescaped quote inside a cell. Fix the CSV, do not hand-edit fifty lines unless you enjoy merge conflicts.

In TypeScript projects, import the fixture and type it:

import users from "./users.json";
const first = users[0];
// first.email should match your User type

Mismatch catches bad keys early. Pair with API contract tests when mocks must mirror production.

Limits and when not to use online conversion

Browser conversion fits fixtures under a few thousand rows and no regulated data. Do not upload customer PII or production database dumps to test a public converter. Anonymize names and emails (user1@example.com) in the sheet first.

Secrets do not belong in CSV mocks. Use env vars for tokens. CSV is a terrible place for API keys even before JSON conversion.

When columns shift mysteriously, stop and read Invisible characters breaking your CSV imports before you blame the JSON tool.

Frequently asked questions

How do I convert CSV to JSON for an API mock?

Export UTF-8 CSV with headers on row 1, upload to CSV to JSON, download the array, and place it in your mocks or fixtures folder. Wire your mock server or MSW to return that file. Re-run when the sheet changes.

Does the first row become JSON keys?

Yes on standard converters. Each header cell becomes a property name on every object. Rename headers in the sheet before export if you need camelCase in code but Snake Case in the PM's view.

Can I convert CSV to JSON online without installing anything?

Yes. Paste into the browser tool when clipboard size allows. Large files upload directly. For recurring automation, add a script in your repo instead.

Why does my JSON have extra keys or broken columns?

Usually unquoted commas in cells, wrong delimiter, or invisible characters in headers. Open the CSV in a plain text editor and inspect line 1. Clean with Hidden Characters if keys look duplicated.

Should fixtures use an array or an object wrapper?

Match your real API. REST list endpoints often return { "data": [...], "page": 1 }. Wrap the downloaded array manually or in a one-line script. Storybook props often want the bare array.

How do I handle numbers and booleans in CSV mocks?

Spreadsheets type everything as strings unless you format columns. JSON from converters may quote numbers as strings. Cast in code or format columns as numbers in Excel before export when types matter.

Is csv to json the same as json to csv?

No. Reverse direction serves exports and reporting. This article covers spreadsheet → JSON for mocks only. Use the appropriate tool direction for your job.

Can I use CSV to JSON in Excel or Google Sheets?

Formulas and Apps Script can emit JSON, but maintenance is painful for nested data. Export CSV and convert for one-off mocks. Script only when the sheet is the source of truth forever.

What is the best way to mock APIs with realistic data?

Start from a sanitized sample export, convert to JSON, trim to ten representative rows, and version the file in git. Add edge-case rows (empty name, long email) by editing the sheet, not by hand-typing JSON.

Where do UUIDs fit in CSV fixtures?

Generate UUIDs as text in the sheet, export, convert, and keep the same IDs across related fixture files. See UUID v4 vs v7 for databases and APIs when sort order in tests matters.

Open CSV to JSON with your sheet ready. If imports still break, check Invisible characters breaking your CSV imports. When you need the reverse path for analysts, see JSON to CSV for Excel users. For Excel date traps after export, see CSV to Excel without broken dates.

Convert CSV to JSON online

Paste or upload a CSV and download a JSON array. Headers become keys. Fix invisible characters before import if columns shift.

Convert CSV to JSON
Share this article

More to read

CSV to JSON for API mocks and test fixtures — Toolsy