Altair GraphQL Client on Ubuntu 24.04 on Azure User Guide

Overview

This image runs Altair GraphQL Client 8.5.7, an open source GraphQL IDE, on Ubuntu 24.04 LTS. Altair lets you build, send and inspect GraphQL requests from the browser: a full-featured query editor with syntax highlighting, autocompletion and inline documentation driven by live schema introspection, custom headers and variables, real-time subscriptions, a searchable request history and reusable collections.

The self-hosted Altair build is purely client-side: the app runs entirely in your own browser and connects directly to whatever GraphQL endpoint you point it at, so nothing you send passes through a third-party service. That makes the appliance itself refreshingly simple - there is no database, no authentication and no server-side backend. cloudimg serves the official pre-built altair-static bundle as static files behind nginx on port 80.

What is included:

• Altair GraphQL Client 8.5.7, the official pre-built altair-static bundle, pinned by sha256 and served as static files from /var/www/altair
• nginx on port 80 serving the single-page app, with the AltairGraphQL.init() bootstrap injected so the IDE renders when served standalone
• An unauthenticated /healthz endpoint for Azure Load Balancer health probes
• nginx.service and a one-shot altair-graphql-firstboot.service as systemd units, enabled and active
• A per-VM info note at /root/altair-info.txt written on first boot, recording the access URL (there is no login to record - Altair needs none)
• A fully patched Ubuntu 24.04 LTS base with unattended security upgrades enabled
• 24/7 cloudimg support

Prerequisites

An active Azure subscription, an SSH key pair, and a VNet plus subnet in the target region. Standard_B2s (2 vCPU / 4 GiB RAM) is more than enough - Altair does all its work in the browser, so the server only serves static files. NSG inbound: allow 22/tcp from your management network and 80/tcp for the web interface. Altair serves plain HTTP on port 80; for production or shared access, terminate TLS in front of it with your own domain using a reverse proxy or Azure Application Gateway.

Step 1 - Deploy from the Azure Marketplace

Sign in to the Azure Portal, choose Create a resource, search the Marketplace for Altair GraphQL Client by cloudimg, and select Create. On Basics pick your subscription, resource group, region and size; under Administrator account choose SSH public key and paste your key; under Inbound port rules allow SSH (22) and HTTP (80). Then Review + create then Create.

Step 2 - Deploy from the Azure CLI

az vm create \
  --resource-group <your-rg> \
  --name altair \
  --image <marketplace-image-urn> \
  --size Standard_B2s \
  --admin-username azureuser \
  --ssh-key-values ~/.ssh/id_ed25519.pub \
  --vnet-name <your-vnet> --subnet <your-subnet> \
  --public-ip-sku Standard

az vm open-port --resource-group <your-rg> --name altair --port 80 --priority 1010

Step 3 - Connect to your VM

ssh azureuser@<vm-public-ip>

Step 4 - Confirm the services are running

Altair is served by nginx on port 80. A one-shot altair-graphql-firstboot.service runs once on first boot to record the access URL. Confirm both units are active and nginx is listening on port 80:

systemctl is-active nginx altair-graphql-firstboot
sudo ss -tlnp | grep ':80 '

Expected output:

active
active
LISTEN 0      511          0.0.0.0:80        0.0.0.0:*    users:(("nginx",pid=...))
LISTEN 0      511             [::]:80           [::]:*    users:(("nginx",pid=...))

Step 5 - Confirm the app is served

nginx serves an unauthenticated /healthz endpoint for load balancer probes, and the Altair single-page app at /. The altair-static bundle is a bootstrap shell, so the image injects the AltairGraphQL.init() call the app needs to render. Confirm the health endpoint returns 200, the served page is Altair, the JavaScript module loads with a JavaScript MIME type, and the bootstrap call is present:

curl -sI http://127.0.0.1/healthz | head -1
curl -s http://127.0.0.1/ | grep -o '<title>[^<]*</title>'
curl -s -o /dev/null -w 'main.js -> HTTP %{http_code} (%{content_type})\n' http://127.0.0.1/main.js
curl -s http://127.0.0.1/ | grep -o 'AltairGraphQL.init([^<]*'

Expected output:

HTTP/1.1 200 OK
<title>Altair</title>
main.js -> HTTP 200 (application/javascript)
AltairGraphQL.init({ baseURL: "/" });

Step 6 - Inspect the static bundle on disk

The whole appliance is the official altair-static build extracted into a single docroot - index.html alongside the assets/ directory and the versioned chunk-*.js modules:

ls -1 /var/www/altair | head -12
du -sh /var/www/altair

Expected output:

assets
chunk-2OVBIND4.js
chunk-35VQWODI.js
...
index.html
main.js
polyfills.js
styles.css
6.0M    /var/www/altair

Step 7 - Read the per-VM access note

Altair has no login of any kind, so there is no password to retrieve. On the first boot of every VM, altair-graphql-firstboot.service resolves the VM's address and writes a short access note to a root-only file so you always know where to point your browser:

sudo cat /root/altair-info.txt

Expected output:

# Altair GraphQL Client appliance by cloudimg - access information
#
# Altair is a self-hosted GraphQL IDE: build, send and inspect GraphQL queries in your
# browser. There is no login, no account and no server-side data - the app runs entirely
# in your own browser and connects to whatever GraphQL endpoint you point it at. Open the
# URL below in a web browser to start using it.
altair_url=http://<vm-ip>/

The note records the VM's own address for convenience; when reaching Altair from your workstation, use the VM's public IP or DNS name.

Step 8 - Open Altair in your browser

Browse to http://<vm-public-ip>/. Altair opens as a full GraphQL IDE: a URL bar with an HTTP verb selector at the top, a query editor on the left with tabs for Query, Pre-request, Post-request and Auth, and a Result pane on the right. The left rail holds the environment, history, collections and settings.

Step 9 - Set an endpoint and write a query

Enter your GraphQL endpoint in the URL bar - for this walk-through the public demo API https://countries.trevorblades.com/ is used. Altair introspects the schema automatically (you will see a "Reloaded doc successfully" notice), then type a query in the editor, for example:

query CountryLookup {
  country(code: "GB") {
    name
    native
    capital
    currency
    emoji
    languages {
      name
    }
  }
}

Step 10 - Send the request and read the response

Click Send Request (or press Ctrl/Cmd + Enter). Altair sends the query straight from your browser to the endpoint and renders the formatted JSON response in the Result pane, along with the HTTP status and round-trip time. The response for the query above shows the country's name, capital, currency, flag emoji and languages:

Step 11 - Explore the schema with the Docs panel

Click Docs to open the schema explorer. Altair builds it from the live introspection of the endpoint you set, so you can browse the root types, every query, mutation and subscription, their arguments and return types, and the directives the API supports - and search across all of them. This is what powers the editor's autocompletion as you write:

Maintenance

• Nothing to back up: the self-hosted Altair build stores nothing on the server - your queries, history and collections live in your own browser, and every request runs client-side. The appliance is entirely stateless.
• Updating Altair: the release is pinned by sha256 for reproducibility. To move to a newer release, download the official altair-static package for the version you want, extract its build/dist/ into /var/www/altair, and keep the injected AltairGraphQL.init() bootstrap call in index.html.
• Security updates: unattended security upgrades are enabled, so the OS keeps itself patched. Reboot when a new kernel is installed.
• TLS and access control: for shared or production use, front Altair with your own domain and a TLS-terminating reverse proxy or Azure Application Gateway, and restrict port 80 in the NSG to the networks that need it.

Support

cloudimg provides 24/7/365 expert technical support for this image. Contact support@cloudimg.co.uk. Altair GraphQL Client is licensed under the MIT License. This image is provided by cloudimg and is not affiliated with or endorsed by the Altair project; additional charges apply for build, maintenance and 24/7 support.