The Complete Guide to Full Stack Solana Development with React, Anchor, Rust, and Phantom

Code examples to go with the blog post available here

Header image

Prerequisites

  1. Node.js – I recommend installing Node using either nvm or fnm

  2. Solana Tool Suite – You can see the installation instructions here. note – I had a very hard time getting everything working on an M1 Mac, mainly solana-test-validator and cargo-build-bpf. I finally figured it out, and posted my solution here. I’m sure at some point this will be fixed and work out of the box.

  3. Anchor – Anchor installation was pretty straight-forward for me. You can find the installation instructions here.

  4. Solana browser wallet – I recommend Phantom, which is what I have tested this app with.

To build

  1. Clone the repo

git clone [email protected]:dabit3/complete-guide-to-full-stack-solana.git

  1. Change into the project directory you’d like to run

  2. Install the dependencies

npm install
  1. Start a local Solana node

solana-test-validator
  1. Build the anchor project

anchor build
  1. Fetch the project ID for the build:

solana address -k target/deploy/<programname>-keypair.json

  1. Update the project ID in the Rust program located at projectname/programs/src/programname.rs with the output from above.

  2. Run the tests

anchor test
  1. Change into the app directory and install the dependencies:

cd app && npm install
  1. Run the client-side app

npm start

GitHub

https://github.com/dabit3/complete-guide-to-full-stack-solana-development