Live data from Hacker News

Show HN: JSON Browse – Fetch, filter and manipulate your JSON inside the browser

jsonbrowse.com

21–28 of 28 posts

Re: Show HN: JSON Browse – Fetch, filter and manipulate your JSON inside the browser

#21
post #19
post #16

I think the most useful feature here is JSON -> JS conversion. Relatively often I find myself copying and pasting some JSON into a JS file then manually deleting / regexing away the unnecessary quote marks around key names.

strange, I always put quote marks, as I see them as totally necessary. Not in the browser, obviously, but in my mind. It helps me recording those are strings, not variables. I made too many mistakes in the likes of var foo = "bar"; var baz = { foo: "qux" };

This bites especially often if you are steadily switching between JavaScript and a server-side language where that code actually does what you expect (e.g. Python).

Re: Show HN: JSON Browse – Fetch, filter and manipulate your JSON inside the browser

#23

Chrome devtools? I feel the collapsed tree visualization of parsed JSON is already sufficient. I'll just access the API I need within the authentication context of my app. Anything I would want to do with the JSON data is directly available in the devtools console. It has the added benefit of copying/pasting rough code I write in the console into my IDE to continue the work.

That gets you decently far, especially with small JSON responses. You can't filter with any tree display though, which is what I normally reach to jq for. Being able to filter an array of objects down to only one property in each object is invaluable to me. For example, in a JSON payload that has an array of 15 objects, I would like to see all IDs of those objects. The output would be something like [1230, 134, 65, 9…

write a quick lodash method call to filter your collection.

given the consistent nature of data collections I almost never have a need to examine the full dataset via some front end debugging tool. trust the data to be consistent or not?

Re: Show HN: JSON Browse – Fetch, filter and manipulate your JSON inside the browser

#24
post #19
post #16

I think the most useful feature here is JSON -> JS conversion. Relatively often I find myself copying and pasting some JSON into a JS file then manually deleting / regexing away the unnecessary quote marks around key names.

strange, I always put quote marks, as I see them as totally necessary. Not in the browser, obviously, but in my mind. It helps me recording those are strings, not variables. I made too many mistakes in the likes of var foo = "bar"; var baz = { foo: "qux" };

I assume you mean you mistakenly expect baz to equal:

    {
        bar: "qux"
    }
?

Don't you use syntax highlighting? I can't imagine this ever being an issue...

Re: Show HN: JSON Browse – Fetch, filter and manipulate your JSON inside the browser

#25
post #16

I think the most useful feature here is JSON -> JS conversion. Relatively often I find myself copying and pasting some JSON into a JS file then manually deleting / regexing away the unnecessary quote marks around key names.

Other than being idiomatic, is there any advantage to quoting or not quoting key names in JS?

Minor reasons but a) it looks untidy (to me), and b) for example if I want to change:

    foo = {
        "bar": true,
        "baz": false
    }
to:

    foo.bar = true;
    foo.baz = false;
then I have extra quotes to delete. Those half seconds add up over a year!

I guess you could argue the opposite though, that this looks messy:

    let headers = {
        Expires: 0,
        'Content-Type': 'application/json'
    }
Which leads me to believe it's a matter of personal preference, and you should just pick one and stick to it :) And look, there's even an eslint rule for it: http://eslint.org/docs/rules/quote-props

Re: Show HN: JSON Browse – Fetch, filter and manipulate your JSON inside the browser

#26
post #22

I'm colour-blind, and Firefox the text in the console is completely unreadable to me. The Firefox console background is grey (I think), while the text is blue or purple (I think) and I can't make it out against the background.

Just wondering but are you aware that you can change the color scheme of the development tools? Changing the scheme also updates the colors of the console. There's at least 3 themes available as options, not sure if this helps, hoping it does.

Re: Show HN: JSON Browse – Fetch, filter and manipulate your JSON inside the browser

#28

Earlier quoted context omitted.

That gets you decently far, especially with small JSON responses. You can't filter with any tree display though, which is what I normally reach to jq for. Being able to filter an array of objects down to only one property in each object is invaluable to me. For example, in a JSON payload that has an array of 15 objects, I would like to see all IDs of those objects. The output would be something like [1230, 134, 65, 9…

write a quick lodash method call to filter your collection. given the consistent nature of data collections I almost never have a need to examine the full dataset via some front end debugging tool. trust the data to be consistent or not?

Definitely do whatever you think is easier in your workflow. Not everyone uses lodash, but I know a lot of people that prefer to do mapping / filtering of JSON in an actual programming language. That doesn't make one way better or worse than another. 2 ways of accomplishing the same thing.

Not sure what the point about consistency has to do with anything? What if it's an array of consistent, but large objects?

I find I need to examine a full page of JSON quite frequently. I.e. there's some bug, and I need to check for any occurrences of null for a specific property.

Post reply on HN