wdoug/typescript-graphql-and-hooks

A demo repo for a talk on putting these technologies together

TypeScript, GraphQL, and Hooks

This is a demo repo to accompany a lightning talk I gave on using these technologies together. This showcases some of the best tools I currently (Spring 2019) know of for interacting with data on a server.

The lightning talk on this subject can be found here

Technologies Overview

Backend

• Prisma - generates a GraphQL API and ORM-style client based on a database graphql schema description
• Nexus - Declarative, Code-First GraphQL Schemas with generated TypeScript to maximize TypeScript benefit with minimal manual typings
• Built on top of some prisma-examples, primarily this one

API

• GraphQL

Frontend

• Create-React-App (created with the typescript flag)
• react-apollo-hooks - use the react apollo client tooling within React hooks

Tools

• graphql-code-generator for automatically generating TypeScript types based on graphql on the client
• eslint
  • eslint-plugin-graphql for lint client graphql queries against the schema
  • typescript-eslint for linting TypeScript
• prettier

Setup

1. Install the correct node version defined in the .nvmrc file

• If you have nvm this can be installed with nvm install

2. Install yarn
3. Run yarn to install global dependencies
4. cd into server directory and follow the readme steps there
5. cd into the client directory and follow the readme steps there