Write a GraphQL Schema in JavaScript

Share this video with your friends

Send Tweet

Writing out a GraphQL Schema in the common GraphQL Language can work for simple GraphQL Schemas, but as our application grows, or when we start using more complex types like interfaces or unions, we find that we can’t use a GraphQL Language file in the same way as before. In this video, we’ll learn how to translate a GraphQL Schema written in GraphQL into a GraphQL Schema written in JavaScript.

p4bloch
p4bloch
~ 8 years ago

Could you please elaborate a bit on why using JS to describe your schema is better than using GraphQL Language directly? Interfaces and Unions can also be defined using the QL. Thanks!

Josh Black
Josh Black(instructor)
~ 8 years ago

That's a great question, and I think the answer is that it's not necessarily better. It most likely depends on your use-case, whether or not you're starting a product/service from scratch or not, and how much control you need in resolvers.

I think a key constraint of GraphQL JS is that the buildSchema utility will not let you define proper resolvers for Union/Interface types that you define in the GraphQL Language. There are definitely ways around this limitation, and Apollo is doing a great job of demonstrating that. In Apollo-related projects they actually have you define your schema in the GraphQL Language, and then you define the resolvers separately, much like you described above.

I think this approach is awesome, and can make things incredibly simple to get up and running so if that's what you want to do definitely go for it. From another perspective, if you're creating a GraphQL Schema and you want to implement a middleware-esque pattern on resolvers then you might want more fine-grained control of your schema. You might also want to leverage existing JS-tools that you have, such as codemods, in order to maintain your codebase and bring it along with you as your product/service/company grows.

At a high level, I think that covers why you might want to use one or the other. I think they're both great strategies, and one can make whichever approach they choose work for their use case. Hope that helps!

p4bloch
p4bloch
~ 8 years ago

Thanks for such a detailed response, you surely cleared out some doubts I had. I indeed used Apollo's graphql-tools's makeExecutableSchema function. I believe graphql-tools as a project itself is intended to be used without having to use the rest of Apollo server's middlewares so maybe it is useful as a mere replacement of buildSchema as well.

I definitely were not aware of buildSchema's limitations, thanks for pointing that out.

I understand that in a complex application you might want to have the schema be more malleable than just strings, but I wonder how far you can actually get without it. Definitely the GraphQL JS limitations are a quick deal breaker (maybe because of its reference implementation nature?), but Apollo seems to be doing a much better job on making GraphQL production ready tools for Javascript.

Ultimately I would expect not having to worry about how the schema is defined (and use the much clearer and generic GraphQL notation) but instead having the resolvers layer to be able to handle any complexity that may arise beyond that schema.

Thanks for the course Josh, a very valuable GraphQL resource :)

Josh Black
Josh Black(instructor)
~ 8 years ago

Ultimately I would expect not having to worry about how the schema is defined (and use the much clearer and generic GraphQL notation) but instead having the resolvers layer to be able to handle any complexity that may arise beyond that schema.

Totally understand this, and am so thankful for Apollo for building out the tools to allow this 😄

If you're curious, should definitely try out Elixir or Scala's GraphQL implementations just to see their perspective on this stuff as well!

Also, thank you so much for watching! I'm so glad it was helpful!

Chris
Chris
~ 8 years ago

It should be added that it's often necessary to not only restart the server, but also the GraphiQL client (by doing a browser refresh on the page) to make your changes functional (like in this case, if you want to see the descriptions).

Michael
Michael
~ 7 years ago

Maybe I'm to fast writing a comment, (I haven't finished them all) but it's crazy boilplate with all the schemas. Just doesn't look good at all.

dong cai
dong cai
~ 6 years ago

How to get videos using JS shema?

Andrew O'Brien
Andrew O'Brien
~ 6 years ago

would highly suggest using nodemon (https://nodemon.io/) to watch for changes to your server and auto-restart server

massimo-ua
massimo-ua
~ 6 years ago

Could you please explaine in details how to create nested schema? For example I want to make queries in such way: { accounts { show(id: 1) { id name } list { id name } } customers { list { id name } } } if I understand correctly, I should create Query schema with GraphQLSchema then I should create AccountsQuery schema with GraphQLSchema and after that I should create AccountsQueryType with GraphQLObjectType and defiane there all nesessary fields (show and list for example) const schema = new GraphQLSchema({ query: new GraphQLSchema({ accounts: new GraphQLObjectType({ name: 'AccountsQueryType', fields: { show... list... } } }), customers: new GraphQLObjectType({ name: 'CustomersQueryType', fields: { show... list... } } }) }), });

massimo-ua
massimo-ua
~ 6 years ago

Sorry for inline code... Here is pastebin with formated code https://pastebin.com/xdy1Hbx5

Leonel Galán
Leonel Galán
~ 5 years ago

Why is the query type appended with "Type": QueryType and the video type isn't? Is this following a convention or best practice?