Package Exports
- gql-query-builder
This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (gql-query-builder) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
GraphQL Query Builder
A simple helper function to generate GraphQL queries using plain JavaScript Objects (JSON).
Usage
Install
npm install gql-query-builder --save
or yarn add gql-query-builder
API
import * as gql from 'gql-query-builder'
const query = gql.query(options: object)
const mutation = gql.mutation(options: object)
where options
is { operation, fields, variables }
or an array of options
Name | Description | Type | Required | Example |
---|---|---|---|---|
operation | Name of operation to be executed on server | String | Yes | getThougts, createThought |
fields | Selection of fields | Array | Yes |
['id', 'name', 'thought'] ['id', 'name', 'thought', { user: ['id', 'email'] }] |
variables | Variables sent to the operation | Object | No |
{ key: value } eg: { id: 1 } { key: { value: value, required: true } eg: { email: { value: "user@example.com", required: true }, password: { value: "123456", required: true } } |
You can also import query
or mutation
individually:
import { query, mutation } from 'gql-query-builder'
query(options: object)
mutation(options: object)
Examples
Query:
import * as gql from 'gql-query-builder'
const query = gql.query({
operation: 'thoughts',
fields: ['id', 'name', 'thought']
})
console.log(query)
// Output
query {
thoughts {
id,
name,
thought
}
}
Query (with variables):
import * as gql from 'gql-query-builder'
const query = gql.query({
operation: 'thought',
variables: { id: 1 },
fields: ['id', 'name', 'thought']
})
console.log(query)
// Output
query ($id: Int) {
thought (id: $id) {
id, name, thought
}
}
// Variables
{ "id": 1 }
Query (with nested fields selection)
import * as gql from 'gql-query-builder'
const query = gql({
operation: 'orders',
fields: [
'id',
'amount',
{
user: [
'id',
'name',
'email',
{
address: [
'city',
'country'
]
}
]
}
]
})
console.log(query)
// Output
query {
orders {
id,
amount,
user {
id,
name,
email,
address {
city,
country
}
}
}
}
Query (with required variables):
import * as gql from 'gql-query-builder'
const query = gql.query({
operation: 'userLogin',
variables: {
email: { value: 'jon.doe@example.com', required: true },
password: { value: '123456', required: true }
},
fields: ['userId', 'token']
})
console.log(query)
// Output
query ($email: String!, $password: String!) {
userLogin (email: $email, password: $password) {
userId, token
}
}
// Variables
{
email: "jon.doe@example.com",
password: "123456"
}
Mutation:
import * as gql from 'gql-query-builder'
const query = gql.mutation({
operation: 'thoughtCreate',
variables: {
name: 'Tyrion Lannister',
thought: 'I drink and I know things.'
},
fields: ['id']
})
console.log(query)
// Output
mutation ($name: String, $thought: String) {
thoughtCreate (name: $name, thought: $thought) {
id
}
}
// Variables
{
"name": "Tyrion Lannister",
"thought": "I drink and I know things."
}
Mutation (with required variables):
import * as gql from 'gql-query-builder'
const query = gql.mutation({
operation: 'userSignup',
variables: {
name: { value: 'Jon Doe' },
email: { value: 'jon.doe@example.com', required: true },
password: { value: '123456', required: true }
},
fields: ['userId']
})
console.log(query)
// Output
mutation ($name: String, $email: String!, $password: String!) {
userSignup (name: $name, email: $email, password: $password) {
userId
}
}
// Variables
{
name: "Jon Doe",
email: "jon.doe@example.com",
password: "123456"
}
Example with Axios
Query:
import axios from "axios";
import { query } from "gql-query-builder";
async function getThoughts() {
try {
const response = await axios.post(
"http://api.example.com/graphql",
query({
operation: "thoughts",
fields: ["id", "name", "thought"]
})
);
console.log(response);
} catch (error) {
console.log(error);
}
}
Mutation:
import axios from "axios";
import { mutation } from "gql-query-builder";
async function saveThought() {
try {
const response = await axios.post(
"http://api.example.com/graphql",
mutation({
operation: "thoughtCreate",
variables: {
name: "Tyrion Lannister",
thought: "I drink and I know things."
},
fields: ["id"]
})
);
console.log(response);
} catch (error) {
console.log(error);
}
}
Showcase
Following projects are using gql-query-builder
- Crate - Get monthly subscription of trendy clothes and accessories - GitHub
- Fullstack GraphQL Application - GitHub
- Would really appreciate if you add your project to this list by sending a PR
Authors
- Atul Yadav - GitHub · Twitter
- Juho Vepsäläinen - GitHub · Twitter
- [YOUR NAME HERE] - Feel free to contribute to the codebase by resolving any open issues, refactoring, adding new features, writing test cases or any other way to make the project better and helpful to the community. Feel free to fork and send pull requests.
Donate
If you liked this project, you can donate to support it ❤️
License
Copyright (c) 2018 Atul Yadav http://github.com/atulmy
The MIT License (http://www.opensource.org/licenses/mit-license.php)