#NustaWeb3

#NustaWeb3

Say no more if you want to post updates on a web3 DApp

10

The problem #NustaWeb3 solves

#NustaWeb3 is a social media dapp that is built using IPFS, Moralis in React and with the help of ChakraUI.
The frontend is templated from OnlyUwU and changed according to the needs of the DApp.

This DApp let's users post an image to IPFS. The IPFS link of image is then stored with the caption and other metadata in the Moralis database.

Moralis Approach

This is the approach demoed in the video. The posts are uploaded to ipfs and stored in the Moralis DB using react-moralis hooks. Each time a user logs in, the feed is queried and all the posts in the DB are displayed to the user.
This approach was quite simple.

Subgraph Approach

Here I used a contract to emit events and store a few data points about the posts. These events were indexed using the subgraph for easy access. With a handful of events and functionalities, this approach is a lot more decentralised than the first one.
This is not the greatest use case of The Graph but it sure does work!
Technically the whole post.json can be uploaded to IPFS and retrieved in the

mapping

function. This would allow us to post captions along with the image to IPFS and index it with the subgraph.

I am yet to completely add IPFS functionalities to the subgraph. For example the post can be a json file and it can be parsed using the graph api and we can have the image as well as the caption indexed and added to the DB.
I tried my luck with it but there were some weird errors in the subgraph console I couldn't debug under pressure :p.

Challenges I ran into

The frontend project was bootstrapped with the help of an exisisting TypeScript project. It was my first time using typescript in React and oh was it not balloons and cakes! It was difficult to get sarted with custom typedefs and interfaces that extend moralis types.
But eventually I did get it right. Was it a pain? Yeah. Was it worth it? Yeah.

Discussion