Duffel

A professional Solana trading terminal with real-time market data from Backpack Exchange.

duffel.mp4

Features

• Live candlestick charts via Lightweight Charts with real OHLC data
• Real-time order book with depth visualization and flash animations on updates
• Live trade feed streaming recent trades with buy/sell color coding
• Multi-market support — SOL, BTC, ETH, WIF, JUP, BONK against USDC
• Graceful fallback — mock data fills in if the API is unreachable; a LIVE/DEMO indicator shows status

Tech Stack

• Next.js 16 with App Router and TypeScript
• Tailwind CSS 4 for styling
• Lightweight Charts for the candlestick chart
• Backpack Exchange API for real-time market data (no API key required)

Getting Started

# Install dependencies
npm install

# Start dev server
npm run dev

Open http://localhost:3000.

How It Works

The app proxies requests to Backpack Exchange's public API through Next.js rewrites to avoid CORS issues:

/api/backpack/klines  → api.backpack.exchange/api/v1/klines
/api/backpack/depth   → api.backpack.exchange/api/v1/depth
/api/backpack/trades  → api.backpack.exchange/api/v1/trades

Data refreshes automatically:

• Klines: every 60 seconds
• Order book + trades: every 2 seconds

Live Demo

https://duffel.vercel.app

License

MIT