A go-to NFT minting application built with React and shadcn-ui UI library. It uses the Thirdweb APIs to integrate contract features. This project is a web application developed using modern web technologies, including React, TypeScript, TailwindCSS, and Vite. The project structure is set up for optimal development and build processes, with linting and type-checking integrated for code quality assurance.
Click the link to watch the minting step progress demo: https://github.com/thanhhoa214/nft-minting/blob/b8f820539e44f08f9f405d9b3e5ba786c91f83d0/minting/demo/demo.mov
- List all NFTs of the contract
- Filter NFTs by selecting an owner
- Upload file to IPFS
- Mint NFTs with comprehensive progress tracking and validations by
react-form-hookandzod - Expand an NFT detail at the Home Page
- Support dark-mode
📦 root
┣ 📂 demo - Demo folder
┣ 📃 demo.mov - Demo file
┣ 📃 home.jpeg - Demo file
┣ 📃 mint.jpeg - Demo file
┣ 📂 src
┃ ┣ 📂 components
┃ ┃ ┣ 📂 sections - sections of pages
┃ ┃ ┣ 📂 ui - shared components across the pages, initialized by `shadcn-ui`
┃ ┣ 📂 hooks - reused data-related hooks
┃ ┣ 📂 lib - library integration, util, ...
To get a local copy up and running, follow these steps:
- Clone the repository:
git clone https://github.com/thanhhoa214/nft-minting.git- Install the dependencies:
cd minting && npm install- Start the development server:
cd minting && npm run devThe application will be available at http://localhost:5173.
To build the application for production, use the following command to build it at dist destination:
npm run buildThank you so much for the interviews and valuable chats. Being a crypto holder, I would love to be a part of your team to accelerate Web3 adoption to the community!