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

Using Relay without React #721

Closed
wants to merge 7 commits into from

Conversation

andimarek
Copy link

This PR has to the goal to make Relay usable without React.

Overview:
The core functions of Relay don't depend really on React, but currently it's only really useable with RelayContainer, which is a higher order React component.

The idea behind this PR is to introduce two new classes: GenericRelayRootContainer and GenericRelayContainer. Both are very similar to RelayRootContainer/RelayRenderer and RelayContainer. The main difference is that they don't wrap any React Component and don't deal with any rendering. They just maintain the data specified by fragments.
Instead of rendering a Component they call a registered callback function to inform about new/changed data.
This way it is possible to use co-located data declaration with any rendering technology.

To make it more clear I added a modified star-wars example to use Angular instead React: examples/star-wars-angular

This is already working but it's not perfect. I'm sharing this here to get some feedback, if this is even possible to get merged and what to improve/change.

Implementation Details:
Like I said I added to new classes: GenericRelayRootContainer and GenericRelayContainer.

The GenericRelayRootContainer combines some aspects of RelayRootContainer and RelayRenderer: It basically just calls getRelayQueries for the first data fetching.

GenericRelayContainer is a reduced version of RelayContainer: It's not a React Component, but a simple class.The important parts for the data declaration are the same as in RelayContainer: There is still a RelayContainerSpec and Routes are also the same. But for example because there is no React Context anymore, the route has to provided along with all the other props.

I added a few new types, but reused all of the existing types where possible/made sense.

There are also two new test files GenericRelayContainer-test and GenericRelayRootContainer-test

The tests are kept minimal because I think some aspects of GenericRelayContainer and RelayContainer should be pulled out into own modules to make it more DRY. I wanted to wait for some feedback before duplicating too much test cases.

@josephsavona
Copy link
Contributor

Thanks for your contribution! It's exciting to see interest in using Relay with other view libraries. As noted in the roadmap, we're actively on working on making Relay more modular - including separating Relay into a core, imperative data-fetching API and a declarative React integration layer. The core could then be used to implement integrations with other view libraries.

The community has been actively contributing toward a prerequisite of this - #558 - to make all Relay state contextual instead of global, and this is almost finished. We (Relay core) are working on the core/react split - see #559.

We definitely would like to support the community in integrating Relay with other libraries. Given that there is already active work to make this type of integration possible, we probably won't move forward with integrating this PR. Instead, our recommendation is to use this as the basis of a new package/repository - e.g. relay-angular. Note that GenericRelay(Root)Container is a good temporary solution for resolving Relay data until #558 and #559 are complete and there is a documented, public API for resolving data outside of Relay containers. At that point you can simplify your library to use the new API.

@andimarek
Copy link
Author

Thanks for your feedback and the references to the issues.

Especially your comment about DataContainer(#559 (comment)):
This is I think the same idea as the GenericRelayContainer.

I will comment on this specific issue, as it seems the better place.

@andimarek
Copy link
Author

About the relay-angular suggestion: I just wanted to make clear, that the goal of this PR was not to make Relay work with Angular specifically. It was just the example I created with Angular, because I know Angular better than e.g. ember.

@andimarek andimarek mentioned this pull request Jan 5, 2016
3 tasks
@andimarek
Copy link
Author

I'm closing this PR, because the topic will be handled in #559.

@andimarek andimarek closed this Jan 10, 2016
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Projects
None yet
Development

Successfully merging this pull request may close these issues.

3 participants