Generating TypeScript types and React Hooks based on GraphQL endpoint

Click for: original source

Autogenerate Typescript types and custom React hooks in React applications with GraphQL Code Generator. Danilo Woznica.

Developing ReactJS with TypeScript, it still requires a considerable effort to write types and keep them maintainable. Moreover, when the data provider is a GraphQL server, it makes you feel like you’re doing a useless job, given the server already has its own schemas for types. Seems redundant, right?

[GraphQL Code Generator]() gives us the ability to generate TypesScript typing out of GraphQL schemas. Beyond that, it gives us a couple of plugins to create custom React hooks that don’t require any kind of maintenance or workaround to fit into your application.

Among many others, some of the benefits of using this tool:

  • Codeless: forget about creating the interfaces/types for every GraphQL endpoints; save time and spend effort on what matters
  • Development experience: as a result of having the types always available, your editor will provide meaningful autocomplete and error checking
  • Types always up-to-date: if your GraphQL endpoint schemas change, your application will be updated and typescript will help you make sure you make the necessary changes

For learning more follow the link to the full article. You will also get code explanation and link to the code repository. Nice one!

[Read More]

Tags react web-development javascript app-development