Sirwin
Sirwin
The graph & GraphQl

What is the tecnology behind "The Graph"?

By T89 | Only programming | 5 Jan 2021


 

As we all know "The Graph" is an indexing protocol for querying networks like Ethereum and IPFS.
To create this, "The Graph" uses GraphQL Api.

GraphQl
GraphQL is a query language that provides clients with exactly the data requested by the user. It was created by Facebook in 2012 but went open and free in 2015, it is now supported by the GraphQL Foundation.

Making a request is easy, we just need to create a JSON (JavaScript Object Notation) with the necessary data.

How to create a basic graphql service?

Yes, we need a little bit of experience but is easy to create one. We just need Node.js and an editor like VS Code.
To test node is installed, open a powerShell or a propt and type:

npm --version

The installed version will appear, on the contrary you will need to install node.js from their site.
Then we need to create a folder where create our simple application.

mkdir GraphQlAPI
cd .\GraphQlAPI\

After that we must initialize node and install graphql whith his server:

npm init
npm install express express-graphql graphql --save

In your project, now we have this situation

26faa3ed181f013252683826371b9cfa0176420bf890ad231621179bf84ae511.png

Now we can create our structure folder:

- src
   - data
   - schema
   - services

We need this structure to separate the concepts of our app.
Now let's create schema.js in src/schema:

var { buildSchema } = require('graphql');

var schema = buildSchema(`
    type Query {
        token(id: Int!): Token
        tokens(name: String): [Token]
    },
    type Token {
        id: Int
        name: String
        price: Float
        marketCap: Float
    }
`);

module.exports = { schema };

The string in method buildSchema contains the IDL (GraphQL Interface Definition Language) code wich is used to describe the schema. This schema is validate each time the client makes an API call.

Now we create the service that will have to return the requested data. We will create 2 methods one for returning a point element by passing it an id (unique identifying value) and one for having all the elements. Let's create token-service.js in src/services:

var data = require('../data/tokens')

var getToken = function(args) { 
    var id = args.id;
    return data.tokens.filter(token => {
        return token.id == id;
    })[0];
}

var getTokens = function(args) {
    if (args.name) {
        var name = args.name;
        return data.tokens.filter(token => token.name === name);
    } else {
        return data.tokens;
    }
}

module.exports = { getToken, getTokens }

Now we need dataset, let's create tokens.js in src/data:

var tokens = [
    {
        id: 1,
        name: 'Bitcoin',
        price: 31750,
        marketCap: 589066915097
    },
    {
        id: 2,
        name: 'Ethereum',
        price: 1050,
        marketCap: 118884401541
    },
    {
        id: 3,
        name: 'The Graph',
        price: 0.3019,
        marketCap: 376101076
    }
];

module.exports = { tokens };

Now we have to create the core of our API. Then we create the server from which to start the application, let's create server.js in the main folder:

var express = require('express');
var { graphqlHTTP } = require('express-graphql');

var schemas = require('./src/schema/schema');
var tokenService = require('./src/services/token-service');

var root = {
    token: tokenService.getToken,
    tokens: tokenService.getTokens
};

var app = express();
app.use('/graphql', graphqlHTTP({
    schema: schemas.schema,
    rootValue: root,
    graphiql: true
}));

app.listen(8080, () => console.log('Express GraphQL Server Now Running On localhost:8080/graphql'));

Finally the Express server is created with a GraphQL endpoint:
http://localhost:8080/graphql

The result of our application is that:

b6a8241aa43e9400a724ee63e5ed609f77e07082303933fd3f86cfaf9e04ebc3.png

Go in our powershell, and digit:

node server.js

After a few second we have this result in powershell:

Express GraphQL Server Now Running On localhost:8080/graphql

Now we can open browser and digit in url http://localhost:8080/graphql, this is the result:

GraphQL Server

In left side, we just insert our query, after that we must click button run and we have the result in right

token id

tokens

tokens name

 

This is the tecnology that "The Graph" cryptocurrency use.

 

If you like this post, follow me on Twitter Denis

How do you rate this article?

6


T89
T89

I'm a web developer that want to always improve


Only programming
Only programming

The posts in this Blog want to teach the base of programming and explain basic concepts of programming. The languages we use are: - Typescript / javascript (FrontEnd Angular, BackEnd Deno, Node.js); - C# .net Core (Web api BackEnd).

Send a $0.01 microtip in crypto to the author, and earn yourself as you read!

20% to author / 80% to me.
We pay the tips from our rewards pool.