https://github.com/malpern/playlist-deck
TweetDeck-style YouTube playlist dashboard for macOS built with Electron + Next.js + Tailwind CSS
https://github.com/malpern/playlist-deck
dashboard electron macos nextjs playlist tailwindcss typescript youtube
Last synced: 2 months ago
JSON representation
TweetDeck-style YouTube playlist dashboard for macOS built with Electron + Next.js + Tailwind CSS
- Host: GitHub
- URL: https://github.com/malpern/playlist-deck
- Owner: malpern
- Created: 2025-06-23T04:57:39.000Z (about 1 year ago)
- Default Branch: main
- Last Pushed: 2025-06-23T05:18:51.000Z (about 1 year ago)
- Last Synced: 2026-01-18T22:24:55.169Z (5 months ago)
- Topics: dashboard, electron, macos, nextjs, playlist, tailwindcss, typescript, youtube
- Language: TypeScript
- Size: 106 KB
- Stars: 0
- Watchers: 0
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# Playlist Deck
TweetDeck-style YouTube playlist dashboard for macOS built with Electron + Next.js + Tailwind CSS.
## Sprint 0 - Project Scaffold & Tooling ✅
**Status: COMPLETED**
All foundational setup tasks have been completed:
- ✅ **S0-T1**: Monorepo with pnpm & basic folder structure
- ✅ **S0-T2**: Prettier + ESLint with prettier-plugin-tailwindcss
- ✅ **S0-T3**: Husky + lint-staged pre-commit hooks
- ✅ **S0-T4**: Next.js app with Tailwind CSS in apps/desktop/renderer
- ✅ **S0-T5**: Electron 27 (arm64 only) with context-isolated preload
## Architecture
```
playlist-deck/
├── apps/
│ └── desktop/
│ ├── src/
│ │ ├── main/ # Electron main process
│ │ └── preload/ # Context-isolated preload script
│ └── renderer/ # Next.js React app
│ └── src/app/ # App Router pages
└── packages/
└── shared/ # Shared utilities (future)
```
## Development
```bash
# Install dependencies
pnpm install
# Run Next.js dev server only
pnpm dev
# Run full Electron app with renderer
pnpm dev:electron
# Build everything
pnpm build
# Lint code
pnpm lint
# Format code
pnpm format
```
## Tech Stack
- **Desktop Shell**: Electron 27 (arm64 macOS only)
- **Renderer**: Next.js 15 App Router
- **Styling**: Tailwind CSS 4
- **Language**: TypeScript 5
- **Package Manager**: pnpm 8
- **Code Quality**: ESLint + Prettier + Husky
## Next Steps
Ready to begin Sprint 1: Authentication & Base Schema
- S1-T1: Implement Google device-flow OAuth helper
- S1-T2: Store refresh token securely with keytar
- S1-T3: Create Supabase tables with RLS
- S1-T4: Build Edge Function for playlist etag checking
- S1-T5: Renderer login screen triggering OAuth flow
- S1-T6: Log OAuth progress via pino
## Development Notes
- Context isolation enabled in preload script for security
- Native macOS window styling with vibrancy and hidden titlebar
- Dark/light theme support following system preferences
- Workspace setup allows independent development of main/renderer processes