# EMAR Markets - Nuxt.js Trading Platform

## Project Overview
EMAR Markets is a licensed and regulated forex and CFD trading broker website built with Nuxt.js. The platform offers MetaTrader 5 and cTrader trading platforms with competitive spreads, high leverage up to 1:3000, and 24/7 support.

## Business Information
- **Company**: EMAR Markets (pty) Ltd
- **License**: FSCA Financial Service Provider License (FSP No. 53070)
- **Website**: https://emarmarkets.com
- **Location**: Ground Floor, The Pavilion Building, Cnr of Portswood and Dock Road, V A Waterfront Capetown, Western Cape, 8001, South Africa
- **Regulation**: Financial Sector Conduct Authority (FSCA)
- **Founded**: 2022

## Technical Stack
- **Framework**: Nuxt.js 4.1.1
- **Language**: TypeScript
- **Styling**: Tailwind CSS 4.1.12
- **UI Components**: shadcn-nuxt, reka-ui
- **Icons**: lucide-vue-next
- **Internationalization**: @nuxtjs/i18n
- **Image Optimization**: @nuxt/image
- **SEO**: @nuxtjs/sitemap, @nuxtjs/robots, nuxt-schema-org
- **Analytics**: @vercel/analytics, nuxt-gtag
- **Animations**: GSAP, tw-animate-css
- **Package Manager**: pnpm

## Project Structure
```
app/
├── app.vue                 # Main app component
├── assets/                 # Static assets (CSS, icons)
├── components/             # Vue components
│   ├── ui/                # shadcn UI components
│   └── [other components] # Custom components
├── composables/           # Vue composables
├── layouts/               # Layout components
├── lib/                   # Utility libraries
├── pages/                 # Route pages
│   ├── company/           # Company pages
│   ├── platforms/         # Trading platform pages
│   ├── promotions/        # Promotional pages
│   └── trading/           # Trading-related pages
├── plugins/               # Nuxt plugins
└── types/                 # TypeScript type definitions

i18n/locales/              # Translation files
server/api/                # API endpoints
public/                    # Public static files
```

## Key Features
- **Multi-language Support**: 9 languages (English, Indonesian, Thai, Vietnamese, Arabic, Afrikaans, Lao, Malay, Urdu)
- **Trading Platforms**: MetaTrader 5 and cTrader integration
- **Account Types**: Various trading account options
- **Instruments**: Forex, Commodities, Indices, Cryptocurrency trading
- **Promotions**: Welcome bonus, loyalty program, trading contests
- **Educational Content**: Blog, help center, trading resources
- **Partner Program**: IB (Introducing Broker) opportunities

## Development Guidelines
- Uses Nuxt's auto-import feature - no manual imports needed for components/composables
- Tailwind CSS utility classes preferred over custom CSS
- UTC+03:00 timezone for time representations
- Lucide icons from 'lucide-vue-next' as component tags
- shadcn Dialog component for modals
- Docker support for development and production

## SEO & Performance
- Prerendered static pages for better performance
- Comprehensive meta tags and Open Graph data
- Schema.org structured data for organization
- Sitemap generation with blog posts and pages
- Image optimization with WebP/AVIF formats
- Facebook Pixel and Google Analytics integration

## API Endpoints
- `/api/contest/leaders` - Trading contest leaderboard
- `/api/contest/list` - Contest listings
- `/api/__sitemap__/blog-posts` - Blog sitemap
- `/api/__sitemap__/pages` - Pages sitemap

## Environment
- **Development**: `pnpm dev` (localhost:3000)
- **Production**: `pnpm build` + `pnpm preview`
- **Docker**: Development and production containers available
- **Linting**: ESLint with Vue and TypeScript support

## Key Dependencies
- Vue 3.5.18
- @nuxt/image 1.11.0
- @nuxtjs/i18n 10.0.6
- @tailwindcss/vite 4.1.12
- lucide-vue-next 0.541.0
- reka-ui 2.5.0
- shadcn-nuxt 2.2.0
- swiper 11.2.10
- vue-sonner 2.0.8

## Content Management
- Blog posts managed through API
- Multi-language content in JSON files
- Translation scripts available
- Legal documents in PDF format

## Security & Compliance
- FSCA regulated financial services
- GDPR compliance considerations
- Security headers and meta tags
- Risk warnings and legal disclaimers
- Client agreement and privacy policy

This is a professional financial services website requiring high standards for security, compliance, and user experience in the trading industry.