DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’»

DEV Community πŸ‘©β€πŸ’»πŸ‘¨β€πŸ’» is a community of 968,547 amazing developers

We're a place where coders share, stay up-to-date and grow their careers.

Create account Log in
Cover image for Prettify JSON with IntelliJ scratch files!
scottshipp
scottshipp

Posted on

Prettify JSON with IntelliJ scratch files!

If you develop web services and you're an IntelliJ IDEA user, then here's a simple tip that can save some time.

Let's say you have an ugly JSON response that came from a log, the output from a cURL command, or elsewhere.

It might look something like this example response from jsonapi.org:

{ "data": [{ "type": "articles", "id": "1", "attributes": { "title": "JSON:API paints my bikeshed!", "body": "The shortest article. Ever.", "created": "2015-05-22T14:56:29.000Z", "updated": "2015-05-22T14:56:28.000Z" }, "relationships": { "author": { "data": {"id": "42", "type": "people"} } } }], "included": [ { "type": "people", "id": "42", "attributes": { "name": "John", "age": 80, "gender": "male" } } ] }
Enter fullscreen mode Exit fullscreen mode

Try these steps:

  1. Copy it.
  2. Open IntelliJ.
  3. Go to File > New > Scratch file... or use the shortcut key Shift + Command (Apple) + N.
  4. Choose "JSON" (hint: you can type "json").
  5. Paste.
  6. Go to Code > Reformat code or use the shortcut key Alt + Option + L.

Note: The above shortcut keys are for macOS. Review the IntelliJ Keymap reference for the corresponding shortcuts in your operating system.

The result will now be that you have nicely-formatted / prettified JSON:

{
  "data": [
    {
      "type": "articles",
      "id": "1",
      "attributes": {
        "title": "JSON:API paints my bikeshed!",
        "body": "The shortest article. Ever.",
        "created": "2015-05-22T14:56:29.000Z",
        "updated": "2015-05-22T14:56:28.000Z"
      },
      "relationships": {
        "author": {
          "data": {
            "id": "42",
            "type": "people"
          }
        }
      }
    }
  ],
  "included": [
    {
      "type": "people",
      "id": "42",
      "attributes": {
        "name": "John",
        "age": 80,
        "gender": "male"
      }
    }
  ]
}
Enter fullscreen mode Exit fullscreen mode

And that can help a lot with your dev and support tasks! πŸ‘

Top comments (1)

Collapse
 
acrossoffwest profile image
Yurij Karpov

Alt + Option + L, intead of Alt there should be Cmd? Cmd + Option + L

🌚 Friends don't let friends browse without dark mode.

Sorry, it's true.