Raxon: Crypto Trading & Portfolio App
Crypto trading and portfolio app with live market data, a real-time trading view, portfolio analytics and an AI assistant grounded in the market.
- Status
- Live
- Type
- Personal project
- Website
- raxon.melturham.me
About this project
Raxon is an open-source crypto trading and portfolio app. It brings live market data, a real-time trading view, portfolio analytics and an AI assistant into one interface.
Market data is real: prices, movers, sectors, news and sentiment come from CoinGecko, Binance and Alternative.me, and the trade page streams the order book and candles from Binance in real time. Accounts are simulated: a demo account holds a fixed portfolio and a year of trades executed at real daily prices, so every page shows consistent figures without a real exchange account.
My role: Solo developer: I built the whole app, from the interface to the data layer and the AI assistant, and released it as open source
Key features
Dashboard
Balance, portfolio value over time ranges, market leaders, top assets, top gainers and recent transactions.
Real-time trading
Live candlestick and depth charts, order book, recent trades and 24h ticker for each pair, with an order form and active orders.
Markets
Live tickers, top movers, sector performance, news scored by sentiment, spot and perpetual quotes, long/short sentiment and the Fear & Greed index.
Portfolio and analytics
Holdings, value history, watchlist and converter, plus realized P&L, win rate, max drawdown, asset allocation and trade statistics, exportable as a report.
Raxon AI
A chat assistant that answers with live market and portfolio data, with optional reasoning, market scan and news sources, voice input and AI signals per coin.
Sign-in and sign-up
Split-screen auth pages with a product preview, Google and Apple options, an optional referral code and a one-time notice that explains the demo. Forms are validated with React Hook Form and Zod.
Wallet and more
Step-by-step deposit, withdraw, swap and transfer flows, an OTC desk with indicative quotes, alert automations and a command palette search.
Technical approach
Live data over WebSockets
A Binance stream hook reconnects with exponential backoff and feeds the TanStack Query cache, so the order book, trades and candles update in place.
Server prefetch, keys kept server-side
Server components prefetch with TanStack Query and hydrate the client. Client refetches go through Next.js route handlers, so provider keys never reach the browser.
Streaming AI with fallbacks
The chat route builds a context from live prices, the portfolio, movers and headlines, then streams the answer from Groq, falling back through several models and reporting when the free quota is used up.
Consistent demo account
Deterministic trades valued at real Binance daily prices, with FIFO matching to compute realized P&L, fees and holding times.
Custom charts
Portfolio, performance, allocation and trading charts drawn with Visx and D3.
Feature-based architecture
Each product capability owns its UI, data access, types and actions, with shared infrastructure apart, in strict TypeScript. Environment variables are validated at startup.
What I built
- Built the whole app in Next.js and TypeScript: dashboard, markets, trade, portfolio, analytics, OTC, wallet flows and the AI assistant.
- Streamed the order book, trades and candles from Binance WebSockets into the TanStack Query cache, with automatic reconnection.
- Built the Raxon AI chat on Groq, grounded in live market and portfolio data, with streamed answers and model fallbacks.
- Modeled a deterministic demo account valued at real prices, with FIFO P&L for the analytics.
- Drew the charts with Visx and D3, and deployed on Vercel in Frankfurt so the Binance Futures API accepts the requests.
Built with
- Framework
- Next.js
- React
- TypeScript
- UI
- Tailwind CSS
- Base UI
- shadcn/ui
- Motion
- Data
- TanStack Query
- Axios
- WebSocket
- Charts
- Visx
- D3
- Forms
- React Hook Form
- Zod
- APIs
- Binance API
- CoinGecko API
- Groq