Shows call to GraphQL server being done without use of any GraphQL client

App.tsx

import React, { useEffect, useState } from "react";
import "./App.css";

const GetCars = `
  {
    getCars {
      id
      name
      passengerCount
    }
  }
`;

function App() {
  const [cars, setCars] = useState<JSX.Element>(<ul></ul>);

  useEffect(() => {
    fetch("http://localhost:8000/graphql", {
      headers: {
        "Content-Type": "application/json",
      },
      method: "POST",
      body: JSON.stringify({
        operationName: null,
        query: GetCars,
        variables: {},
      }),
    }).then(async (result) => {
      const json = await result.json();
      const list = json.data.getCars.map((car: any) => {
        return (
          <li key={car.id}>
            name: {car.name}&nbsp; passengers: {car.passengerCount}
          </li>
        );
      });
      setCars(<ul>{list}</ul>);
    });
  });

  return (
    <div className="App">
      <strong>Cars</strong>
      {cars}
    </div>
  );
}

export default App;