Как связать graphQL c фронтом?

Игорь Мясников, так, ну вот
Сам запрос это { operationName, query, variables }
Для multipart { operations, map }

const query = `
  query($id: Int!) {
    user(id: $id) {
      name
    }
  }
`;

fetch('https://gql-placeholder.herokuapp.com/graphql', {
  method: 'POST',
  headers: {
    'content-type': 'application/json',
  },
  // credentials: 'include',
  body: JSON.stringify({
    operationName: null,
    query,
    variables: {
      id: 1,
    },
  }),
})
  .then((r) => r.json())
  .then(console.log);

Можете запустить в консоле

Файлы отправляются немного по-другому, нужно менять сам запрос (через FormData) https://github.com/jaydenseric/graphql-multipart-r... если это нужно

Легкие библиотечки полюбому есть, главное поискать

Вот например https://www.npmjs.com/package/dahlia-graphql-client
https://www.npmjs.com/package/gql-api-client