doermusic — Music & Sound Library Platform
doermusic is a music and sound library for DOC Studios. It lets visitors browse original compositions, ambient soundscapes, and commercial music — without audio stopping when they switch between categories.
Teslimatlar
Neler üretildi
Content categories
3 (Originals, Scenes, Ads)
Architecture
SPA + SSR
Desktop performance
100 / 100
SEO score
92 / 100
Özellikler
Sunulan temel özellikler
Teknoloji
Teknik altyapı
Framework
Next.js with React — pages are server-rendered on first load, then client-side navigation takes over
Language
TypeScript with ES6+ JavaScript
Styling
Custom CSS, Google Fonts (Montserrat for body, Playfair Display for headings)
Icons
Font Awesome 6.0
Architecture
Hash-based routing keeps the user on one page — #originals-page, #scenes-page, #advertisements-page
SEO
All meta tags are server-rendered so crawlers see complete page data. SEO score: 100/100
Hosting
Self-hosted on a containerized server with automated builds, HTTPS, and fast static asset delivery
Sorun
Ne çözülmeliydi
The main problem was keeping audio playing while visitors browse between categories. A standard multi-page site reloads the page on every navigation — audio stops. A pure client-side SPA solves that but produces weak SEO. Both mattered here.
Yaklaşım
Nasıl ele alındı
Used Next.js to handle both sides: server-rendered HTML so search engines see proper page content, and client-side routing so audio never stops. Hash-based navigation keeps everything in one continuous browser session.
Uygulama
Nasıl geliştirildi
Built as a Next.js SPA with hash-based routing — navigation is fully client-side, so audio plays uninterrupted across all category switches.
Organized content into three sections: Originals, Scenes, and Advertisements. Each has its own dedicated browsing layout.
Set up server-side rendering for all meta tags and page markup so search engines get clean, complete HTML on every page.
Designed the UI around Montserrat and Playfair Display — straightforward, readable, fits the DOC Studios visual identity.
Added a contact form for licensing inquiries and custom composition requests.
Deployed on a self-hosted containerized server with automated builds and HTTPS.
Sonuç
Ne elde edildi
Desktop PageSpeed score: 100/100. SEO score: 100/100. Visitors can switch between all three categories while audio keeps playing, and licensing inquiries go directly to DOC Studios through the contact form.
Dersler
Temel çıkarımlar
- SSR and SPA aren't mutually exclusive. Next.js handles both — the architecture just needs to be decided before building starts.
- Keeping audio playing across navigation means all routing has to stay client-side. Any server-side redirect breaks the playback.
- A simple UI is easier to maintain as the content library grows. Complexity added early becomes a maintenance cost later.
İlgili sayfalar
Business Development
Business development for companies that need stronger positioning, better digital presence, clearer marketing direction, and a structured path from attention to qualified demand.
Business Development
Business development for companies that need stronger positioning, better digital presence, clearer marketing direction, and a structured path from attention to qualified demand.
DOC Studios s.r.o. | Cinematic Sound Composition, Brand Audio Design & Game Scoring
DOC Studios s.r.o. is a Prague based music production company creating original music and sound identities for film, advertising, games, and interactive media.