Thanks to visit codestin.com
Credit goes to github.com

Skip to content

sylesh7/FlappySol

Repository files navigation

FlappySol - Solana Blockchain Game

This project is a Flappy Bird-style game built with React that integrates with the Solana blockchain to store high scores using an on-chain smart contract written in Rust and deployed with Anchor.


ScreenShots

Screenshot (11)

Screenshot (12)


1. Tech Stack Overview

Frontend (React + Solana Wallet Integration)

  • React – JavaScript library for building UIs
  • @solana/web3.js – Solana’s JS API for interacting with the blockchain
  • @solana/wallet-adapter-react – React hooks and context for wallet connection
  • @solana/wallet-adapter-wallets – Provides wallet implementations (Solflare, Phantom, etc.)
  • @solana/wallet-adapter-react-ui – Prebuilt UI components for wallet connection
  • @solana/wallet-adapter-solflare – Solflare wallet adapter
  • @project-serum/anchor – Anchor TypeScript client for interacting with Solana smart contracts
  • borsh – Binary serialization for Rust/JS interoperability
  • buffer, process, stream-browserify – Polyfills for Node.js modules in browser
  • ajv, ajv-keywords – JSON schema validation
  • react-app-rewired – Customize Create React App config without ejecting

Solana Smart Contracts (Programs)

  • Rust – Programming language for Solana smart contracts
  • Cargo – Rust’s package manager
  • Anchor – Framework for Solana smart contract development

2. Frontend Installation (Node.js + React)

Make sure you have Node.js and npm installed. In the project root, run:

npm install @solana/web3.js @solana/wallet-adapter-react @solana/wallet-adapter-wallets @solana/wallet-adapter-react-ui @solana/wallet-adapter-solflare borsh buffer
npm install @project-serum/anchor
npm install --save-dev @babel/plugin-proposal-private-property-in-object buffer process stream-browserify
npm install --save-dev react-app-rewired
npm install [email protected] [email protected] --save-dev --legacy-peer-deps

Start the development server:

npm start

3. Solana, Rust, Cargo, and Anchor Setup

A. Install Rust & Cargo

curl --proto '=https' --tlsv1.2 -sSf https://sh.rustup.rs | sh

Restart your terminal and verify:

rustc --version
cargo --version

(Optional) Update Rust:

rustup update

B. Install Solana CLI

sh -c "$(curl -sSfL https://release.solana.com/v1.17.20/install)"

After installation, add Solana CLI to your PATH if needed. Then verify:

solana --version

C. Install Anchor

cargo install --git https://github.com/coral-xyz/anchor avm --locked --force
avm install latest
avm use latest

Verify installation:

anchor --version

D. Additional Requirements

  • Node.js (Already installed)
  • Yarn (optional)

4. Building and Deploying Solana Programs

A. Using Anchor Locally

Build the Program:

anchor build

Test the Program:

anchor test

Deploy to Localnet:

solana-test-validator
anchor deploy

Deploy to Devnet:

solana config set --url devnet
anchor deploy

After deploying, copy your program IDL:

cp target/idl/flappy_sol.json frontend/src/idl.json

B. Using Solana Playground

You can also build and deploy programs in-browser using:

These tools are great for testing and learning. For full projects, Anchor CLI is preferred.


5. Running the Full App

  1. Start Solana local validator (optional for local testing):

    solana-test-validator
  2. Deploy your program locally:

    anchor build && anchor deploy
  3. Start your frontend app:

    cd FlappySol
    npm start

About

Resources

License

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Contributors 2

  •  
  •