Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Relay showcase #29

Closed

Conversation

JulianKniephoff
Copy link
Member

@JulianKniephoff JulianKniephoff commented Aug 10, 2020

This is a showcase of the experimental version of Relay, which hopefully provides a nicer API than the stable version's docs would suggest. If time allows it, I might also produce one with the stable version.

Some interesting things to note and/or consider:

  • The actual API in this simple case is still just a simple call to a hook which gets the query as input
    • Relay forces us to name the query, probably for the purposes of code gen
    • To get proper typing, we unfortunately have to repeat that name, even, in the hook's type parameter
    • Note that the ugly __generated__ paths for the modules defining the types for the queries can be changed, IIUC
    • Instead of returning errors and the loading status next to the results like other hooks, the Relay hooks suspend the component and throw errors which we need to handle using Suspense and error boundaries
  • This is only the simplest use case of Relay, and it doesn't show any of the advantages why we would choose it over the others
    • However, I also think that looking at the API alone, there is also nothing why we would obviously discard it
    • I would like to look more into the more advanced features, still.
  • As @LukasKalbertodt already mentioned, IIRC, Relay might force certain constraints onto our GraphQL schema
    • In this simple use case I got away with changing the Movie IDs to be strings
    • However, as far as I understand it now, these are mostly things that the GraphQL spec presents as best practices for certain common problems, anyway, like authorization, pagination and caching, so as the inexperienced GraphQL API implementors that we are, we might want to follow those even outside of Relay
  • This might require us to install experimental versions of the React packages (react and react-dom) as well
    • That's what the docs suggest
    • I might try without later, if I don't find any evidence that this can't work at all before that
    • Well, there is also this
  • Integrating Relay into the build was a bit awkward
    • relay-config seems overkill, but we can roll our own solution to factoring out the Relay compiler config if we want to get rid of the extra dep
    • If we want to use the Webpack plugin, we need to match its version of the graphql dependency because of Module not found: Error: Must provide Source relay-tools/relay-compiler-webpack-plugin#56
      • I even had to npm dedupe to make sure that there is only one physical version of the package in the node_modules-tree
      • We could of course run this build step outside of Webpack, especially once we have a proper task runner

This is just for getting familiar with all GraphQL tooling/libraries
and will be completely removed later.

(cherry picked from commit 0fca350)
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

Successfully merging this pull request may close these issues.

2 participants