Solana NFT Art Gallery DApp

A decentralized NFT marketplace built on Solana blockchain where artists can mint, list, and sell their digital artwork as NFTs.

Features

• 🎨 NFT Minting: Artists can create and mint NFTs with metadata stored on IPFS
• 🖼️ Gallery: Browse all available NFTs in a beautiful gallery view
• 💰 Buy/Sell: List NFTs for sale and purchase from other artists
• 👤 Artist Profiles: View artist portfolios and their collections
• 📱 Wallet Integration: Connect with Phantom and Solflare wallets
• ☁️ IPFS Storage: Images and metadata permanently stored via Pinata

Tech Stack

• Frontend: React + TypeScript + Vite
• Blockchain: Solana (Anchor Framework)
• Styling: Tailwind CSS + shadcn/ui
• Storage: IPFS via Pinata
• Wallet: Solana Wallet Adapter

Prerequisites

• Node.js 18+ and pnpm
• Solana CLI and Anchor Framework (for contract development)
• Pinata account for IPFS uploads

Setup

1. Install Dependencies

pnpm install

2. Configure Environment Variables

Create a .env file in the root directory:

cp .env.example .env

Edit .env and add your Pinata JWT token:

VITE_PINATA_JWT=your_pinata_jwt_token_here
VITE_CHAIN=devnet

Getting a Pinata JWT Token:

1. Sign up at Pinata.cloud
2. Go to API Keys section
3. Create a new API key with pinning permissions
4. Copy the JWT token to your .env file

3. Smart Contract Setup

The Solana program is already deployed on devnet. The program ID and metadata are located in:

• contracts/interfaces/metadata.json
• src/idl/my_program.json

If you need to redeploy:

cd contracts
anchor build
anchor deploy

4. Run Development Server

pnpm dev

The app will be available at http://localhost:5173

Project Structure

├── contracts/                 # Solana smart contract (Anchor)
│   ├── programs/my-program/  # Program source code
│   ├── interfaces/           # Deployment metadata
│   └── target/idl/           # Generated IDL
├── src/
│   ├── components/           # React components
│   ├── contexts/             # Wallet provider context
│   ├── hooks/                # Custom hooks (useProgram, etc.)
│   ├── pages/                # Page components
│   ├── utils/                # Utilities (Pinata, Solana config)
│   └── idl/                  # Program IDL for frontend
└── .env                      # Environment variables

Smart Contract Instructions

The Solana program supports the following instructions:

• mint_nft: Create a new NFT with metadata
• list: List an NFT for sale at a specified price
• buy: Purchase a listed NFT
• cancel: Cancel an NFT listing
• fetch_artist_nfts: Query all NFTs by an artist

Usage

For Artists

1. Connect your Solana wallet (Phantom or Solflare)
2. Navigate to "Create NFT"
3. Upload your artwork image
4. Fill in NFT details (name, symbol, description)
5. Click "Mint NFT" and confirm the transaction
6. Your NFT will be uploaded to IPFS and minted on Solana

For Collectors

1. Browse the gallery on the home page
2. Click on any NFT to view details
3. Purchase listed NFTs by clicking "Buy Now"
4. View your collection in "My NFTs"

Environment Variables

Variable	Description	Required
VITE_PINATA_JWT	Pinata JWT token for IPFS uploads	Yes
VITE_CHAIN	Solana network (devnet/testnet/mainnet)	Yes

Development

Type Checking

pnpm run type-check

Build for Production

pnpm run build

Preview Production Build

pnpm run preview

Troubleshooting

"Pinata JWT token not configured" Error

Make sure you've created a .env file and added your Pinata JWT token:

VITE_PINATA_JWT=your_actual_jwt_token_here

Wallet Connection Issues

• Ensure you have Phantom or Solflare wallet extension installed
• Make sure your wallet is set to the correct network (devnet/mainnet)
• Try refreshing the page and reconnecting

Transaction Failures

• Check that you have sufficient SOL for transaction fees
• Verify the program is deployed on the correct network
• Check browser console for detailed error messages

License

MIT