This chapter covers
- Analyzing UI components to determine their GraphQL data requirements
- Performing Ajax POST requests for GraphQL operations
- Using tokens in request headers to identify the API consumer
- Using fragments to make every UI component responsible for its own data requirements
- Using GraphQL features to simplify and generalize the UI code
In the last chapter, we finished the implementation of the AZdev GraphQL API service. It’s now time to explore how to use that API practically in a frontend web application.
When it comes to using GraphQL in web applications, you can use it either directly with a simple Ajax library (like axios
or fetch
) or with a fully featured GraphQL client (like Relay or Apollo) to manage all GraphQL communications. We’ll explore using a GraphQL API with client libraries in the next chapter. In this chapter, we will start by exploring how to use the AZdev GraphQL API without a client library. However, to make this example as close as possible to a real-life project, we’re going to use a UI library to manage what happens in the browser.
Tip
Remember to check out az.dev/gia-updates to see any API updates you might need for this chapter.