https://github.com/amoutonbrady/graphql-client

Demo
https://github.com/amoutonbrady/graphql-client

graphql graphql-client typescript

Last synced: 22 days ago
JSON representation

Demo

• Host: GitHub
• URL: https://github.com/amoutonbrady/graphql-client
• Owner: amoutonbrady
• Created: 2020-08-25T21:42:46.000Z (about 4 years ago)
• Default Branch: master
• Last Pushed: 2023-04-10T10:12:02.000Z (over 1 year ago)
• Last Synced: 2024-10-01T04:40:58.311Z (about 1 month ago)
• Topics: graphql, graphql-client, typescript
• Language: TypeScript
• Homepage: https://stackblitz.com/edit/typescript-jndgge?file=index.ts
• Size: 90.8 KB
• Stars: 4
• Watchers: 1
• Forks: 0
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • Changelog: CHANGELOG.md

Awesome Lists containing this project

README

        


# Graphql Client

The most minimal graphql client you'll ever find

Features:

- Typescript ready: written in Typescript

- Fully tested: literally 3 functions

- Minimal footprint: 30 loc, [~800 bytes minified](https://bundlephobia.com/result?p=@amoutonbrady/[email protected])

- No BS cache or w/e, ask data and you shall receive

## Installation

```bash

$ npm i @amoutonbrady/graphql-client

```

## Usage

```ts

import { GraphQLClient, gql } from '@amoutonbrady/graphql-client';

// A function that creates a client

// You can pass a token a second parameter

const client = GraphQLClient('https://jurassic.park/graphql');

// You can also provide your own fetch if you want to

// const client = GraphQLClient('https://jurassic.park/graphql', { fetch: require('node-fetch') });

const token = getToken();

// You can set a bearer token after wards

client.setAuth(`Bearer ${token}`);

// You can set abitrary headers

client.setHeaders({ Token: token });

// gql is just a pass through that minify the string for leaner payload

const query = gql`

 query getDinosaur($name: String!) {

  getDinosaur({ where: { name: $name } }) {

    name

    height

    speed

  }

 }

`;

// This needs to mimic what you send to the query above

const variables = { name: 'Velociraptor' };

// This will return the `data` property of the graphql response or throw if `errors` is present

client.request(query, variables).then(console.log).catch(console.error);

// => { getDinosaur: { name: 'Velociraptor', height: 150, speed: 70 } }

```