This Project is a fork of Ethereum Boilerplate and demonstrates how you can build your own NFT Rarity Ranker.

Overview

Rarity-Ranking-NFT

This Project is a fork of Ethereum Boilerplate and demonstrates how you can build your own NFT Rarity Ranker.

Preview

⭐️ Star us

If this boilerplate helps you build Ethereum dapps faster - please star this project, every star makes us very happy!

🚀 Quick Start

📄 Clone or fork Rarity-Ranking-NFT:

git clone https://github.com/IAmJaysWay/Rarity-Ranking-NFT.git

🔎 Navigate to the generator folder and initialize the rarity generator and install moralis

cd Rarity-Ranking-NFT
cd generator
npm init
npm install moralis

🖼️ Provide your appId and serverUrl and desired collectionAddress and collectionName in the main.js file

const serverUrl = ""; //Moralis Server Url here
const appId = ""; //Moralis Server App ID here

const collectionAddress = ""; //Collection Address Here
const collectionName = ""; //CollectioonName Here

🏃 Run the Rarity Generator

node main.js

💿 Return to the Origin Repo and Install all dependencies:

cd -
yarn install 

Rename .env.example to .env in the main folder and provide your appId and serverUrl from Moralis (How to start Moralis Server) Example:

REACT_APP_MORALIS_APPLICATION_ID = xxxxxxxxxxxx
REACT_APP_MORALIS_SERVER_URL = https://xxxxxx.grandmoralis.com:2053/server

🎁 In /src/components/QuickStart.js Add the NFT collection as an Option(s) to the Select Input (with value corresponding to the collectionName used when running the rarity generator)

Collcetion Name ">
<Option value="YOUr COLLECTION NAME"> Collcetion Name </Option> 

🚴‍♂️ Run your App:

yarn start
Comments
  • Error: Cannot find module 'rxjs'

    Error: Cannot find module 'rxjs'

    keep getting this error, everything is installed properly and looked around for solutions, I've tried npm install --save rxjs-compat but that didn't work.

    opened by mattsegura 1
  • Getting TypeError: Cannot read property 'attributes' of null error

    Getting TypeError: Cannot read property 'attributes' of null error

    I keep getting a TypeError: Cannot read property 'attributes' of null error on line: let metadata = allNFTs.map((e) => JSON.parse(e.metadata).attributes);

    If I limit the i < 1500 on line 29 I do not get the error (but obviously do not get the full collection).

    any thoughts? Thanks

    opened by Prker 1
  • can we open this back up

    can we open this back up

    not sure if this thread got hidden since it's closed. curious to hear your thoughts. have a nice new year.

    https://github.com/IAmJaysWay/Rarity-Ranking-NFT/issues/1

    opened by ericlam1114 0
  • Update script to work with the updated Moralis lib

    Update script to work with the updated Moralis lib

    Moralis has removed its feature to be able to use "offset" to fetch specific data. That is changed to "cursor".

    Read more; https://docs.moralis.io/misc/rate-limit#example-of-how-to-use-cursor-nodejs

    I managed to update your script to import using cursor.

    Moralis is also limiting requests, you can easily update your cloud database settings via; https://docs.moralis.io/moralis-dapp/web3-api/rate-limit

    opened by thomasansems 0
  • Load collection when page loads

    Load collection when page loads

    Has anyone tried to load the collection initially when the page loads, instead of loading it using a drop down? I want to be able to call the collectionChanged(collection) function when the application starts. How can one do that?

    image

    opened by tdev00 0
  • cannot read properties of undefined reading map:

    cannot read properties of undefined reading map:

    file:///C:/Users/josh/Downloads/sqddd/Rarity-Ranking-NFT-main/generator/main.js:56 let nftTraits = metadata[j].map((e) => e.trait_type); ^

    TypeError: Cannot read properties of undefined (reading 'map') at generateRarity (file:///C:/Users/josh/Downloads/sqddd/Rarity-Ranking-NFT-main/generator/main.js:56:29) at processTicksAndRejections (node:internal/process/task_queues:96:5)

    opened by boshjerns 0
  • Define a default collection shown when opening the page

    Define a default collection shown when opening the page

    There should be an option / easy way to not have an empty page in the browser when opening it. Instead it would be good to show a default / pre-defined collection already.

    How can this be achieved ?

    opened by rmwa 0
  • Cannot read properties of null (reading 'attributes')

    Cannot read properties of null (reading 'attributes')

    TypeError: Cannot read properties of null (reading 'attributes') at /Users/timemachine/Downloads/Rarity-Ranking-NFT-main/generator/main.js:38:59 at Array.map (<anonymous>) at generateRarity (/Users/timemachine/Downloads/Rarity-Ranking-NFT-main/generator/main.js:38:26)

    I keep getting this error when trying to run the rarity generator.
    
    I tried the repo and watching the tutorial video, ended up with the same problem each time.
    
    Any ideas?
    
    opened by coffeeclubnfts 9
Owner
null
Write your own version of React. Why? Because you CAN!

Write your own version of React. Why? Because you CAN!

vutr 25 Oct 8, 2022
How to mint your own NFT token with react

Mint your own basic off chain NFT Description This project teaches you how to mint your own NFT token. Here are some important packages that we will b

null 6 May 17, 2022
Ethereum's missing NFT swap library for web3 developers. Written in TypeScript. Powered by 0x.

NFT Swap SDK _The missing NFT swap SDK for Ethereum and EVM compatible chains, powered by the 0x protocol, written in TypeScript for web3 developers.

trader.xyz 191 Dec 25, 2022
Ethereum nft marketplace template using react

ethereum-marketplace-template ⭐️ Star us If this boilerplate helps you build Ethereum dapps faster - please star this project, every star makes us ver

Ethereum Boilerplates 73 Dec 17, 2022
React-NFT-App - NFT-Web-Application built using Third web , ReactJs and use Crypto Punks with API

Getting Started with Create React App This project was bootstrapped with Create React App. Available Scripts In the project directory, you can run: np

Ali Aftab Sheikh 8 Oct 24, 2022
a fork version of vitesse-webext, but with react

@aiou/webext-template a fork version of vitesse-webext, but with react A Vite powered WebExtension (Chrome, FireFox, etc.) starter template. Edit on S

ruaaa 12 Dec 2, 2022
A guide to building your own React stack, explaining options and tradeoffs along the way

Custom React Stack React has a very rich ecosystem. For anything you want to do, there is probably a library or a framework available for it. That's g

Naresh Bhatia 13 Nov 23, 2022
my-watchlist is a web application for creating your own watchlist.

my-watchlist is a web application for creating your own watchlist. The website tracks your created watchlist, so that you can comeback anytime and pick from where you left.

Ashish Poudel 4 Jun 25, 2022
Crypt Eye, Your very own personal crypto currancy journal.

Crypt Eye Description Crypt Eye, Your very own personal crypto currancy journal. Patch 1.0 Features: TradingView Powered Chart Widget Stay on top of y

Pat Brown 1 Jul 8, 2022
Pimp my README is an open source profile builder that you can use to add some cool components to your README profile - Made with <3 by webapp.io :)

Pimp my README This repository is the open-source project for Pimp my README. How this came to be So basically, GitHub added a feature where you can a

Joshua D'Souza 105 Dec 27, 2022
A plug-and-play hook that will send data about Ethereum contract interactions straight to FullStory

use-fullstory-web3 Automatically record web3 events into FullStory useFullStoryWeb3 is a plug-and-play hook that will send data about Ethereum contrac

Ralf Popescu 2 Nov 24, 2021
A React Custom able cursor that can decorate your site also your hand is open to manipulate the cursor with css

custom-react-cursor A React Custom able cursor that can decorate your site also your hand is open to manipulate the cursor with css Demo live Installi

amirhossein 18 Nov 9, 2022
Example implementation of how to implement Sign In with Ethereum

Sign in with Ethereum authentication flow A basic example of how to create an authentication flow using Next.js, public key encryption, and an Ethereu

Nader Dabit 88 Jan 4, 2023
Blockchain-Cryptogram - Decentralized Social Media web app using Ethereum Blockchain

Decentralized Social Media web app using Ethereum Blockchain. Team Details Team

achyut 11 Dec 6, 2022
This is used for minting NFTs and getting metadata , token owner, wallet address assigned to an NFT, just check it out and enjoy

nft-minter A Heroku web server to easily mint non-fungible tokens via an API Example Configuration: Blockchain: Ethereum Testnet: Rinkeby Contract: ER

John Oseni 9 Aug 24, 2022
React project with Google Firebase API, create partys with admin view and user view. Users can ask topics to admin, and support other topics.

?? Tecnologias Esse projeto foi desenvolvido com as seguintes tecnologias: React Firebase TypeScript ?? Como executar Clone o projeto e acesse a pasta

Felipe Souza 3 Aug 27, 2021
NFT Marketplace prototype using Typescript, WalletConnect, Metamask, Web3, Solidity, React and Storybook

ERC721 NFT Marketplace Prototype of a NFT Marketplace based on openZeppelin abstract upgradeable ERC721 contracts and Minting/uploading images to IPFS

CryptoMoon 3 Jul 4, 2022