The latest articles on DEV Community by Sheyahi (@sheyahi_4bb10b5d). https://dev.to/sheyahi_4bb10b5d 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%2F4057420%2F1145970e-643a-458b-bfae-d9ac53f01e21.jpg https://dev.to/sheyahi_4bb10b5d en Sheyahi Sat, 01 Aug 2026 04:55:32 +0000 https://dev.to/sheyahi_4bb10b5d/i-built-a-chrome-extension-sidekick-787 https://dev.to/sheyahi_4bb10b5d/i-built-a-chrome-extension-sidekick-787 <p>As a huge sports fan, I always found one thing missing while watching live matches. </p> <p>Sometimes I wanted to celebrate a goal, discuss a referee decision, or react with my friends—but I didn't want to switch to Discord, WhatsApp, Reddit, or X. I wanted everything to happen right beside the stream.</p> <p>So, I decided to build Sidekick.</p> <p><strong>The Idea</strong></p> <p>Sidekick is a Chrome extension that lets people watching the same sporting event join a shared room and chat in real time without leaving the video.</p> <p>The extension detects the current sporting event, creates or joins a room, and <em>lets fans interact</em> through messages and reactions.</p> <p><strong>Tech Stack</strong></p> <ul> <li>JavaScript (ES Modules)</li> <li>Chrome Extension Manifest V3</li> <li>Supabase</li> <li>Supabase Realtime</li> <li>Groq API</li> <li>TheSportsDB API</li> </ul> <p><strong>Some Interesting Challenges</strong><br> <em>Detecting the Match</em></p> <p>The extension first collects information from the current webpage:</p> <ul> <li>Page title</li> <li>Headings</li> <li>Meta description</li> <li>Website hostname</li> </ul> <p>This information is sent to an AI model which determines whether the user is watching a sporting event and extracts details such as:</p> <ul> <li>Sport</li> <li>Competition</li> <li>Teams</li> <li>Event name</li> </ul> <p><em>Avoiding Repeated AI Calls</em></p> <p>Running AI every time someone joined the room would have been wasteful.</p> <p>Instead, only the room creator performs match detection. The detected match is stored, and everyone else who joins receives the already-verified information.</p> <p>This greatly reduced API usage.</p> <p><em>Team Badges</em></p> <p>Once the match is identified, the extension fetches official team badges (or country flags when appropriate) so users can immediately choose which side they're supporting.</p> <p><strong>What's Next?</strong></p> <p>I'm planning to continue improving Sidekick by adding better moderation, richer reactions, chat synchronisation, and additional ways for fans to interact during live events.</p> <p>Building this project taught me a lot about Chrome extensions, real-time systems, and integrating AI into practical applications.</p> <p>If you've built a browser extension before, I'd love to hear about your experience or any suggestions for improving Sidekick.</p> ai developer sql software