How to use Apollo Server 2 and GraphQL

How to use Apollo Server 2 and GraphQL

Learn GraphQL, Apollo Server 2, and Black-box Testing. In this tutorial I will be showing you how to use Apollo Server 2 and GraphQL. Understanding of GraphQL by setting up your GraphQL schema that represents the structure of your data set, furthermore, we will do this by looking at TypeDefs (type definitions). We will be using Jest to test our data sources, and then we will be creating black-box tests (snapshots) to test our typedefs & resolvers -- which will be hooked up to fixture files (mock data).

In this video I will be showing you how to use Apollo Server 2 and GraphQL. You will gain an understanding of GraphQL by setting up your GraphQL schema that represents the structure of your data set, furthermore, we will do this by looking at TypeDefs (type definitions). Once we have created our schema the next step will be to let Apollo Server know how to interact with that schema, essentially how to execute queries. To do this we will use something called a resolver, a resolver essentially tells Apollo how to fetch data, moreover how to fetch data for a particular type. Once we have setup our resolvers we will look at data sources. Data sources are nothing more than a class that sets out our scaffolding for making requests to external APIs (in our case). Although we just touch the surface of what a data source can do by using RESTDataSource, they can do much more.

Towards the end of this video, we will be using Jest to test our data sources, and then we will be creating black-box tests (snapshots) to test our typedefs & resolvers -- which will be hooked up to fixture files (mock data). For a quick TLDR of what we have done, skip to 2:58:49 - I essentially went with the format of 'schema (typedefs) -- resolvers -- datasources'.

⏳ Timeline 0:00:00 - Reviewing where we left off 0:03:19 - Quick look over the UI of the first tutorial 0:03:30 - Github repo of the first project 0:04:06 - Reviewing the read me 0:04:21 - Initial setup for our application 0:04:36 - Creating our package.json file 0:07:01 - Optional chaining import! 0:09:46 - Installing all our packages 0:10:26 - Creating our server.js file 0:11:11 - Setting up ApolloServer 0:12:41 - Setting up our typedefs 0:12:51 - Setting up our resolvers 0:13:30 - Quick talk about how GraphQL handles field requests 0:15:47 - Similarities between GQL & RPC 0:18:07 - Adding typedefs within (typedefs/index.js) 0:19:02 - Creating our Article object type 0:20:22 - Defining an instance of an executable query 0:21:32 - Adding more fields to our Article object type 0:26:25 - Creating our essential .babelrc file 0:26:55 - Starting our server! 0:27:25 - Exploring Graphiql on port 4000 0:33:55 - Executing a dummy query 0:36:10 - Hooking up our resolvers 0:37:49 - Exploring resolver arguments 0:39:54 - Logging our executable query arguments 0:40:19 - Exploring the context argument 0:44:09 - Creating our datasource files 0:49:01 - Implementing the hackernews.js datasource 0:52:30 - Explaining RESTDataSource 1:00:01 - Adding methods to our datasource 1:03:36 - Adding a transformer method 1:05:06 - Adding our datasource to our index.js 1:06:01 - Accessing our datasource via the context argument 1:07:21 - Adding all datasources to the context 1:09:51 - Our first successful query via Graphiql! 1:10:56 - Adding more resolvers 1:13:22 - Adding more executable queries into our typedefs 1:15:12 - Debugging syntax errors 1:18:08 - Succesful query responses 1:23:08 - Async resolver explained 1:27:23 - Testing our allArticles resolver 1:31:23 - Adding the New York Times datasource 1:40:03 - Adding the fixture files for testing 1:43:23 - Testing the HackerNews datasource 2:02:03 - Looking at the Apollo documentation for testing 2:06:13 - Testing the HackerNews queries 2:28:48 - Running our black-box tests 2:40:32 - The difference in mocking return objects/arrays 2:43:38 - Checking our coverage levels 2:45:05 - Testing the New York Times datasource 2:49:00 - Testing the New York Times queries 2:52:25 - Checking coverage, nearly at 100% 2:55:15 - 100% test coverage (unit & black-box tests) 2:55:50 - Quick look at aliases 2:58:49 - TLDR: overview of the project! 3:08:00 - Signing off!

Apollo GraphQL WebDev Databases

What's new in Bootstrap 5 and when Bootstrap 5 release date?

How to Build Progressive Web Apps (PWA) using Angular 9

What is new features in Javascript ES2020 ECMAScript 2020

Deno Crash Course: Explore Deno and Create a full REST API with Deno

How to Build a Real-time Chat App with Deno and WebSockets

Convert HTML to Markdown Online

HTML entity encoder decoder Online

Random Password Generator Online

HTML Color Picker online | HEX Color Picker | RGB Color Picker

Explore GraphQL with Apollo & React: Build a Superhero Database

In this article, We share some light on what GraphQL is and give you an opportunity for some hands-on experience with Apollo and React.

GraphQL and Apollo with Andrew Mead

GraphQL and Apollo are a match made in heaven. Get started with GraphQL and Apollo by creating a backend GraphQL layer for blog posts.

The Modern GraphQL Bootcamp (with Node.js and Apollo)

Learn how to build GraphQL applications using Node.js. Includes Prisma v1, authentication, Apollo Client, and more! The Modern GraphQL Bootcamp (with Node.js and Apollo)

Introduction to GraphQL with Apollo and React

GraphQL is an open-source Data and Manipulation language developed and used internally at facebook since 2012. Apollo is a complete platform for implementing a graph over your data. React is a JavaScript library for building user interfaces.

How to build a Blog App with GraphQL, Apollo client and Vuejs

In this tutorial, we'll be showing how to build a blog app with GraphQL, Apollo client and VueJS