Ecosyste.ms: Awesome
An open API service indexing awesome lists of open source software.
https://github.com/alchemyplatform/Build-Your-NFT-Explorer
A simple demo to show case how Alchemy's NFT API works.
https://github.com/alchemyplatform/Build-Your-NFT-Explorer
alchemyapi reactjs wagmi web3 web3js
Last synced: about 2 months ago
JSON representation
A simple demo to show case how Alchemy's NFT API works.
- Host: GitHub
- URL: https://github.com/alchemyplatform/Build-Your-NFT-Explorer
- Owner: alchemyplatform
- Created: 2022-01-20T16:04:27.000Z (almost 3 years ago)
- Default Branch: main
- Last Pushed: 2022-04-20T08:27:11.000Z (over 2 years ago)
- Last Synced: 2024-08-03T13:03:43.658Z (5 months ago)
- Topics: alchemyapi, reactjs, wagmi, web3, web3js
- Language: JavaScript
- Homepage: https://nft-explorer-sandy.vercel.app/
- Size: 911 KB
- Stars: 119
- Watchers: 13
- Forks: 51
- Open Issues: 3
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
- awesome-web3-tools-and-dapps - NFT Explorer - Explore the repository containing files for the Alchemy NFT API demo project walkthrough. (dApps directory / NFT App Templates)
README
Alchemy NFT API Demo
Find, verify, and display any NFT with ease.
Full YouTube Tutorial »
Explore the docs
·
Report Bug
·
Request Feature
Table of Contents
## About The Project
Build your own multi-chain NFT Explorer using the new Alchemy NFT API!
Built on top of ReactJs, this repo showcase the functionalities of the [Alchemy NFT API](https://www.alchemy.com/nft-api):
- Keep track of your NFTs
- Search NFTs by collection
- Filter by an NFT Smart Contract address
and display the images, attributes, collection name, and creator of your favorite NFTs.
Supporting both ERC1155 and ERC721!
### Built With
* [Alchemy](https://www.alchemy.com)
* [React.js](https://reactjs.org/)
* [TailwindCSS](https://getbootstrap.com)
## Getting Started
Getting started is super simple! Follow the following steps and start fetching NFTs on Ethereum!
### Prerequisites
- Node >= 16.13.x
### Installation
1. Clone the repo
```sh
git clone https://github.com/alchemyplatform/Build-Your-NFT-Explorer.git
```
2. Install the dependencies
```sh
npm install
```
3. Create an account on [Alchemy.com](https://www.alchemy.com/)
4. Grab your Alchemy API Key
5. Update `const apiKey = "demo";` in `src/utils/fetchNFTs.js` with your Alchemy API Key
6. Run the application
```sh
npm start
```
## Usage
1. Insert a wallet address in the input field to retrieve all Ethereum NFTs associated with that address
2. Insert the Smart contract address to retrieve owned NFTs by contract address
_For more examples, please refer to the [Documentation](https://docs.alchemy.com/alchemy/enhanced-apis/nft-api)_
## Contributing
Contributions are what make the open source community such an amazing place to learn, inspire, and create. Any contributions you make are **greatly appreciated**.
If you have a suggestion that would make this better, please fork the repo and create a pull request. You can also simply open an issue with the tag "enhancement".
Don't forget to give the project a star! Thanks again!
1. Fork the Project
2. Create your Feature Branch (`git checkout -b feature/AmazingFeature`)
3. Commit your Changes (`git commit -m 'Add some AmazingFeature'`)
4. Push to the Branch (`git push origin feature/AmazingFeature`)
5. Open a Pull Request
## License
Distributed under the MIT License.
## Contact
- [@AlchemyPlatform](https://twitter.com/AlchemyPlatform)
- [Discord](https://www.alchemy.com/discord)
This repo was originally created by the wonderful:
- [@VittoStack](https://twitter.com/VittoStack)
- [@thatguyintech](https://twitter.com/thatguyintech)