Exercise: GraphQL Queries
Explore how to integrate GraphQL queries into a React frontend using Apollo Client. Learn to fetch product lists by category and dynamically populate category options for new product forms, enhancing your full-stack GraphQL application development skills.
Now, let’s practice our newly acquired skills and integrate the React frontend with two more GraphQL queries.
In the first part of this exercise, we’ll implement a new component that displays products from a particular category. In the second part, we’ll implement fetching a list of categories to initialize and create a new product form.
Exercise source code
To get the source code for this exercise run the following command in the project’s repository:
git checkout frontend-queries-exercise
Starting the project
Before we start, here’s a brief reminder of how to start all the components for the application. We need to start three different processes: the database, the GraphQL server, and the React development server.