Solana Wallet Explorer
The Solana Wallet Explorer leverages a QuickNode Solana Endpoint to retrieve token balances, transaction history, and NFTs for a specified wallet on the Solana blockchain.

Overview
The Solana Wallet Explorer leverages a QuickNode Solana Endpoint to retrieve token balances, transaction history, and NFTs for a specified wallet on the Solana blockchain. It uses a Next.js 14 project bootstrapped with create-next-app
.
Getting Started
Install Dependencies
First, install the dependencies:
npm install
# or
yarn
# or
pnpm install
# or
bun install
Set Environment Variables
Make sure you have a QuickNode endpoint handy--you can get one free here.
Rename .env.example
to .env.local
and update with your QuickNode Solana Node Endpoint. Enable the DAS API only if you have enabled the DAS add-on for your QuickNode Solana Node Endpoint.
SOLANA_RPC_URL=https://example.solana-mainnet.quiknode.pro/123456/
DAS_API_ENABLED=true
NEXT_PUBLIC_FETCH_JUPLIST=true
First, run the development server:
npm run dev
# or
yarn dev
# or
pnpm dev
# or
bun dev
Open http://localhost:3000 with your browser to see the result.
Using the Dapp
Search for a Solana wallet address and press enter.
The Dapp will redirect to /wallet/[address]
and query the Solana blockchain for the wallet's token balances, transactions, and NFTs. Results are rendered in respective cards.
Architecture
src/
├── app/
│ └── api/
│ └── wallet/
├── components/
├── explorer/
└── header/
api
- Contains the API routes for the Solana RPC calls. These can be accessed from the client via/api/wallet/[method]?walletAddress=[address]
. These GET requests utilize the@solana/web3.js
library and Metaplex Digital Asset Standard framework to handle queries.components
- Contains the React components for the dapp.- The
explorer
component contains client-side components that call the API routes and render the results. - The
header
component contains the search bar for the dapp.
- The
Deploy on Vercel
Preview
Next.js Documentation
To learn more about Next.js, take a look at the following resources:
- Next.js Documentation - learn about Next.js features and API.
- Learn Next.js - an interactive Next.js tutorial.
You can check out the Next.js GitHub repository - your feedback and contributions are welcome!
- Fork the repository
- Create a feature branch:git checkout -b feature/amazing-feature
- Commit your changes:git commit -m "Add amazing feature"
- Push your branch:git push origin feature/amazing-feature
- Open a Pull Request.