Skip to main content

Prerequisites

Before installing CryptoDash, ensure you have the following installed on your system:

Node.js 16+

JavaScript runtime required to run CryptoDash

Package Manager

npm, yarn, or pnpm for dependency management

Git

Version control system for cloning the repository

Modern Browser

Chrome, Firefox, Safari, or Edge (latest version)

Verifying Prerequisites

Check if Node.js and npm are installed:
Terminal
node --version
# Should output: v16.0.0 or higher

npm --version
# Should output: 7.0.0 or higher
If Node.js is not installed, download it from nodejs.org. The LTS version is recommended.

Installation Steps

Follow these steps to install CryptoDash on your local machine:
1

Clone the Repository

Clone the CryptoDash repository from GitHub:
Terminal
git clone https://github.com/yourusername/crypto-dash.git
cd crypto-dash
This creates a local copy of the project in a crypto-dash directory.
2

Install Dependencies

Install all required npm packages:
npm install
This will install all dependencies listed in package.json, including:
  • React 19 and React DOM
  • React Router 7 for routing
  • Axios for API calls
  • TailwindCSS 4 for styling
  • Vite for development and build tooling
3

Configure Environment (Optional)

CryptoDash works out-of-the-box with the CoinGecko free API. However, you can customize API settings by creating a .env file:
.env
# Optional: CoinGecko API Configuration
VITE_COINGECKO_BASE_URL=https://api.coingecko.com/api/v3
VITE_API_TIMEOUT=10000

# Optional: CoinGecko Pro API Key (for higher rate limits)
VITE_COINGECKO_API_KEY=your_api_key_here
Environment variables must be prefixed with VITE_ to be accessible in the application.
4

Start Development Server

Launch the development server:
npm run dev
You should see output similar to:
Output
VITE v7.3.1  ready in 324 ms

  Local:   http://localhost:5173/
  Network: use --host to expose
  press h + enter to show help
5

Open in Browser

Navigate to http://localhost:5173 in your web browser. You should see the CryptoDash login or dashboard screen.
The development server includes hot module replacement (HMR), so changes to your code will automatically refresh the browser.

Build for Production

To create an optimized production build:
1

Build the Application

Create a production-ready build:
npm run build
This creates an optimized build in the dist/ directory with:
  • Minified JavaScript and CSS
  • Code splitting for optimal performance
  • Optimized assets and images
  • Source maps for debugging
2

Preview Production Build

Test the production build locally:
npm run preview
This starts a local server to preview the production build at http://localhost:4173.

Project Structure

After installation, your project directory will look like this:
crypto-dash/
├── public/                 # Static assets
├── src/
│   ├── api/               # API integration layer
│   │   ├── axios.js       # Axios instance configuration
│   │   ├── dashboard/     # Dashboard API calls
│   │   ├── market/        # Market data API
│   │   └── portfolio/     # Portfolio API
│   ├── components/        # React components
│   │   ├── common/        # Reusable components
│   │   ├── dashboard/     # Dashboard-specific components
│   │   ├── layout/        # Layout components (Sidebar, TopBar)
│   │   ├── market/        # Market explorer components
│   │   ├── portfolio/     # Portfolio components
│   │   └── transactions/  # Transaction components
│   ├── contexts/          # React Context providers
│   │   ├── SettingsContext.jsx  # Theme, language settings
│   │   └── ToastContext.jsx     # Toast notifications
│   ├── hooks/             # Custom React hooks
│   ├── i18n/              # Internationalization
│   ├── pages/             # Route pages
│   ├── router/            # Routing configuration
│   ├── utils/             # Utility functions
│   └── main.jsx           # App entry point
├── index.html             # HTML template
├── package.json           # Dependencies and scripts
├── vite.config.js         # Vite configuration
└── tailwind.config.js     # Tailwind configuration

Troubleshooting

If port 5173 is already occupied, Vite will automatically use the next available port. You can also specify a custom port:
Terminal
npm run dev -- --port 3000
Delete node_modules and reinstall dependencies:
Terminal
rm -rf node_modules package-lock.json
npm install
CryptoDash uses the CoinGecko free tier which has rate limits (10-50 calls/minute). If you encounter rate limit errors:
  • Wait a few minutes before refreshing
  • Consider signing up for a CoinGecko Pro API key for higher limits
  • Add your API key to the .env file as VITE_COINGECKO_API_KEY
If the build process fails due to memory issues, increase Node.js memory limit:
Terminal
NODE_OPTIONS="--max-old-space-size=4096" npm run build

Available Scripts

Here are all the available npm scripts:
ScriptDescription
npm run devStart development server with hot reload
npm run buildCreate optimized production build
npm run previewPreview production build locally
npm run lintRun ESLint to check code quality

Next Steps

Quick Start Guide

Now that you have CryptoDash installed, learn how to use its features in the Quick Start guide.

Build docs developers (and LLMs) love