A feature-rich React Native starter kit for building trading apps with Alpaca Markets. Built with Expo SDK 54, this project aims to be a good foundation/inspiration for Fintechs building trading apps. It provides real-time market data, order management, and portfolio tracking out of the box.
The current set-up uses API keys set on the .env files. For a production ready the Oauth2 authentication will need to be used instead.
Building a trading app from scratch is complex. This starter handles some hard parts:
- Alpaca API Integration - Pre-configured hooks for market data, trading, and account management
- Real-time Updates - TanStack Query with smart caching and background refetching
- Native Performance - Optimized with FlashList, Reanimated, and Skia charts
- Accessible UI - Built on @rn-primitives for screen reader support
├── app/ # Expo Router file-based navigation
│ ├── (tabs)/ # Tab navigation (Portfolio, Market, Account)
│ └── (modal)/ # Modal screens (Stock details, Orders, Positions)
├── components/
│ ├── trading/ # Trading-specific components
│ └── ui/ # Reusable UI primitives
├── lib/
│ ├── api/ # Alpaca API client and endpoints
│ ├── hooks/ # TanStack Query hooks for data fetching
│ ├── store/ # Jotai atoms for client state
│ ├── types/ # TypeScript types for Alpaca API
│ └── utils/ # Formatters, validators, calculations
| Category | Technology |
|---|---|
| Framework | Expo SDK 54 + Expo Router 6 |
| UI | React 19 + React Native 0.81 |
| Styling | NativeWind (Tailwind CSS) |
| Server State | TanStack Query |
| Client State | Jotai |
| Lists | @shopify/flash-list |
| Charts | @shopify/react-native-skia |
| Animations | react-native-reanimated |
| Accessibility | @rn-primitives |
- Bun (recommended) or Node.js 18+
- Alpaca Markets Account (free paper trading account)
- iOS Simulator or Android Emulator (or physical device)
- Clone and install dependencies:
git clone <repo-url>
cd alpaca-cria
bun install- Configure environment variables:
cp .env.example .envEdit .env with your Alpaca API credentials from https://app.alpaca.markets/
- Generate native projects:
bun run prebuild- Run the app:
# iOS
bun run ios
# Android
bun run android| Command | Description |
|---|---|
bun run ios |
Run on iOS simulator |
bun run android |
Run on Android emulator |
bun run start |
Start Expo dev server |
bun run lint |
Check for linting errors |
bun run lint:fix |
Auto-fix linting errors |
bun run format |
Format code with Prettier |
bun run typecheck |
Run TypeScript checks |
bun run test |
Run tests |
bun run validate |
Run all checks (lint + format + typecheck) |
The app includes a built-in UI kit preview showcasing all available components. This is useful for:
- Exploring available components before building new features
- Testing component variants and states
- Ensuring consistent styling across the app
Access it via the Account tab → UI Kit Preview.
- Real-time stock quotes and bars
- Historical price charts with multiple time periods
- Stock search with fuzzy matching
- Company fundamentals and news
- Company logos via Elbstream Logo API
- Market and limit orders
- Order confirmation flow
- Order history and management
- Position tracking with P&L
- Account balance and buying power
- Portfolio performance charts
- Position list with real-time updates
All API calls use TanStack Query hooks from lib/hooks/:
import { useLatestQuote, useStockBars } from '@/lib/hooks';
function StockPrice({ symbol }: { symbol: string }) {
const { data: quote, isLoading } = useLatestQuote(symbol);
// ...
}- Server state: TanStack Query (automatic caching, background updates)
- Client state: Jotai atoms in
lib/store/ - Form state: Local
useState
- Company logos provided by Elbstream
This project is licensed under GPL-3.0. Any modifications or derivative works must also be open source under the same license.
GNU General Public License v3.0 - see LICENSE for details.
Built with ❤️ for the trading community