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

View Github