In this tutorial I'll teach you how to use React with Apollo GraphQL client. You'll learn how to query GraphQL server and render query results, by building a simple React application.
As a bonus, I'll explain to you an important software development principle which will help you to write higher quality code.
We'll be building a simple React application that renders a list of jobs that require GraphQL knowledge. We'll get this list of jobs by querying a GraphQL server.
Let's take a look at how our app will work. The first screen will display a title and a button:
User will click the
Load GraphQL jobs button and then the loading spinner will be rendered instead of the button:
Finally, we'll render the number of jobs and the list of jobs, displaying job title, company name and locations for each job:
Our application will be made of two React components:
Jobs component will render the app title, the button and the loading indicator, as well as a list of jobs. Each job will be rendered by the
Let's create our
Job component first:
To be continued…