renatobenks-zz / react-releasy

Relay with zero-configuration

Geek Repo:Geek Repo

Github PK Tool:Github PK Tool

Releasy

Relay with zero-configuration.

Installation

With Yarn:

yarn add fbjs invariant react-relay relay-runtime react-releasy
yarn add --dev relay-devtools

or with NPM:

npm install --save fbjs invariant react-relay relay-runtime react-releasy
npm install --save-dev relay-devtools

Usage

Using Releasy is quite simple, first we need to create an instance of our Config class:

import { Config, InMemoryCache, Link } from 'react-releasy';

const link = new Link({
  url: 'https://yourserveraddress.com/graphql',
});

const cache = new InMemoryCache();

const config = new Config({
  link,
  cache,
});

Then we need to wrap the application with a ReleasyProvider:

import { ReleasyProvider } from 'react-releasy';

ReactDOM.render(
  <ReleasyProvider config={config}>
    <MyApplication />
  </ReleasyProvider>,
  document.getElementById('root'),
);

Using withReleasy we can get the environment:

import React from 'react';
import { QueryRenderer, graphql } from 'react-relay';
import { withReleasy } from 'react-releasy';

const MyComponent = ({ environment }) => (
  <QueryRenderer
    environment={environment}
    query={graphql`
      query MyComponentQuery {
        me {
          id
        }
      }
    `}
    render={({ error, props }) => {
      if (error) {
        return error.message;
      }

      if (props) {
        return props.me.id;
      }

      return 'loading';
    }}
  />
);

export default withReleasy(MyComponent);

And that's all! You can start making your own queries or whatever you want with Relay.

Documentation

See more documentation here.

License

MIT © Felippe Rodrigo Puhle

About

Relay with zero-configuration

License:MIT License


Languages

Language:JavaScript 100.0%