[GraphQL Client] Altair GraphQL Client : A beautiful feature-rich GraphQL Client IDE for all platforms

Altair GraphQL Client

Altair is a beautiful feature-rich GraphQL Client IDE for all platforms. Available for MacOS, Windows, Linux, Chrome, Firefox. It enables you interact with any GraphQL server you are authorized to access from any platform you are on.

Features

Altair provides several features that make developing with GraphQL very efficient and friendly. These features include:

• setting headers

• setting variables

• creating environments

• viewing response stats

• viewing schema docs

• advanced schema docs search

• dynamically adding/generating queries and/or fragments from schema docs

• file upload via GraphQL

• autocompletion of queries

• autofill all query fields at cursor

• automatic schema refreshing using GraphQL Event Stream protocol

• automatic refactoring of query

• prerequest scripts

• multiple windows, multiple languages

• importing and exporting collections of queries

• multiple themes

• plugin system for extensibility

• and many more features (really there’s a lot more!).

See more here: Introduction | Altair GraphQL Client - https://altair.sirmuel.design/docs/features

Usage

For mac users, you can also install using cask:

$ brew install --cask altair-graphql-client

For linux users, you can also install using snap:

$ snap install altair

For arch linux users, an AUR package aur/altair exists:

$ yay -S altair

For windows users, you can install using appget:

$ appget install altair-graphql

or chocolatey:

$ choco install altair-graphql

Usage with express

You can use altair with an express server using altair-express-middleware. Read more about how to use this here altair-express-middleware - npm - https://www.npmjs.com/search?q=altair-express-middleware.

Usage with koa

You can use altair with a koa server using altair-koa-middleware. Read more about how to use this here altair-koa-middleware - npm - https://www.npmjs.com/package/altair-koa-middleware.

Usage with Fastify

You can use altair with a Fastify server using altair-fastify-plugin. Read more about how to use this here altair-fastify-plugin - npm - https://www.npmjs.com/package/altair-fastify-plugin.

Usage with Laravel (PHP)

You can use altair in a Laravel project using xkojimedia/laravel-altair-graphql. Read more about how to use this here xkojimedia/laravel-altair-graphql - Packagist - https://packagist.org/packages/xkojimedia/laravel-altair-graphql:

$ composer require xkojimedia/laravel-altair-graphql

You can find other available integrations here: Introduction | Altair GraphQL Client - https://altair.sirmuel.design/docs/integrations

Configuration Options

When using a custom instance of Altair, there are couple of options you can use to customize Altair based on your needs:

• endpointURL string - URL to set as the server endpoint

• subscriptionsEndpoint string - URL to set as the subscription endpoint

• initialSubscriptionsProvider “websocket” | “graphql-ws” | “app-sync” | “action-cable” - Initial

• subscriptions provider

• initialQuery string - Initial query to be added

• initialVariables string - Initial variables to be added (in JSON format) e.g. ‘{ “var1”: “first variable” }’

• initialPreRequestScript string - Initial pre-request script to be added e.g. ‘altair.helpers.getEnvironment(“api_key”)’

• initialHeaders IDictionary - Initial headers object to be added

{
  'X-GraphQL-Token': 'asd7-237s-2bdk-nsdk4'
}

• initialEnvironments IInitialEnvironments - Initial Environments to be added

{
  base: {
    title: 'Environment',
    variables: {}
  },
  subEnvironments: [
    {
      title: 'sub-1',
      variables: {}
    }
  ]
}

• instanceStorageNamespace string - Namespace for storing the data for the altair instance. Use this when you have multiple altair instances running on the same domain. e.g. ‘altair_dev_’
  Example usage:

AltairGraphQL.init({
  endpointURL: 'https://www.example.com/graphql',
  initialVariables: '{ "username": "imolorhe" }',
});

References

[1] altair-graphql/altair: ✨⚡️ A beautiful feature-rich GraphQL Client for all platforms. - https://github.com/altair-graphql/altair

[2] Altair GraphQL Client - https://altair.sirmuel.design/

[3] altair-graphql-client — Homebrew Formulae - https://formulae.brew.sh/cask/altair-graphql-client

[4] Altair GraphQL Client - Chrome Web Store - https://chrome.google.com/webstore/detail/altair-graphql-client/flnheeellpciglgpaodhkhmapeljopja?hl=en

[5] Altair GraphQL Client – Get this Extension for 🦊 Firefox (en-US) - https://addons.mozilla.org/en-US/firefox/addon/altair-graphql-client/

[6] Install Altair GraphQL Client on Linux | Snap Store - https://snapcraft.io/altair