# IndeeHub Prototype - Project Setup

## Quick Start

```bash
# Install dependencies
npm install

# Start development server
npm run dev

# Build for production
npm run build
```

## Project Structure

```
src/
├── components/       # Reusable Vue components
│   └── ContentRow.vue
├── views/           # Page components
│   └── Browse.vue
├── stores/          # Pinia state management
│   └── content.ts
├── router/          # Vue Router configuration
├── types/           # TypeScript type definitions
├── utils/           # Utility functions
│   └── indeeHubApi.ts
└── composables/     # Vue composables
```

## Features

- ✅ Netflix-inspired streaming interface
- ✅ Glass morphism design from neode-ui
- ✅ Responsive mobile/desktop layout
- ✅ Horizontal scrolling content rows
- ✅ Vue 3 + TypeScript + Vite
- ✅ Tailwind CSS styling
- ✅ Nostr-tools integration ready
- ⏳ Real IndeeHub content integration (pending data)

## Technology Stack

- **Frontend:** Vue 3 (Composition API)
- **Build Tool:** Vite
- **Styling:** Tailwind CSS
- **State:** Pinia
- **Router:** Vue Router
- **Protocol:** Nostr (nostr-tools)
- **Package Manager:** npm

## Next Steps

1. **Add Real Content**
   - Update `src/stores/content.ts` with IndeeHub API
   - Replace placeholder images with real thumbnails
   - Add authentication (NIP-98)

2. **Complete Features**
   - Video player component
   - Search functionality  
   - User authentication
   - Content detail pages
   - My List feature

3. **Nostr Integration**
   - Nostr relay connections
   - Event publishing/fetching
   - Creator profiles
   - Content discovery

4. **Deployment**
   - Package for Umbrel
   - Package for Start9
   - Package for Archy

## Design System

Using design rules from `.cursor/rules/`:
- Mobile-first responsive design
- Glass morphism UI
- 4px grid spacing system
- Smooth animations
- Accessibility (WCAG AA)
- Performance optimized

## Development Notes

- All components use Composition API
- TypeScript strict mode enabled
- Following Vue 3 best practices
- Tailwind utility-first approach
- Design system consistency enforced

---

Built with ❤️ for decentralized media streaming