import { ApolloClient, InMemoryCache, gql } from '@apollo/client'; // Initialize Apollo Client const client = new ApolloClient({ uri: 'http://localhost:4000/GraphiQL', cache: new InMemoryCache(), }); // GraphQL query const GET_BOOKS = gql` query { getBook(id: 6) { author name } getAllBooks { name } bookInfo(id:"book1"){ name author } } `; // Function to fetch data export async function getBooks() { const { data } = await client.query({ query: GET_BOOKS, }); return data; } // GraphQL mutation const CREATE_BOOKS = gql` mutation{ createBook(author: "mohsin khan", name: "allah akbar"){ author name id } } `; // Function to fetch data export async function getBooks() { const { data } = await client.mutate({ mutation: CREATE_BOOKS, }); return data; } // call this in page.js import { getBooks } from './apollo-client'; const graphql = () => { getBooks().then((data) => { console.log(data); }); } graphql()
Preview:
downloadDownload PNG
downloadDownload JPEG
downloadDownload SVG
Tip: You can change the style, width & colours of the snippet with the inspect tool before clicking Download!
Click to optimize width for Twitter