CryptoPay - Nuxt Application

A modern crypto payment service built with Nuxt 3, featuring crypto payments integration. Look at the Nuxt documentation to learn more.

A modern, feature-rich crypto payment service built with Nuxt 3, Vue 3, and TailwindCSS. Perfect for crypto enthusiasts, crypto bloggers, and crypto creators.

Demo · Report Bug · Request Feature

💝 Support My Work

This template and many others are available at NuxtMint.com

Join our friendly Discord community to get help, share your ideas, and connect with other developers!

Setup

1. Clone the repository

2. Create a .env file in the root directory:

# Airtable Configuration
AIRTABLE_API_KEY=your_airtable_api_key
AIRTABLE_BASE_ID=your_airtable_base_id

3. Install dependencies:

# pnpm (recommended)
pnpm install

Development Server

Start the development server on http://localhost:3000:

pnpm dev

Production

Build the application for production:

pnpm build

Locally preview production build:

pnpm preview

Project Configuration

Site Configuration (config/site.ts)

export const siteConfig = {
  name: 'Your Site Name',
  description: 'Your site description',
  url: 'https://yoursite.com',
  stripeLink: 'https://your-stripe-payment-link',
  // ... other configurations
};

Crypto Configuration (config/crypto.ts)

export const cryptoAddresses = {
  btc: 'your-btc-address',
  eth: 'your-eth-address',
  sol: 'your-sol-address',
  matic: 'your-matic-address',
};

Airtable Setup

1. Create a new base in Airtable
2. Create a table named "Orders" with fields:
   • Order ID (Single line text)
   • Plan (Single select: basic, premium)
   • Payment Method (Single select: crypto, bank)
   • Crypto Type (Single line text)
   • Crypto Amount (Number)
   • Created At (Date)

Features

• 💳 Cryptocurrency payment integration
• 🎨 Responsive design
• 📊 Order management through Airtable
• 💱 Real-time crypto price updates
• ✅ Payment success page

API Endpoints

Configuration

The API endpoints are configured in the server/api directory. Make sure you have the following environment variables set up in your .env file:

# API Configuration
API_SECRET_KEY=your_api_secret_key
CRYPTO_API_KEY=your_crypto_api_key

Available Endpoints

1. GET /api/crypto-prices

Returns current cryptocurrency prices for supported tokens.

Configuration:

• Configure supported cryptocurrencies in config/crypto.ts

2. GET /api/package-prices

Returns available package prices.

Configuration: Edit config/site.ts to modify package prices:

export const defaultPrices = {
  basic: 10,
  premium: 20,
};

3. POST /api/submit-order

Handles order submission and Airtable integration.

Configuration:

1. Set up Airtable credentials in .env:

AIRTABLE_API_KEY=your_airtable_api_key
AIRTABLE_BASE_ID=your_airtable_base_id

2. Configure Airtable settings in config/airtable.ts:

Rate Limiting

All API endpoints are rate-limited to prevent abuse. Configure rate limiting in nuxt.config.ts:

export default defineNuxtConfig({
  // ... other config
  security: {
    rateLimiter: {
      tokensPerInterval: 100,
    },
  },
});

Check out the deployment documentation for more information about deploying to production.