Ecosyste.ms: Awesome

An open API service indexing awesome lists of open source software.

Awesome Lists | Featured Topics | Projects

https://github.com/cuongndc9/hera

👩🏼‍💻 Simple and lightweight GraphQL client.
https://github.com/cuongndc9/hera

103cuong apollo apollo-client graphql graphql-client graphql-request hera hera-js

Last synced: 21 days ago
JSON representation

👩🏼‍💻 Simple and lightweight GraphQL client.

Awesome Lists containing this project

README

        

# hera

👩🏼‍💻 Simple and lightweight GraphQL client.

[![All Contributors](https://img.shields.io/badge/all_contributors-1-orange.svg)](#contributors)
[![Build Status](https://travis-ci.com/103cuong/hera.svg?branch=main)](https://travis-ci.com/103cuong/hera)
![npm](https://img.shields.io/npm/v/hera-js.svg)
![david](https://img.shields.io/david/103cuong/hera.svg)
[![Hits-of-Code](https://hitsofcode.com/github/103cuong/hera)](https://hitsofcode.com/view/github/103cuong/hera)
[![GitHub](https://img.shields.io/github/license/103cuong/hera.svg)](https://github.com/103cuong/hera/blob/master/LICENSE)

## 🧰 installation

```sh
yarn add hera-js
```

## 🌳 usage

```ts
import { hera } from 'hera-js';

const { data } = await hera({
options: {
url: 'https://example.com'
},
query: `
query {
user(id: $id) {
id
name
age
}
}
`,
variables: {
id: 1
}
});
```

**👻 passing parameters as objects**

```ts
const { data } = await hera({
options: {
url: 'https://example.com',
},
query: `
mutation {
createUser(info: $info) {
id
name
age
address
job
}
}
`,
variables: {
info: {
name: 'Cuong Tran',
age: 22,
address: 'Tam Ky - Sai Gon / Vietnam',
job: 'software engineer',
},
},
});
```

**🐛 error handling**

```ts
const { data, errors } = await hera({
options: {
url: 'https://example.com',
},
query: `
query {
user(id: $id) {
id
name
age
}
}
`,
variables: {
id: 1,
},
});
```

**🌏 global options**

> You can specify config defaults that will be applied to every request.

```ts
import { hera, globalOptions } from 'hera-js';

globalOptions.url = 'https://example.com';
// globalOptions.headers =

const { data } = await hera({
query: `
mutation {
createUser(info: $info) {
id
name
age
address
job
}
}
`,
variables: {
info: {
name: 'Cuong Tran',
age: 22,
address: 'Sai Gon / Vietnam',
job: 'software engineer',
},
},
});
```

**💩 enums**

```ts
const { data } = await hera({
query: `
mutation {
createUser(info: $info) {
id
name
age
address
job
sex
}
}
`,
variables: {
info: {
name: 'Cuong Tran',
age: 22,
address: 'Sai Gon / Vietnam',
job: 'software engineer',
sex: 'MALE',
},
},
options: {
enums: ['sex'],
},
});
```

## 🚀 API

```ts
interface Options {
url?: string;
headers?: any;
timeout?: number;
enums?: string[];
}

hera({
query: string;
variables?: any;
options?: Options;
}) : Promise<{ data: any; errors: any[] }>
```

### 📝 options

```ts
{
// `url` is the server URL that will be used for the request
url: '/example',
// `headers` are custom headers to be sent
headers: {
token: 'Fv0761DZcunUr0dKBc4oo5k55jJchwqu',
'Content-Type': 'application/json'
},
}
```

### 📒 query

> `query` is query or mutation in Graphql

**graphql's query**

```ts
query: `
query {
user(id: $id) {
id
name
age
}
}
`
```

**graphql's mutation**

```ts
query: `
mutation {
createUser(info: $info) {
id
name
age
address
job
}
}
`
```

### 💉 variables

> variables is used to pass values to query's variables

```ts
query: `
mutation {
createUser(info: $info) {
id
name
age
address
job
}
}
`,
variables: {
info: {
name: 'Cuong Tran',
age: 22,
address: 'Sai Gon / Vietnam',
job: 'software engineer',
},
}
```

## 🤝 contributors

Thanks goes to these wonderful people ([emoji key](https://allcontributors.org/docs/en/emoji-key)):

Cuong Duy Nguyen
Cuong Duy Nguyen

💻 📖 ⚠️ 👀

This project follows the [all-contributors](https://github.com/all-contributors/all-contributors) specification. Contributions of any kind welcome!

## 📜 license

MIT © [Cuong Tran](https://github.com/103cuong)