urql – A Universal React Query Library

Ken Wheeler:

There are some amazing solutions in the space already, notably Relay and Apollo, both of which are incredibly full-featured, brilliantly engineered, and wonderfully flexible. That said, these libraries might feel like a bit much to get started with at times, especially for beginners.

Our goal with urql is to simplify the process of using GraphQL in React apps. There are simpler solutions, but they end up pushing the complexity of handling data storage and caching onto the user. There are also more complex solutions that allow unimaginable flexibility in a variety of library/framework contexts, but we’re looking for the sweet spot that allows developers to be productive in React with GraphQL.

If you’ve been following Ken on Twitter you perhaps know that he’s a big fan of Render Props. It’s no surprise then, than urql‘s Connect component uses it.

const MyComponent = () => (
  <Connect
    query={query(MyQuery)}
    render={({ loaded, fetching, refetch, data, error, addTodo }) => {
      //...Your Component
    }}
  />
);

const MyQuery = `
  query {
    todos {
      id
      text
    }
  }
`;

Totally loving the Steve Urkel reference … grew up with that show 🙂

Introducing urql →
urql (GitHub) →