Start GraphQL API

Author: GregBrimble

api/graphql/index.ts

@@ -0,0 +1,9 @@
+import { FABRuntime } from "@fab/core";
+import { makeGraphQLHandler } from "@glenstack/cf-workers-graphql";
+import { schema } from "./schema/index";
+
+const graphQLHandler = makeGraphQLHandler(schema);
+
+export default function graphql({ Router }: FABRuntime) {
+  Router.on("/graphql", ({ request }) => graphQLHandler(request));
+}

api/graphql/schema/index.ts

@@ -0,0 +1,16 @@
+import { makeExecutableSchema } from "@graphql-tools/schema";
+import gql from "graphql-tag";
+
+const typeDefs = gql`
+  type Query {
+    hello: String
+  }
+`;
+
+const resolvers = {
+  Query: {
+    hello: () => "Hello, world!",
+  },
+};
+
+export const schema = makeExecutableSchema({ typeDefs, resolvers });

fab.config.json5

@@ -1,13 +1,14 @@
 // For more information, see https://fab.dev/kb/configuration
 {
   plugins: {
-    '@fab/input-static': {
-      dir: 'build'
+    "@fab/input-static": {
+      dir: "build",
     },
-    '@fab/plugin-render-html': {
-      fallback: '/index.html'
+    "./api/graphql/index.ts": {},
+    "@fab/plugin-render-html": {
+      fallback: "/index.html",
     },
-    '@fab/plugin-rewire-assets': {}
+    "@fab/plugin-rewire-assets": {},
     // This section defines your build & runtime toolchains. See https://fab.dev/kb/plugins
   },
   settings: {
@@ -18,13 +19,13 @@
       // allowing for many production-specific optimisations. See https://fab.dev/kb/production
       // Example setting:
       // API_URL: 'https://api.example.com/graphql'
-    }
+    },
   },
   deploy: {
     // For manual (command-line) deploys, add configuration here.
     // • See https://fab.dev/guides/deploying for more info.
     // However, we recommend automatic deploys (triggered by git push)
     // using a service such as Linc (https://linc.sh)
     // • See https://fab.dev/kb/automatic-deploys for setup instructions.
-  }
+  },
 }

package-lock.json

@@ -4,6 +4,8 @@
   "private": true,
   "dependencies": {
     "@fontsource/inter": "4.1.0",
+    "@glenstack/cf-workers-graphql": "1.0.4",
+    "@graphql-tools/schema": "6.0.18",
     "@headlessui/react": "0.2.0",
     "@testing-library/jest-dom": "5.11.9",
     "@testing-library/react": "11.2.3",
@@ -13,6 +15,7 @@
     "@types/react": "17.0.0",
     "@types/react-dom": "17.0.0",
     "classnames": "2.2.6",
+    "graphql-tag": "2.11.0",
     "react": "17.0.1",
     "react-dom": "17.0.1",
     "react-router-dom": "5.2.0",