> ## Documentation Index
> Fetch the complete documentation index at: https://bruno-a6972042-docs-timeline-scripts.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# GraphQL request

export const BrunoButton = ({collectionUrl, width = 160, height = 40, className = '', style = {}}) => {
  const encodedUrl = encodeURIComponent(collectionUrl);
  const buttonUrl = `https://fetch.usebruno.com?url=${encodedUrl}`;
  return <div style={{
    display: 'flex',
    justifyContent: 'center',
    width: '100%',
    margin: '2rem 0',
    ...style
  }} className={className}>
      <a href={buttonUrl} target="_blank" rel="noopener noreferrer" style={{
    textDecoration: 'none',
    display: 'inline-block'
  }}>
        <img src="https://fetch.usebruno.com/button.svg" alt="Fetch in Bruno" width={width} height={height} noZoom style={{
    width: `${width}px`,
    height: `${height}px`,
    display: 'block',
    cursor: 'pointer'
  }} />
      </a>
    </div>;
};

Bruno provides the capability to send GraphQL requests, allowing you to interact with APIs that use the GraphQL query language.

### Create GraphQL request

1. Create new request inside collection.
2. Select **GraphQL** as request type.
3. Provide **URL** and **Name** in the input box.
4. Click on **Create** button.

<img src="https://mintcdn.com/bruno-a6972042-docs-timeline-scripts/kBIjA8iElMTJHx7I/v2/images/screenshots/send-request/graphql/create-graphql-request.webp?fit=max&auto=format&n=kBIjA8iElMTJHx7I&q=85&s=6f7423d204effc699ec1943c32da15f9" alt="create-graphql-request" width="2664" height="1366" data-path="v2/images/screenshots/send-request/graphql/create-graphql-request.webp" />

The default method for working with GraphQL APIs is POST, but you can adjust it based on your preferences.

### GraphQL request with query

Bruno provides a dedicated section called **Query** where you can write and execute all your GraphQL queries. This section is designed to make it easy for you to interact with the GraphQL API by allowing you to define the data you want to retrieve or manipulate.

<img src="https://mintcdn.com/bruno-a6972042-docs-timeline-scripts/kBIjA8iElMTJHx7I/v2/images/screenshots/send-request/graphql/graphql-req-query.webp?fit=max&auto=format&n=kBIjA8iElMTJHx7I&q=85&s=4588b830ede95ab987d702922e345581" alt="query-graphql" width="2664" height="1366" data-path="v2/images/screenshots/send-request/graphql/graphql-req-query.webp" />

## Get Started with GraphQL APIs

Explore our sample REST and GraphQL collection to see practical examples and test GraphQL endpoints:

<BrunoButton collectionUrl="https://github.com/bruno-collections/rest-graphql-collection" width={160} height={40} />