6
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

本記事では、Next.js で Solana ベースの dApps を構築する際に役立つ npm ライブラリを紹介します。NFT の Mint、トークンの Claim、Solana プログラムとの通信、ウォレット連携など、実用的な機能に直結するライブラリを中心に取り上げます。
※Solana や web3 以外の技術スタックはこちらに記載。

対象読者

  • Solana の dApps を開発するエンジニア・PdM
  • Solana のビルダーやハッカソン参加者
  • MVP 開発を最短で進めたい Web3 スタートアップ関係者

dApps における Web ライブラリの役割

dApps における Web ライブラリは、主に以下の役割を担います。

dApps における web ライブラリの役割とは、主にウォレット接続の管理やスマートコントラクトとの CRUD です。特にトークン(FT・NFT)の操作。

  • ウォレット接続・署名の管理
  • スマートコントラクトとの通信(ちなみに(AO では Process、Solana では Program,Sui では Module と呼称)
  • トークン(FT・NFT)の Mint、Claim、表示
  • 分散ストレージからのデータ取得

@solana/kit

URL: @solana/kit
用途: トランザクション作成・送信、アカウント操作、プログラム呼び出し
利点: 公式ライブラリのため安定性が高く、TypeScript 完全対応
注意点: 2025 年 2 月に @solana/kitの後継としてリリースされたばかり。
選定理由: Solana dApps 開発の今後の必須基盤ライブラリ

This is the JavaScript SDK for building Solana apps for Node, web, and React Native.

npm i @solana/kit

@solana/web3.js

Solana ブロックチェーンとの基本的な通信を行うための公式 JavaScript ライブラリ。

URL: @solana/web3.js
用途: トランザクション作成・送信、アカウント操作、プログラム呼び出し
利点: 公式ライブラリのため安定性が高く、TypeScript 完全対応
注意点: 2025 年 7 月にリリースされた @solana/kit が推奨されている。ただ、歴史がある分使いやすい
選定理由: Solana dApps 開発の必須基盤ライブラリ

Use this to interact with accounts and programs on the Solana network through the Solana JSON RPC API.

npm i @solana/web3.js

@solana/wallet-adapter-react

React アプリケーションでの Solana ウォレット接続を管理するための標準ライブラリ。

URL: @solana/wallet-adapter-react
用途: ウォレット接続、署名処理、セッション管理
利点: 主要ウォレット(Phantom、Solflare 等)を統一的に管理、React Hooks 対応
選定理由: ユーザー認証とトランザクション署名の標準実装

This package exports a series of hooks that you can use to create custom wallet connection buttons. They manage the state of the wallet connection for you, and return helper methods that you can attach to your event handlers.

npm i @solana/wallet-adapter-base @solana/wallet-adapter-react @solana/wallet-adapter-react-ui @solana/wallet-adapter-wallets @solana/web3.js

@solana/spl-token

SPL(Solana Program Library)トークンの操作に特化したライブラリ。

URL: @solana/spl-token
用途: トークン作成、転送、燃焼、アカウント管理
利点: トークン操作の複雑な処理を抽象化、ガス効率最適化
選定理由: FT・NFT 操作の必須ツール

A TypeScript library for interacting with the SPL Token and Token-2022 programs.

npm i @solana/spl-token

@project-serum/anchor

Anchor フレームワークを使用した Solana プログラムとの通信ライブラリ。

URL: @project-serum/anchor
用途: Anchor プログラムの呼び出し、IDL を使用した型安全な操作
利点: 型安全性、開発効率向上、エラーハンドリング簡素化
選定理由: 現代的な Solana プログラム開発では標準的

TypeScript client for Anchor programs.

npm i @project-serum/anchor

@solana/buffer-layout

Solana アカウントデータのバイナリ構造を解析するための低レベルライブラリ。

URL: @solana/buffer-layout
用途: バイナリデータの構造化、カスタムプログラムデータの解析
利点: 柔軟なデータ構造定義、メモリ効率の最適化
選定理由: 低レベル API が必要な特殊用途に限定して利用

@solana/buffer-layout is a TypeScript fork of buffer-layout. Same API, just adds types and TypeScript docs.

npm i @solana/buffer-layout

参考: シリーズ記事

Claude Codeを使用した開発フロー(特にdApps)に最適なテンプレートを構築中で、各項目についてメモを残しています。

  1. Claude Code x MVP開発に最適なdApps要求定義
  2. Claude Code x MVP開発に最適なNext.jsディレクトリ構成
  3. Claude Code x MVP開発に最適なUXデザインガイド
  4. Claude Code x MVP開発に最適なNext.jsの状態管理パターン [Zustand, React Hook Form, TanStack Query]
  5. Claude Code x MVP開発の作業フロー(のメモ)
  6. AO dApps × Next.jsのnpmライブラリ選定 [2025年]
  7. EVM dApps x Next.jsのnpmライブラリ選定 [2025 年]
  8. Solana dApps × Next.jsのnpmライブラリ選定 [2025年]
6
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
6
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?