Drake vibe page and project scaffold

ldraney commented

2026-06-19 01:57:35 +00:00

Owner

Type

Feature

Lineage

Standalone — first vibe page for myvibes.world.

Repo

ldraney/my-vibes-world

User Story

As a visitor clicking an Instagram link, I land on myvibes.world/drake/ and see "music is self expression. music is hypnotizing. That is why I like Drake." with a Spotify embed and ambient Tone.js audio.

Context

Initial creative page for myvibes.world. Establishes the full project scaffold: Vite build, Tone.js audio, Spotify embeds, Docker/nginx serving, Woodpecker CI pipeline.

File Targets

src/drake/index.html, style.css, main.js
package.json, vite.config.js
Dockerfile, nginx.conf, .woodpecker.yml

Feature Flag

No — public creative page, no gating needed.

Test Expectations

npm run build produces dist/drake/index.html
npm run dev serves page at /drake/
Spotify embed loads
Tone.js ambient starts on tap

Acceptance Criteria

Page loads at /drake/ with phrase text visible
Staggered text reveal animation plays
Spotify embed renders and plays Drake
Tone.js ambient triggers on tap/click
Vite build produces correct output structure
Docker build succeeds with nginx serving

Constraints

No framework — vanilla HTML/CSS/JS only
Each vibe page is self-contained

Checklist

Vite multi-page config with auto-discovery
Drake page with staggered text reveal
Tone.js ambient drone on user interaction
Spotify embed (God's Plan)
Docker + nginx production config
Woodpecker CI pipeline
OpenGraph meta tags for Instagram previews

my-vibes-world project

### Type Feature ### Lineage Standalone — first vibe page for myvibes.world. ### Repo `ldraney/my-vibes-world` ### User Story As a visitor clicking an Instagram link, I land on myvibes.world/drake/ and see "music is self expression. music is hypnotizing. That is why I like Drake." with a Spotify embed and ambient Tone.js audio. ### Context Initial creative page for myvibes.world. Establishes the full project scaffold: Vite build, Tone.js audio, Spotify embeds, Docker/nginx serving, Woodpecker CI pipeline. ### File Targets - src/drake/index.html, style.css, main.js - package.json, vite.config.js - Dockerfile, nginx.conf, .woodpecker.yml ### Feature Flag No — public creative page, no gating needed. ### Test Expectations - `npm run build` produces dist/drake/index.html - `npm run dev` serves page at /drake/ - Spotify embed loads - Tone.js ambient starts on tap ### Acceptance Criteria - [ ] Page loads at /drake/ with phrase text visible - [ ] Staggered text reveal animation plays - [ ] Spotify embed renders and plays Drake - [ ] Tone.js ambient triggers on tap/click - [ ] Vite build produces correct output structure - [ ] Docker build succeeds with nginx serving ### Constraints - No framework — vanilla HTML/CSS/JS only - Each vibe page is self-contained ### Checklist - [x] Vite multi-page config with auto-discovery - [x] Drake page with staggered text reveal - [x] Tone.js ambient drone on user interaction - [x] Spotify embed (God's Plan) - [x] Docker + nginx production config - [x] Woodpecker CI pipeline - [x] OpenGraph meta tags for Instagram previews ### Related - `my-vibes-world` project