There are several ways to interact with the Fuel GraphQL API from a frontend application. This section covers just a few options available to get you started.
export async function getHealth() {
let response = await fetch("https://beta-3.fuel.network/graphql", {
method: "POST",
headers: {
"Content-Type": "application/json",
Accept: "application/json",
},
body: JSON.stringify({ query: "{ health }" }),
});
let data = await response.json();
console.log("DATA:", data);
}
Read the official Apollo Client docs here .
$ npm install @apollo/client graphql
import { ApolloClient, InMemoryCache, gql } from '@apollo/client'
const apolloClient= new ApolloClient({
uri: 'https://beta-3.fuel.network/graphql',
cache: new InMemoryCache(),
})
const HEALTH_QUERY = `
query {
health
}
`
export const checkHealth = async () => {
const response = await apolloClient.query({
query: gql(HEALTH_QUERY),
});
console.log("RESPONSE:", response);
}
Read the official urql docs here .
$ npm install urql graphql
import { createClient } from 'urql'
const urqlClient= createClient({
url: 'https://beta-3.fuel.network/graphql',
})
const HEALTH_QUERY = `
query {
health
}
`
export const checkHealth = async () => {
const response = await urqlClient.query(HEALTH_QUERY).toPromise();
console.log("RESPONSE:", response);
}
You can see more examples in the next section.