GraphQL, Simplified

on YouTube ↗01h 11m

" summary

Demo shows a tiny client and a runnable full‑stack example: the front end uses graphql-hooks (1.9kB gzipped) with useQuery/useMutation hooks in React to fetch and create users, the back end uses fastify-gql with an in‑memory users array and mutations exposed via the schema, queries are explored with graphiQL, fastify‑gql compiles queries to JS for speed, and the workshop code actually lists users, adds a user via a mutation and refreshes the list — it runs live though attendees hit minor install hiccups.

AI-written summary · about

" chapters (12)

1. 0:00Intro
2. 0:24graphql-hooks Workshop
3. 4:15React Hooks are...
4. 6:41Store and manage local state Separation of concerns • Functions vs Classes
5. 7:16GraphQL is a data query language
6. 9:05Introducing graphql- hooks
7. 11:58Get a GraphQL Server up and running Explore GraphiQL
8. 26:22A GraphQL schema defines the relationships and structure of the data
9. 27:31GraphQL resolvers are functions that define what to do with the data
10. 27:51To Create a User, add a mutation to the schema and resolvers in graphql.js
11. 37:10Install graphql-hooks npm install graphql-hooks
12. 58:19Query Variables

" related talks

• 30mGraphQL - A different way to APISamuel Skeen · UtahJS Conf 2018
• 41mIntroduction to GraphQLMatt Lavin · RVA JavaScript Conf 2019
• 01h 00mGraphQL - A query language to empower your API consumersRob Crowley · NDC Sydney 2017
• 30mReact & GraphQL - Bringing Simplicity and Correctness to Client Side DevelopmentChris Toomey · React Boston 2018
• 08mCreating a flexible GraphQL backend in 5 minutesRobert Hostlowsky · JS Kongress 2016
• 38mVue + GraphQLNatalia Tepluhina · VinnytsiaJS 2019
• 26mEverything You Need to Know About GraphQL in 3 ComponentsEve Porcello · React Rally 2018
• 58mCrafting compelling real-time web experiences with GraphQL and ReactRob Crowley · NDC Sydney 2018