The latest articles on DEV Community by JAYDIP GOHIL (@jaydip_gohil_df39955b06f1). https://dev.to/jaydip_gohil_df39955b06f1 https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F4239126%2Fca45efe8-975e-4394-81ae-0f6d7767f527.jpg https://dev.to/jaydip_gohil_df39955b06f1 en JAYDIP GOHIL Wed, 11 Nov 2026 13:02:06 +0000 https://dev.to/jaydip_gohil_df39955b06f1/i-built-a-30-second-blind-audio-quiz-web-app-to-settle-music-debates-39bj https://dev.to/jaydip_gohil_df39955b06f1/i-built-a-30-second-blind-audio-quiz-web-app-to-settle-music-debates-39bj <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fm8ch54ct7fc35bn58xu3.jpeg" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fm8ch54ct7fc35bn58xu3.jpeg" alt="SonicPulse Home Screen" width="738" height="1600"></a></p> <p>I wanted a fast way to test whether my friends actually recognize tracks quickly instead of guessing from lyrics or text questions. So I built <strong>SonicPulse</strong>, a mobile-first audio quiz you can play directly in the browser without creating an account.</p> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F6p0v1k1k1fpiv9fzaqpb.jpeg" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2F6p0v1k1k1fpiv9fzaqpb.jpeg" alt="SonicPulse Gameplay Deck" width="738" height="1600"></a></p> <h3> How it works </h3> <ul> <li>Pick an artist or swipe through genre decks</li> <li>Listen to a 30-second audio preview against a countdown clock</li> <li>Pick the matching track from four choices across 10 rounds</li> <li>Instant guest mode by default, with optional Google sign-in for score history</li> </ul> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Feboo8go9h6mav487i80c.jpeg" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Feboo8go9h6mav487i80c.jpeg" alt="SonicPulse Round Screen" width="738" height="1600"></a></p> <h3> Live Demo </h3> <p>Try it out here: <a href="https://sonicpulse-sable.vercel.app" rel="noopener noreferrer">https://sonicpulse-sable.vercel.app</a></p> <p><a href="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fwb2txt0xtnic7a2slhxw.jpeg" class="article-body-image-wrapper"><img src="https://media2.dev.to/dynamic/image/width=800%2Cheight=%2Cfit=scale-down%2Cgravity=auto%2Cformat=auto/https%3A%2F%2Fdev-to-uploads.s3.us-east-2.amazonaws.com%2Fuploads%2Farticles%2Fwb2txt0xtnic7a2slhxw.jpeg" alt="SonicPulse Results and Audio Player" width="738" height="1600"></a></p> <h3> Stack and what I fixed along the way </h3> <p>The frontend uses React, Vite, Tailwind CSS, and Framer Motion, backed by a Flask API and Supabase. Two tricky bugs I had to sort out for mobile testers were handling <code>100dvh</code> viewport heights smoothly and letting users tap anywhere on the audio player card to unlock audio on mobile Safari.</p> <p>If you try it on your phone, I would appreciate honest feedback on loading speed, audio delay, or any layout issues.</p> frontend react showdev webdev