Format JSON with dart

JSON data can sometimes be hard to read when it's all on one line. Making it look nice with proper spacing and line breaks, also known as pretty printing, makes working with JSON much simpler.

Why Pretty Print JSON?

Reading unformatted JSON can be a headache, especially for complex data. Pretty printing helps you quickly understand the structure and find the information you need.

How to Make JSON Readable

Dart provides a simple way to format JSON strings using the dart:convert library. You just need to use the JsonEncoder.withIndent constructor.

The Code You Need

Here's the code snippet that does the magic:

import 'dart:convert';

// Your unformatted JSON data (replace with your actual data)
var data = {
  'name': 'John Doe',
  'age': 30,
  'isStudent': false,
  'courses': ['Math', 'Science']
};

// Create an encoder with an indent (using two spaces here)
var encoder = const JsonEncoder.withIndent('  ');

// Convert your data to a pretty-printed JSON string
String prettyprint = encoder.convert(data);

// Now 'prettyprint' holds the nicely formatted JSON string
print(prettyprint);

Breaking Down the Steps

import 'dart:convert';: This line brings in the necessary tools for working with JSON.
var encoder = const JsonEncoder.withIndent(' ');: We create a JsonEncoder that knows how to add indents. We tell it to use two spaces for each level of indentation. You can use tabs (\t) or other strings too.
String prettyprint = encoder.convert(data);: This line takes your JSON data (data, which can be a Map or List) and turns it into a nicely formatted JSON string using the encoder we set up.

That's it! Now you have a clean, easy-to-read JSON string.

Save 3 months of work

Create your app using our 6 years of making Flutter apps and more than 50+ apps

Frequently Asked Questions

Why should I pretty print JSON?

Pretty printing makes JSON data easier to read and understand by adding line breaks and indentation. This is very helpful when debugging or inspecting data.

What package do I need to format JSON in Dart?

You need to import the built-in `dart:convert` library.

How do I add indentation?

You use `JsonEncoder.withIndent()` and provide the string you want to use for indentation, like `' '` for two spaces or `' '` for a tab.

Can I pretty print a JSON string instead of a Map or List?

Yes, but you would first need to decode the JSON string into a Dart object (like a Map or List) using `jsonDecode()`, and then encode the object back into a string using the indented `JsonEncoder`.