Is there a way to provide visual diagram (UML like) of GraphQL Schema design?
Background: I already have a schema design with me, which is to be converted into GraphQL API. However, before starting GraphQL development, I want to create visual representation of schema that I have. Diagram should essentially show atleast Query Types and Relations, which will help developer knowing what to develop in GraphQL.
Is there a way or standards?
All you need to do is go to and load your schema from URL (you can also build a new schema (use code or visual editor)as below and ... ... and that's it! If you have provided editor a valid schema it will automatically turn its code into a visual graph.
With GraphQL, you model your business domain as a graph by defining a schema; within your schema, you define different types of nodes and how they connect/relate to one another. On the client, this creates a pattern similar to Object-Oriented Programming: types that reference other types.
Your GraphQL server uses a schema to describe the shape of your available data. This schema defines a hierarchy of types with fields that are populated from your back-end data stores. The schema also specifies exactly which queries and mutations are available for clients to execute.
Check out this tool: https://github.com/sheerun/graphqlviz
In my experience using it on real-world GraphQL schemas the output can get really large but I think it may do what you are asking for.
Hope this helps!
Moon Modeler supports visual definition of GraphQL Schema, incl. types, interfaces, enums, inputs and relations.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With