GatsbyJS obteniendo datos de Restful API

Soy nuevo en React y GatsbyJS. Estoy confundido y no pude resolverlo de una manera simple para cargar datos de la API Restful de terceros.

por ejemplo: me gustaría obtener datos de randomuser.me/API y luego poder usar los datos en páginas.

Digamos algo como esto:

import React from 'react'
import Link from 'gatsby-link'

class User extends React.Component {
constructor(){
  super();
  this.state = {
    pictures:[],
  };

}

componentDidMount(){
  fetch('https://randomuser.me/api/?results=500')
  .then(results=>{
    return results.json();
  })
  .then(data=>{
    let pictures = data.results.map((pic,i)=>{
        return(
          <div key={i} >
            <img key={i} src={pic.picture.medium}/>
          </div>
        )
    })
    this.setState({pictures:pictures})
  })
}

render() {
  return (<div>{this.state.pictures}</div>)
}
}

export default User;

Pero me gustaría obtener la ayuda de GraphQL para filtrar y ordenar usuarios, etc.

¿Podría ayudarme a encontrar la muestra de cómo puedo obtener datos e insertarlos en GraphQL engatsby-node.js

Respuestas a la pregunta(3)

Su respuesta a la pregunta