Graph

Visual Graph is the most advanced and unique part of GraphQL Editor. It allows you to:

• explore huge schemas and onboard them very fast
• generate complex GraphQL queries in a visual way
• get a comprehensive overview of your schema
• make sure that everything is always up to date
• Share your visual GraphQL with other developers
• and much more!

As in every part of this docs, we attach a video, but if you prefer you can read about them underneath

Relation View

Here you can see connected nodes as a visual Graph. It is a great way to understand how your GraphQL schema is connected. You can also easily find out which fields are linked to each other, and which parts of the schema are related to which.

View options

GraphQL Editor offers many different view options. You can:

• show and hide particular nodes
• focus a node to see only the node and the nodes related directly or indirectly to the selected node.
• navigate through the relationship cosmos
• export node relations as PNG
• zoom in and out

GraphQL Schema Creator

As part of our cool visualizer, you get also a schema creator tool that works like a block builder but for GraphQL. Besides being a visual schema builder it also gets some jobs done for you like:

• automatically bind interfaces to the implementing types/interfaces not to repeat yourself when editing/creating/deleting GraphQL interfaces
• create inputs from types
• duplicate certain nodes
• autocomplete from only available types
• mark external nodes

GraphQL As a Documentation

Display every GraphQL Node as GraphQL Docs with markdown language enabled. Edit them directly in docs of GraphQL Editor

Markdown formatted supports:

• Links
• Images
• Table
• Syntax Highlighting
• Headers
• Lists
• Code blocks

It is really handy for developers to have an overview of the schema. It's especially useful for onboarding new members to the team.

Schema Import

Sometimes you don't want to start schema from scratch. For those cases, GraphQL Editor offers an import tool. With it, you can upload existing GraphQL schema from a file or a URL. You can also use it to import GraphQL nodes that were created in GraphQL Editor. This way, you can keep your schema up to date and make sure that all new changes are reflected in the GraphQL Editor.

Online GraphQL IDE

We do provide code editor experience for each schema. It supports GraphQL syntax highlighting, autocomplete, code folding, and more:

• sync with Relation View cursor follows selected node in a graph
• sync with code every time you move the code cursor the graph travels in XY space

You can also see real-time auto-suggestions for fields and types. I

So, if you want to edit your schema or write a query, GraphQL Editor is the perfect place for you. It is fast and user-friendly, and it will make your workflow much easier.