@bkonkle/graft
v1.1.0
Published
A ReasonML solution for type-safe querying against an automatic GraphQL backend
Downloads
8
Readme
Graft
A ReasonML solution for type-safe querying against an automatic GraphQL backend.
Graft helps you set up a Postgraphile backend based on PostgreSQL, Express, and Apollo, and then connect to it using ReasonML on the front end. An example client implementation will be included using reason-react and reason-apollo.
Setup
API
To set up a simple API follow the tag-monster-api example to quickly bootstrap a PostgreSQL database and introspect the schema to create an automatic GraphQL interface.
Bring your own ORM or query builder. The example above uses Knex, with a simple initial migration. Follow the instructions in the README to set up a root user and build the schema.
Next, set up an application-specific config file like this example.
From there, you can throw together a quick server init script like this example that uses Graft.Server.make()
to start an Express server.
React Client
To connect to your brand new API from React, create a new ReasonML module in your React application to serve as your API Client. For more information on setting up ReasonML, take a look at the reason-react docs.
$ yarn add --dev @bkonkle/graft
bsconfig.json:
{
"bs-dependencies": ["reason-react", "reason-apollo"],
"ppx-flags": ["graphql_ppx/ppx"]
}
src/data/ApiClient.re:
let client =
Graft.Client.make(
~uri=Config.Api.endpoint,
~getSession=Graft.Browser.Session.get,
~connectToDevTools=Config.Env.isDev ? true : false,
(),
);
Now, you can start querying with reason-apollo!
open Graft.Client;
module GetTag = [%graphql
{|
query GetTag($id: UUID!) {
tagById(id: $id) {
id
name
slug
}
}
|}
];
let getTag =
(. id) => ApiClient.client |> query(~request=GetTag.make(~id, ()));
/**
* Plain JS interface
*/
let default = {"getTag": getTag};
This exposes a default export with a "getTag" property that allows plain JavaScript modules to use the getTag()
function to fire queries. The return value is a standard Apollo Client promise.
Notice that this is not exclusive to React in any way. It's currently un-tested, but it should be possible to use with other libraries as well.
Development
The core of the application is an Express server with some middleware:
Install dependencies with Yarn:
$ yarn
This should install the ReasonML and BuckleScript platform to compile the code to JavaScript.