GraphQL and Apollo Client (step-by-step)
The most stuff about GraphQL, you will learn by doing - but below you can find some theoretical explanation what it is.
What is the GraphQL server?
IN SHORT: GraphQL is a query language which provides a common interface between the client and the server for data fetching and the data's mutations (insert a row, edit a row etc).
GRAPHQL ANALOGY #1: with SQL you can query the databse from the backend (for example you can make a SQL query in your PHP backend). GraphQL is similar concept, but you can make the query from the client-side to the backend side.
GRAPHQL ANALOGY #2: In the GraphQL server, you can do similar configurations like in your MySQL/PostgreSQL panel admin (for example: PhpMyAdmin). You describe your application data schema in GraphQL, the similar way (it's just an analogy) as in MySQL/PostgreSQL. After you have described your data schema, then you can query in order to fetch a record from the React's client-side application by using the GraphQL query language (the language itself is quite easy to learn, you will see later in the tutorial).
GraphQL-server-as-a-service with ScapHold
For the quick backend kick-off, we will use ScapHold.io (a referal link which provides you with $10 of free credits to use on their backend as a service platform) GraphQL-backend-as-a-service (later in our tutorial, you will also learn how to implement a GraphQL server from scratch with NodeJS).
We are done with implementation of the the client side's features (React+Redux). It's time to take care of the backend stuff. After we are done with it, we will also improve the client-side code in terms of connecting the client-side with the backend-side.
Next steps are:
- 1) Setup a ScapHold account
- 2) Create the GraphQL schema
- 3) Install and start using the Apollo client (you will find the more detailed description about this library later in the tutorial)
GraphQL and Apollo Client Table Of Contents