DEV Community

Om More for Gitpod

Posted on

Gitpod x Blockchain

Save your hours for blockchain development by removing hard setup on Gitpod.

First lets see this repo StoreFront_contracts
This project is build with hardhat and also has TheGraph powered indexer in subgraph.
The project provides NFT based smart contract like ERC721 build on top of openzeppelin contracts.

Now lets assume this is your project and you want your co-worker or friend to start with it, well then he can right?

Nope, that's not that easy.
Try to construct the steps required to do the steps.

Like,

Step 1 - Clone (Yeaaaaah!)
Step 2 - Install packages (You have npm right? 😏)

om@linux-pc:/# npm
bash: npm: command not found
om@linux-pc:/# 
Enter fullscreen mode Exit fullscreen mode

Step 3 - Install node, npm and npm i (How come you don't have npm
😔)
Step 4 - Start local ethereum node

npm install -g ganache-cli && ganache-cli -h 0.0.0.0 -m "$MNEMONIC"
Enter fullscreen mode Exit fullscreen mode

Ooof thats going to take time and with another such painful 4-5 steps.


How to fix this?

Easy, just use gitpod.

Try going to this link now and see the magic, everything should be up and running.

Now new window should open,
just append subgraphs/name/TheLazarusNetwork/MyriadFlow to url and hit **Enter**

Here you can write any graphQL queries and get the needed data.
For example try

{
  tokens{
    id
    metaDataUri
  }
}
Enter fullscreen mode Exit fullscreen mode

Now try changing scripts/deploy.ts line 48 to

 await creatify.createArtifact("https://ipfs.infura.io/ipfs/itworks")
Enter fullscreen mode Exit fullscreen mode

By the way this field is for ipfs hash, itworks is not valid ipfs hash it is just used here for testing.

Now check your terminal,
Terminal after changes to code everything should be redploying live and then you can rerun the query and see that the new ipfs hash is there. Its like live reloading in blockchain development, isn't it?


How is that happening?

Again easy, just write gitpod config, like provide initial scripts, start up scripts and custom docker image, like we did that in our repo

---
image:
  file: .gitpod.Dockerfile
ports:
  - name: Graph query
    port: 8000
    visibility: private
    onOpen: open-browser

tasks:
  - init: |
      npm install
      cd subgraph && yarn install && cd -
    command: gp sync-done depinit
  - name: Ethereum Node
    command: ganache-cli -h 0.0.0.0 -m "$MNEMONIC"
  - name: Graph Node
    command: |
      cd /home/gitpod/graph-docker/graph-node/docker
      docker-compose up -d
      sleep 10
      gp sync-done graphnode
  - name: Create deploy
    command: |
      gp sync-await depinit
      gp sync-await graphnode
      gp await-port 8020
      cd subgraph && yarn create-local && cd -
      gp sync-done graphdeploy
  - name: Smart contract
    command: |
      gp sync-await depinit
      gp sync-await graphdeploy
      gp sync-await graphnode
      gp await-port 8020
      ./watch.sh

vscode:
  extensions:
    - dbaeumer.vscode-eslint
    - graphql.vscode-graphql
    - juanblanco.solidity
Enter fullscreen mode Exit fullscreen mode

Why not gave it a try with your own blockchain project, there is whole easy documentation https://www.gitpod.io/docs

Also you can contact me and join discord server.

Happy coding 👋

Top comments (0)