Solana 钱包浏览器

Solana 钱包浏览器利用 Quicknode Solana 端点，从 Solana 区块链上检索指定钱包的代币余额、交易记录和 NFT。

前端框架/库：

React/Next.js

语言：

TypeScript

构建工具/开发服务器：

Next.js

概述

Solana 钱包浏览器利用 Quicknode Solana 端点，从 Solana 区块链上检索指定钱包的代币余额、交易记录和 NFT。它使用一个 Next.js 14 该项目通过以下方式启动： create-next-app.

首先，安装依赖项：

npm 安装
# 或
yarn
# 或
pnpm 安装
# 或
bun install

请确保手头有一个 Quicknode 端点——您可以在这里免费获取一个。

重命名 .env.example 到 .env.local 并更新为您的 Quicknode Solana 节点端点。仅当您已为 Quicknode Solana 节点端点启用了 DAS 附加组件时，才应启用 DAS API。

SOLANA_RPC_URL=https://example.solana-mainnet.quiknode.pro/123456/
DAS_API_ENABLED=true
NEXT_PUBLIC_FETCH_JUPLIST=true

首先，运行开发服务器：

npm 运行 dev
# 或
yarn dev
# 或
pnpm dev
# 或
bun dev

请使用浏览器打开http://localhost:3000以查看结果。

搜索一个 Solana 钱包地址，然后按回车键。该 Dapp 将重定向至 /wallet/[地址] 并查询 Solana 区块链上该钱包的代币余额、交易记录和 NFT。查询结果将显示在相应的卡片中。

src/
├── app/
│   └── api/
│       └── wallet/
├── components/
    ├── 浏览器/
    └── header/

api - 包含用于 Solana RPC 调用的 API 路由。客户端可通过以下方式访问这些路由： /api/wallet/[method]?walletAddress=[address]. 这些 GET 请求使用了 @solana/web3.js 库和 Metaplex 数字资产标准框架来处理查询。
组件 - 包含该去中心化应用（dapp）的 React 组件。
- 该 资源管理器 该组件包含客户端组件，这些组件会调用 API 路由并渲染结果。
- 该 页眉 该组件包含该去中心化应用（dapp）的搜索栏。