Universal Accounts XStocks Trading App

A chain-agnostic stock trading demo powered by Particle Network’s Universal Accounts and xStocks.

Overview

Users can trade tokenized stocks like Apple, Google, Tesla, Microsoft, and Amazon — without ever worrying about which chain they’re on or what token they hold for gas.

Instead of forcing users to bridge, swap, or maintain multiple wallets, this demo uses Universal Accounts to provide:

• A single balance across chains (EVM + Solana)
• Unified gas abstraction — pay gas in any supported token
• Cross-chain deposits and trading from one account

💡 Get started with the Universal Accounts SDK in the Particle Docs.

Key Features

• Chain-Agnostic Accounts: A single Universal Account manages user balances and transactions across chains.
• Web3 Authentication: Instant login via Particle Network’s ConnectKit (social, wallet, or email).
• Gas Abstraction: Users trade on-chain stocks without needing native gas tokens — Universal Accounts handle it behind the scenes.
• Portfolio Dashboard: Unified cross-chain view of tokenized stock holdings.
• Cross-Chain Deposits: Deposit assets from EVM or Solana and trade seamlessly.

Technology Stack

• Frontend: Next.js, React, TypeScript, TailwindCSS
• Web3: Particle ConnectKit + Universal Account SDK
• Data APIs: Moralis API for token data & stock prices

How It Works

1. Universal Accounts as the Core

The app uses Particle Network’s Universal Accounts to abstract away the complexity of multiple blockchains:

• User Authenticates via ConnectKit (wallet, social, or email).
• Universal Account Initialization — creates an account that spans EVM and Solana.
• Unified Balances — assets on different chains appear as a single total.
• Cross-Chain Execution — trades, deposits, and gas payments are routed automatically, regardless of the source chain.

This architecture turns multi-chain UX into a chain-agnostic experience — users simply trade, while Particle handles routing and settlement under the hood.

2. Tokenized Stock Trading

Each supported stock (AAPL, GOOGL, TSLA, MSFT, AMZN) is represented as a token on Solana. Users can buy or sell using USD-denominated inputs through a 3-step Universal Account flow:

• Create a transaction via the Universal Account SDK
• Sign the transaction’s root hash
• Execute via the Universal Account (cross-chain if needed)

No bridges, no separate wallets, no token conversions — one account does it all.

Quickstart

Install dependencies

npm install

Run development server

npm run dev

Build for production

npm run build

Start production server

npm start

Required Environment Variables

Add the following environment variables to your .env file:

# Particle Network Configuration (client-side)
NEXT_PUBLIC_PROJECT_ID=your_particle_project_id
NEXT_PUBLIC_CLIENT_KEY=your_particle_client_key
NEXT_PUBLIC_APP_ID=your_particle_app_id
NEXT_PUBLIC_WALLETCONNECT_PROJECT_ID=your_walletconnect_project_id

# Moralis API Configuration (server-side only - NOT exposed to client)
MORALIS_API_KEY=your_moralis_api_key

Important Security Notes:

• The MORALIS_API_KEY is server-side only (no NEXT_PUBLIC_ prefix) and is securely accessed through Next.js API routes
• Never expose API keys to the client by using the NEXT_PUBLIC_ prefix for sensitive credentials
• All Moralis API calls are routed through /app/api/moralis/* endpoints to keep the API key secure

Find the Particle Network credentials in the Particle Dashboard. Get your Moralis API key from the Moralis Dashboard.