A weekly newsletter of the best news, articles and projects about GraphQL

Tools & Open Source

Draqula

Check out Draqula, a GraphQL client for React apps that provide only the essential React hooks for building apps, useQuery and useMutation. This minimalistic tool can help you maintain a small and simple codebase by focusing on executing the basics properly and efficiently. Some features include basic cache implementation, automatic retries of network/timeout errors and failed GraphQL queries, and a straightforward way to hook into requests without middleware.

Articles

The Ultimate Guide to handling JWTs on frontend clients (GraphQL)

Learn how to handle authentication with Hasura as they demystify what a JSON Web Token is and discuss the best practices in setting up a GraphQL client to accept a JWT auth token. This article provides great insight on token usage, error handling, refresh tokens, and persistent sessions. References and sample code of an end to end working app with server side rendering capabilities are available at the end of the article.

Adopting GraphQL and Apollo in a Legacy Application

The development teams at Trello share their journey of modernizing their legacy architecture and incrementally adopting GraphQL, Apollo, React, and TypeScript. The blog explains the sizable benefits to adopting a GraphQL schema on the frontend and how to wrap an API with Apollo client. There are examples on translating a GraphQL query into a REST API request as well as writing local resolvers to fetch requested data from your REST API.

Videos

Client-Side GraphQL Using URQL — Learn With Jason

Watch Phil Pluckthun and Jovi De Croock from Formidable Labs in this live-coding session as they teach how to set up a GraphQL-powered frontend using URQL, a customizable GraphQL client. The two use Gatsby to demonstrate how to implement URQL and create a basic voting system.

Tutorials

React Form Validation With Formik, Yup, and GraphQL

This in-depth guide demonstrates how to validate a React user registration form by building a React and Apollo client with an Express and GraphQL Yoga server. The tutorial provides a server boilerplate and walks through using Yup for error validation. On the client side, the tutorial explains how to use the Higher Order Component version of Formik to pass a validation schema.