Skip to content

Latest commit

 

History

History
186 lines (138 loc) · 7.93 KB

File metadata and controls

186 lines (138 loc) · 7.93 KB

Terminally Onchain

Terminally Onchain Bridge

Call any contract on Base from your Solana wallet

Call any contract on Base from your Solana wallet

Terminally Onchain Bridge Next.js TypeScript

🌉 features

  • Bridge: SOL + SPL bridging between Solana Devnet/Mainnet and Base Sepolia/Mainnet
  • Networks: One-click toggle between Solana Devnet ↔ Base Sepolia and Solana Mainnet ↔ Base Mainnet
  • Base calls: Attach arbitrary Base contract calls with --call-* flags and ABI-encoded calldata
  • Faucet: Get SOL from Coinbase Developer Platform
  • Address resolution: Support for ENS names and Basenames
  • Balance: Live SOL balance tracking for connected wallet
  • Txn status: Complete bridge transaction history and status monitoring

🚀 quickstart

pre-reqs

  • Node.js 18+
  • npm or yarn
  • Solana wallet (Phantom, Solflare) to connect in the UI

installation

  1. clone the repo:
git clone https://github.com/Jnix2007/terminally-onchain.git
cd terminally-onchain
  1. install dependencies:
npm install --legacy-peer-deps
  1. copy env template:
cp env.template .env.local
  1. (optional) Add CDP API credentials to .env.local for faucet functionality:
CDP_API_KEY_ID=your_cdp_api_key_id
CDP_API_KEY_SECRET=your_cdp_api_key_secret

Set NEXT_PUBLIC_ENABLE_MAINNET=true in .env.local if you want the Solana ↔ Base mainnet option to appear in the UI. Leaving it undefined or any value other than "true" keeps the app on devnet/Base Sepolia only.

  1. start your dev server:
npm run dev
  1. open http://localhost:3000

🔧 how it woooorks

Bridge process

  1. connect wallet: Connect Solana wallet (Phantom/Solflare)
  2. get SOL: Use the integrated CDP Faucet to get SOL on Solana Devnet (only when you stay on devnet)
  3. enter details: Specify amount and destination (Base address, ENS, or Basename on the active network)
  4. Bridge! Execute the bridge txn
  5. monitor: Track txn status in real-time

architecture

  • frontend: Next.js 15 with TypeScript and Tailwind CSS
  • Solana integration: Uses @solana/wallet-adapter and @solana/web3.js
  • Bridge contracts: Real Base/Solana bridge smart contracts
  • address resolution: ENS and Basename support via ethers.js
  • faucet: CDP (Coinbase Developer Platform) Faucet integration

🎨 UI theme

I was going for a fun "hacker" aesthetic:

  • colors: Bright green (#00ff00) on black background
  • font faces: JetBrains Mono and Orbitron fonts
  • animations: Matrix rain effects and glowing text
  • logo: Pixelated suspension bridge with animated effects

📱 components

  • Faucet section: Get SOL from CDP with rate limiting info, and backup link to SF faucet in case I've exceeded CDP Faucet limits
  • Bridge form: Input validation & address resolution
  • Balance display: SOL balance tracking
  • Transaction history: Status tracking
  • Wallet integration: Wallet connection

🔗 networks

  • default: Solana Devnet → Base Sepolia (includes CDP SOL faucet integration)
  • mainnet: Solana Mainnet → Base Mainnet (no faucet; bring your own SOL)
  • Faucet: CDP Solana Devnet SOL Faucet
  • Backup Faucet: faucet.solana.com

🛠️ development

project structure

terminally-onchain/
├── src/
│   ├── app/                 # Next.js app router
│   ├── components/          # React components
│   ├── lib/                 # Utilities and services
│   └── styles/              # Global styles
├── bridge-contracts/        # Base bridge contracts
├── bridge-solana/          # Solana bridge programs
└── public/                 # Static assets

key files

  • src/lib/bridge.ts - Main bridge service
  • src/lib/realBridgeImplementation.ts - Bridge txn logic
  • src/lib/cdpFaucet.ts - CDP faucet integration
  • src/lib/addressResolver.ts - ENS/Basename resolution
  • src/components/MainContent.tsx - Main app interface

🔐 security

  • no private keys: Uses wallet adapter for secure signing
  • address validation: Validates all addresses before transactions
  • error handling: Comprehensive error handling and user feedback
  • rate limiting: Respects faucet rate limits

🤝 contributing

Feel free to fork & whatever, building in the open here

  1. fork the repo
  2. create a feature branch: git checkout -b feature/amazing-feature
  3. commit your changes: git commit -m 'Add amazing feature'
  4. push to the branch: git push origin feature/amazing-feature
  5. open a PR

📄 license

This project is licensed under the MIT License - see LICENSE file for details.

🙏 acknowledgments

The Base team that put this together is cracked and it was dope to be at Basecamp in-person when this was announced.

  • Base for the bridge infra
  • Coinbase Developer Platform for faucet services & general badassery
  • Solana for the blockchain infra
  • The open-source community for the amazing tools and libraries used along the way

🔗 links & useful onchain addresses


"Base is a bridge, not an island." 🌉 Play positive-sum games, win positive-sum prizes.