
Show HN: JSON Browse – Fetch, filter and manipulate your JSON inside the browser - jorde
https://jsonbrowse.com/
======
nacs
Looks like the HN effect is happening already -- the "Demo" link to Github
shows this:

    
    
      {
        "message": "API rate limit exceeded for 52.53.190.53. (But here's the good news: Authenticated requests get a higher rate limit. Check out the documentation for more details.)",
        "documentation_url": "https://developer.github.com/v3/#rate-limiting"
      }

------
GordonS
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.

~~~
giancarlostoro
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.

------
jordache
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.

~~~
amw-zero
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, 99]. I like looking at that vs scrolling and collapsing a bunch of
objects.

~~~
jordache
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?

~~~
amw-zero
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.

------
snug
Pretty cool, but there should be a warning not to enter in API credentials
(through the URI) on this page, as the request is proxied to jsonbrowse.com

~~~
bloated_brain
That's fair. CORS is a bitch.

~~~
jorde
YEs, CORS is the reason for this and the code for this proxy is open source
and very simple[0]. I didn't want to add disclaimers to clutter the UI nor did
I wanted to build a browser extension as it would suffer from same trust
issues (you still need to trust the extension developer).

For full transparency, the proxy is hosted on Zeit's `now` service and I don't
even have access to logs so accidental leaks should be pretty safe.

[0] [https://github.com/jorilallo/jsonbrowse-
proxy](https://github.com/jorilallo/jsonbrowse-proxy)

~~~
dvcc
By the looks of it, I could just throw at it some response that is massive and
it would still attempt to grab it?

If this is really being just run as a proxy setup, the jsonbrowse-proxy might
not need the isomorphic-fetch lib, in which case you can just use the embedded
node-fetch instead, which has max response size and timeout options available.

------
dpedu
I wrote a similar tool awhile ago, though it runs on the command line.

[https://github.com/dpedu2/sless](https://github.com/dpedu2/sless)

It's intended for reading structure logs - a file containing json objects
separated by newlines.

~~~
jorde
This is really impressive. Another good JSON tool that I would recommend is jq
which has been on HN a few times:
[https://stedolan.github.io/jq/](https://stedolan.github.io/jq/)

------
mjmasn
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.

~~~
_ZeD_
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"
        };

~~~
vog
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).

------
travelton
Updated my jsonlint.com bookmark to jsonbrowse.com. Thanks for the nifty tool!

~~~
donpdonp
same. i use jsonlint all the time to pretty-print json, but this is
faster/easier and a filter language too!

------
ssreeniv
Nice tool

Suggestion : Filtering seems to work only on object keys at the outermost
level (e.g full_name in demo). It would be nice to be able to filter inner
keys as well (e.g html_url in demo)

------
PretzelFisch
why would I use this over something like postman or RESTClient?

~~~
jorde
JSON Browse is like a glorified JSON prettifier with some `jq` style filtering
features and not really a REST client even though it features remote fetching
for convenience.

