Summary of Module 3
This lesson is a summary of the final state of the work done in Module 3.0.
This lesson preview is part of the TinyHouse: A Fullstack React Masterclass with TypeScript and GraphQL course and can be unlocked immediately with a single-time purchase. Already have access to this course? Log in here.
Get unlimited access to TinyHouse: A Fullstack React Masterclass with TypeScript and GraphQL with a single-time purchase.
[00:00 - 00:17] In this module, we set up a GraphQL API with the Apollo Server package, or in particular, the Apollo Server Express package. We set up a new Apollo Server instance with the Apollo Server constructor, and this is where we passed in the type definition string and resolvers it can accept.
[00:18 - 00:36] We applied middleware on this Apollo Server instance, where we passed in our Express app instance and specified the path of our API endpoint. And we created the type definitions and resolvers for our Apollo Server instant iation in a GraphQL folder within our source folder.
[00:37 - 00:50] Type definitions is a string that represents the GraphQL schema. We're using the GQL tag that Apollo Server Express provides to help parse a template literal into a GraphQL abstract tree.
[00:51 - 01:03] With the Apollo GraphQL VS Code extension, we were able to get syntax highlighting within our template literal in the GQL tag. We created a listing type that represents the shape of a single listing.
[01:04 - 01:19] We created the root query and mutation object types. In the root query type, we had a listings field in which we return a list of listings and the delete listing field in our mutation exception ID, and when implemented , returns the delete listing.
[01:20 - 01:36] We're using the exclamation mark here, which is part of the GraphQL schema language to specify that this field should not return a null value. And the implementation of our schema is set up in the resolvers file, which represents the resolvers of our GraphQL API.
[01:37 - 01:58] Here is where we specify the listings resolver in our query, and where we actually simply return the listings array from a mock data array. And the delete listing field within our mutation, or the resolver for our delete listing field in our mutation, simply accepts the ID parameter and loops through the listing and splices the listing in which the ID matches the ID passed in.
[01:59 - 02:04] Now this summarizes pretty much what we've done to use Apollo Server to set up a very simple bare bones GraphQL API.