reason-urql

reason-urql

Reason bindings for Formidable's Universal React Query Library, urql.


View on Github

reason-urql

npm All Contributors Maintenance Status

Reason bindings for Formidable's Universal React Query Library, urql.

✨Features

  • ⚛️A fully featured GraphQL client for ReasonReact.
  • ✅Compile time type and schema validation.
  • ⚙️Customizable behavior via exchanges.
  • 🎣Coming soon – support for useQuery, useMutation, and useSubscription hooks!

reason-urql is a GraphQL client for ReasonReact, allowing you to hook up your components to queries, mutations, and subscriptions. It provides bindings to urql that allow you to use the API in Reason, with the benefits of a sound type system, blazing fast compilation, and opportunities for guided customization.

📋 Documentation

💾 Installation

1. Install reason-urql.

yarn add reason-urql

# or
npm install reason-urql --save

2. Add graphql_ppx.

This project uses graphql_ppx to type check your GraphQL queries, mutations, and subscriptions at compile time. You'll need to add it as a dev dependency.

yarn add graphql_ppx --dev

# or
npm install -D graphql_ppx

3. Update bsconfig.json.

Add reason-urql to your bs-dependencies and graphql_ppx/ppx to your ppx_flags in bsconfig.json.

{
  "bs-dependencies": ["reason-urql"],
  "ppx-flags": ["graphql_ppx/ppx"]
}

4. Send an introspection query to your API.

Finally, you'll need to send an introspection query to your GraphQl API. This allows graphql_ppx to generate a graphql_schema.json at the root of your project that it can use to type check your queries. You should check this file into version control and keep it updated as your API changes. To do this:

yarn send-introspection-query 

# or
npm run send-introspection-query 

Simply re-run this script at anytime to regenerate the graphql_schema.json file. See the docs for graphql_ppx for more assistance.

Older Versions

Before version 1.0.0, reason-urql listed urql as a peer dependency. If using v0.1.1 or earlier of reason-urql, make sure to install the correct version of urql.

yarn add reason-urql@0.1.1 urql@0.2.2

# or
npm install -s reason-urql@0.1.1 urql@0.2.2

💻 Example Projects

reason-urql has a nice set of examples showing how to use the basic components and APIs to get the most out of GraphQL and Reason in your app – check them out in the /examples folder. To run any of the examples, follow these simple steps.

# 1. Navigate into the example of choice.
cd examples/1-execute-query-mutation

# 2. Install dependencies.
yarn

# or
npm install

# 3. In one terminal, compile the source in watch mode.
yarn start

# or
npm run start

# 4. In another terminal, start the demo app server.
yarn start:demo

# or
npm run start:demo

The example will start up at http://localhost:8080. Edit the example freely to watch changes take effect.

Editing reason-urql source files

If developing on the main reason-urql source files (i.e. anything in /src/) and you want to test the changes in one of the examples, you'll need to do the following:

# Save your changes to source, then take the following steps.

# 1. Clean any artifacts from previous builds.
yarn clean

# or
npm run clean

# 2. Rebuild the source.
yarn build

# or
npm run build

# 3. Clean example build and reinstall dependencies.
cd examples/2-query
yarn clean
yarn

# or
nom run clean
npm install

Since we are linking the examples' dependency on reason-urql to the src directory, it's important to clean builds between changes to prevent any stale or erroneous artifacts.

Getting Involved

This project is currently under active development. Please help out by opening an issue or filing a PR.

Contributors

This project follows the all contributors spec. Thanks to these wonderful folks for contributing (Emoji Key):

Parker Ziegler
Parker Ziegler

💻 📖 👀 🤔
Khoa Nguyen
Khoa Nguyen

💻 📖
Phil Plückthun
Phil Plückthun

🤔
Kara Stubbs
Kara Stubbs

💻 ⚠️
Marcos Felipe Pimenta Rodrigues
Marcos Felipe Pimenta Rodrigues

📖

Maintenance Status

Experimental: This project is quite new. We're not sure what our ongoing maintenance plan for this project will be. Bug reports, feature requests and pull requests are welcome. If you like this project, let us know!