Skip to main content

Prerequisites

Before installing Exchange Web, ensure you have the following tools installed on your system.

Required

Node.js 18 or higher

Exchange Web requires Node.js version 18 or above.Check your Node.js version:
node --version
Download from nodejs.org if needed.

Package manager

You’ll need one of the following package managers:

npm

Comes bundled with Node.js

Yarn

Recommended (project uses Yarn 1.22.22)

pnpm

Fast, disk-efficient alternative
The project specifies "packageManager": "[email protected]" in package.json, but any package manager will work.

Installation steps

Follow these steps to install Exchange Web on your local machine.
1

Clone the repository

Use git to clone the repository:
git clone https://github.com/jogeshwar01/exchange-web.git
Navigate into the project directory:
cd exchange-web
2

Install dependencies

Install all workspace dependencies from the root:
npm install
This installs dependencies for all workspaces:
  • apps/web - Main trading application
  • packages/ui - Shared UI components
  • packages/eslint-config - ESLint configuration
  • packages/typescript-config - TypeScript configuration
The installation may take a few minutes depending on your internet connection.
3

Verify installation

Check that the installation succeeded by listing the workspace structure:
ls -la apps/web
You should see the web app directory with node_modules, src, and configuration files.

Project structure

Exchange Web uses a monorepo structure managed by Turbo:
exchange-web/
├── apps/
│   └── web/              # Main trading application
│       ├── src/
│       │   ├── components/   # React components
│       │   ├── pages/        # Route pages
│       │   ├── state/        # Context providers
│       │   └── utils/        # Utilities and helpers
│       ├── package.json
│       └── vite.config.ts
├── packages/
│   ├── ui/               # Shared UI components
│   ├── eslint-config/    # Shared ESLint config
│   └── typescript-config/ # Shared TypeScript config
├── package.json          # Root workspace config
└── turbo.json           # Turbo pipeline config

Environment setup

Exchange Web works out of the box without environment variables for local development.
If you’re connecting to a production exchange backend, you’ll need to configure API endpoints in your environment or source code.

Optional: Configure backend URL

If you need to point to a specific backend API:
  1. Check the API requests in apps/web/src/utils/requests.ts
  2. Update the base URLs to match your backend endpoints
  3. Configure WebSocket URLs in apps/web/src/utils/ws_manager.ts

Running the application

Once installed, you can run Exchange Web in development mode:
npm run dev
The application will start at http://localhost:5173.

Build for production

To create a production build:
npm run build
This runs TypeScript compilation followed by Vite’s optimized build process.

Preview production build

To preview the production build locally:
cd apps/web && npm run preview

Troubleshooting

Common installation issues and their solutions:

Node version error

Error: “The engine ‘node’ is incompatible with this module”Solution: Exchange Web requires Node.js 18 or higher. Update your Node.js version:
node --version  # Check current version
Download the latest LTS version from nodejs.org.

Port already in use

Error: “Port 5173 is already in use”Solution: Either kill the process using port 5173, or specify a different port:
vite --port 3000

Workspace installation fails

Error: Workspace dependency resolution errorsSolution: Try these steps in order:
  1. Delete node_modules and lock files:
    rm -rf node_modules yarn.lock package-lock.json pnpm-lock.yaml
    
  2. Clear package manager cache:
    # For npm
    npm cache clean --force
    
    # For yarn
    yarn cache clean
    
    # For pnpm
    pnpm store prune
    
  3. Reinstall dependencies:
    yarn install  # or npm install / pnpm install
    

TypeScript errors on build

Error: Type errors during npm run buildSolution: Ensure TypeScript is installed and run type checking:
cd apps/web
npx tsc --noEmit
This shows detailed type errors without creating output files.

Development tools

Optional but recommended tools for Exchange Web development:
  • VS Code - Editor with excellent TypeScript support
  • React DevTools - Browser extension for debugging React components
  • Redux DevTools - For inspecting context state (if you add Redux)
  • Tailwind CSS IntelliSense - VS Code extension for Tailwind autocomplete

Next steps

Quickstart guide

Learn how to run and use Exchange Web

Source code

Explore the codebase on GitHub

Build docs developers (and LLMs) love