Type safe GraphQL with TypeScript

on YouTube ↗57m

" summary

Builds a trivia API schema (games, players, questions, answers) and uses Apollo Server on Azure Functions plus React clients; runs graphql-code-generator to produce TypeScript models and TypeScript resolver types so resolvers, context and data sources are strongly typed. Shows mapping between DB shapes (snake_case, extra fields) and public schema, generates resolver signatures and client operation types, and wires them into React hooks. Demos hit local runtime and Docker hiccups but the generated end‑to‑end typing approach works.

AI-written summary · about

" chapters (19)

1. 0:00Start
2. 2:01What Is Graphql
3. 7:07Graphql
4. 10:45Graphical Schema
5. 14:43Apollo Studio
6. 25:40Resolvers
7. 32:48Data Access
8. 33:05Apollo Context
9. 33:24Dependency Injections
10. 34:33Graphql Code Gen
11. 38:57Translation Layers
12. 41:00Typed Graphql
13. 42:51Type Graphql
14. 43:31Type First Approach
15. 46:25Runtime Error
16. 52:11Typescript Type Definitions
17. 54:49Graphql Code Generator
18. 55:11Graphql with Azure
19. 55:39Authentication

" related talks

• 25mType-safe GraphQL with TypeScriptAaron Powell · OpenJS World 2021
• 27mWeb applications of the future with TypeScript and GraphQLRoy Derks · Conf42 JavaScript 2022
• 26mFull Stack Type Safety with React, GraphQL, and TypeScriptRobert Zhu · Nordic.js 2019
• 52mTypeScript and GraphQRoy Derks · JSWorld Conference 2021
• 35mFull-stack Type Safety with React, GraphQL, and TypeScriptRobert Zhu · React Boston 2019
• 06mAutomagic TypeScript Codegen for GraphQLSalvatore Aiello · React Conf 2019
• 25mWeb applications of the future with TypeScript and GraphQLRoy Derks · ConFrontJS 2019
• 30mReact Superpowers with GraphQL and TypeScriptRoy Derks · React Live Online Conference 2020