An NFT viewer for collections or what wallet owns.
This is the code part of the tutorial "Gallery-View" for the web3 Hackathon
This web app lets you:
- View the nfts that other persons posses
- View nfts owned by someone
You can view the proyect online at this site: webapp (Online proyect is on Goerly Chain).
To make it work put an address of the Goerly Chain and see the NFTs that it collects.
If you want to view a demostration of how it works or how to use it properly please refer to the
hackathon academy video.
Frist of all you will need NodeJs and Yarn installed in a LTS version.
- Clone the repo and install the dependencies:
git clone <thisrepo>
cd ./gallery-view
yarn install
-
Go to alchemy.com and create an app to have key access.
Then create a .env.local file at the root folder and put inside:
(Note that the url env variable will determine the Ethereum chain that your proyect will use)
!!!Note!!!: When writting the API URL you should remove everything to the rigth of /v2/.
The URL will define the chain that your proyect will use, for the demo to work please use Goerly.
ALCHEMY_API_KEY="youralchemykey"
ALCHEMY_API_URL="the url till the/v2/"
- Run the app by just run
yarn dev # only for development mode
yarn build && yarn start # for production mode
These are the tecnologies used in this repo:
- NextJS (TypeScript)
- React Dom
- Alchemy NFTs APIs
- Aprhodite (For styling like react native)
!! Important !! The key part on this proyect is under the file src/pages/api/nfts.ts.