Ethereum Social Media Boilerplate

Moralis General
#1

Hey guys I’ve been working in a fork of the Moralis Ethereum Boilerplate designed to serve as basis to build Social Media based on the this contract.

The video tutorial in React is about to come out. Should you have any questions feel free to post here, our team was very involved in helping with this as well.

4 Likes
#2

This is amazing, I am looking to build something like it for my media outlet. I have over 116k followers on Instagram and alot of Celebs that follow. I would love your help in creating a decentralized blockchain social media news platform that is also ran by our ERC20 token.

-Will

2 Likes
#3

Hi, how do I deploy the smart contract in this repo to Avalanche mainnet? I have a Moralis node in moralis.io

#4

:bird: First of all, I’m totally grateful for this tutorial right now. Remixing it with a mapping of address => bool “honestUsers” and an Honesty event emitting address indexed user, bool isHonest.

I’ve noticed a slight bug in the boilerplate.

  1. fresh clone,
  2. yarn install,
  3. yarn start,
  4. authenticate
  5. in several if not all of the starter-components, dynamically created etherscan links to my NFTs are all set to Kovan, even when I’m on Rinkeby.

I’m moving on with the tutorial now, is this the preferred place for questions and comments?

#5

Hi @fifestarr

Thank you for the reports. Yes, feel free to ask your questions and post comments about the social media boilerplate here :raised_hands:

1 Like
#6

Thank you! I’ve made it through 57 minutes of the video and although I’ve left in a couple components and the footer, almost totally the same. I’ve compared my code as best I can to yours in the tutorial and in the final boilerplate. Nothing seems wrong. All the categories were working before adding the form, but now only the “default” category displays. That is to say, when I click on the categories, the “choose a category” notice disappears and is replaced by nothing. Will continue following along without checking and just hope that eventually things work. If they don’t, I’ll just restart from the final boilerplate and work in reverse. Any advice? @DanielWeb3

#7

I’ve even tried moving all the content from within the else (selectedCategory[“category”] === “default”) to with that “default” if, and it works in there. Just somehow selecting the category doesn’t set the selected category? Going to put some console.log’s in the categories.jsx and see if i can find whats wrong

#8

I finally found it! in first line below the else { }, I was missing “result = (” and just had the divs.

The technique I used to find this was by testing the if bracket changing to one of the categories that I had already determined was properly captured,

if (selectedCategory[“category”] === “Web1”)

and then I saw all the forms and everything when I clicked Web1, so I knew exactly where it was, and while I was coding along, I finally noticed in your video the result = ( )!

Hope this helps someone else who also forgot that step or is ready to give up because of a bug :star_struck:

#9

truffle deploy command only compiles and deploys MetaCoin but not the decentradit.sol. Can someone suggest the best way to deploy on testnet and get contact addresses to be added to the Moralis watch and sync events.

#10

how can i find the contracts adress.

im here on the tuttorial. https://youtu.be/52BvLrj-KrE?t=1086

#11

Hi @demiro

You can check your last transactions in your wallet and there you will find “contract creation”

#12

i have download the boilerplate an have open in vscode an with tuttorial i am beginner iam here on tuttorial. sorry https://youtu.be/52BvLrj-KrE?t=1090

#13

Hi, I checked this new error by connecting my deployed test contract to the untouched SocialMedia project from your github repo, and can confirm it exists there too. However, it may be some error with my event monitoring or my contract.

image
image1145×779 72.2 KB

Basically, that one post stays in the UI and duplicates every time I navigate away from that category and back to it again. It also lives in all the other categories even if they are “empty”:
image
image699×813 57 KB

Any ideas?

#14

Hello. I am following along with the tutorial.
I cloned the files from git. I am not able to add or see create
I am able to start the react server but it does not look like yours does in the tutorial.
What have i missed ?

moralis
moralis1907×429 21.1 KB
categories.

#15

Im assuming from your user name that your a developer, I havnt watched the video yet because I want to make sure You can post images and videos before I dive to deep/The tutorial is pretty self explanatory, what exactly are you needing assistance with? Im looking to get into a project myself

#16

For deployment you will need remix, brownie, truffle or hardhat. Since it is a quick and dirty, maybe remix will be easier.
You will find information online on how to connect Remix to a web3 provider with the link to your RPC node for avalanche.

#17

I highly suspect that the issue here is that you have not deployed the contract. Check out the video around this marker.

#18

how comment can be added to below every post … did anyone implemented comment component to give an advice ?

#19

Hi Man, sorry for the late reply. I haven’t have the time to hang out here lately.

Since the first iteration of the post appears to have votes, and other two don’t I tend to think that most likely those post actually were created in the given categories.

I think you could go to your moralis dashboard and check the sync events of createdContent, createdPost to check what is the status of this content and post and whether it was created twice and in which categories.

2 Likes
#20

Hi, Thanks for following-up.

To implement the comments feature you will need something like this:

Context:
The comments are actually like posts the only difference is that they have a parent post identified by the corresponding parent Id when they are created. So basically what you will need to create is a component similar to the feed component that is a child to each Post, and that toggles when someone clicks view comments (or something like that). And also a form to place a comment.

Steps:

  • Change the behavior of the Posts component. https://github.com/ethereum-boilerplate/web3-social-network-boilerplate/blob/main/src/components/Feed/components/Posts.jsx.
    ** Instead of filtering only by category ID you will have to filter the categoryID equal categoryID and parentId equal to the wildcard that we are using to signal no parent ID (“0x91”).
    ** This will bring only original post of the category.
  • Create a comment button on each post to toggle a form to create a comment.
    ** The behavior of this will be similar to the AddPost component the difference is that instead of sending the post with the wildcard parentID of (“0x91”) you send the original post Id as the parent Id.
  • You create a component similar to the Feed component but that filters all post with parent Id equal to the parent Id of the original post.

It will require a bit of work, but I think though challenging you might find it rewarding to pull-it off.

2 Likes