Skip to content

Express.js server configured with swc-node for fast TypeScript execution, nodemon for hot reloading, Jest and SuperTest for testing, and built with GraphQL Yoga for handling queries and mutations

Notifications You must be signed in to change notification settings

mattfsourcecode/node-graphql-code-test

Repository files navigation

Node GraphQL Code Test

This codebase leverages swc-node for fast TypeScript execution, enabling rapid builds and efficient runtime transformations. Paired with nodemon, the server quickly reloads when code changes are saved, which even includes updating the port configuration without needing a manual restart! It integrates GraphQL Yoga to handle GraphQL queries and mutations, and SuperTest for endpoint testing.






Start the environment

Ensure that you have pnpm installed. If not, follow the steps below:

Install pnpm

  1. Using npm:

    You can install pnpm globally using the following command:

    npm install -g pnpm
  2. Using Homebrew (macOS):

    brew install pnpm
  3. Using curl:

    curl -fsSL https://get.pnpm.io/install.sh | sh -

After installation, verify that pnpm is working by running:

pnpm -v





Setup

Clone the repository

git clone https://github.com/mattfsourcecode/node-graphql-code-test
cd node-graphql-code-test

Install Dependencies

pnpm i





To start the development server, run:

pnpm dev

What the dev script does:

  • Uses nodemon to watch for changes in TypeScript files (src/**/*.ts).
  • Automatically restarts the server when a change is detected.
  • Runs the server using node with the @swc-node/register to transpile TypeScript files on the fly.
  • Enables debugging with --inspect (useful for debugging in Chrome DevTools or other debugging tools).





GraphQL Query

Install jq

jq is used to format JSON output from curl. To install jq, follow the instructions for your system:

  • macOS (Homebrew):

    brew install jq
  • Linux (Ubuntu/Debian):

    sudo apt-get update
    sudo apt-get install jq
  • Windows: Follow the instructions on the official jq website.

The curl command will send a query to the GraphQL server at http://localhost:3000/graphql, and jq will format the JSON response for easy reading.

Example cURL Request

To query the GraphQL server for the full menu, use the following curl command:

curl -X POST http://localhost:3000/graphql \
  -H "Content-Type: application/json" \
  -d '{"query": "{ menu { appetizers { id name description price } entrees { id name description price } sandwiches { description cold { id name description halfPrice fullPrice } hot { id name description price } } soupAndSaladCombos { id name price } fajitas { id description price options { id name } } tacos { id description price options { id name } } enchiladas { id description options { id name } sizes { id name price } } quiche { id name description price } greenSalads { id name description price } } }"}' | jq





Run the Tests

The existing Jest testing suite in the application uses SuperTest to vastly simplify the need for Express server setup in test specs.

NOTE: The testing suite currently requires the dev server to be stopped. A future optimization will implement a method for running the tests on a different port.

To run the tests using Jest:

pnpm test





Debugging the Dev Server

To start debugging:

  1. Start the server using the pnpm dev script.
  2. Open Chrome and navigate to chrome://inspect.
  3. Click on "Inspect" under the "Remote Targets" section.
  4. The app should now be available for debugging in Chrome DevTools.





Additional GraphQL Queries

1. Query data for all sandwiches with their full prices:

Query:

{
  menu {
    sandwiches {
      cold {
        name
        fullPrice
      }
      hot {
        name
        price
      }
    }
  }
}

cURL:

curl -X POST http://localhost:3000/graphql \
  -H "Content-Type: application/json" \
  -d '{"query": "{ menu { sandwiches { cold { name fullPrice } hot { name price } } } }"}' | jq

2. Query data for all tacos and their prices:

Query:

{
  menu {
    tacos {
      description
      price
      options {
        name
        description
      }
    }
  }
}

cURL:

curl -X POST http://localhost:3000/graphql \
  -H "Content-Type: application/json" \
  -d '{"query": "{ menu { tacos { description price options { name description } } } }"}' | jq

3. Query data for all fajitas and their options:

Query:

{
  menu {
    fajitas {
      description
      options {
        name
        description
      }
    }
  }
}

cURL:

curl -X POST http://localhost:3000/graphql \
  -H "Content-Type: application/json" \
  -d '{"query": "{ menu { fajitas { description options {  name description } } } }"}' | jq

About

Express.js server configured with swc-node for fast TypeScript execution, nodemon for hot reloading, Jest and SuperTest for testing, and built with GraphQL Yoga for handling queries and mutations

Topics

Resources

Stars

Watchers

Forks