The latest articles on DEV Community by member_86a0f420 (@member_86a0f420). https://dev.to/member_86a0f420 https://media2.dev.to/dynamic/image/width=90,height=90,fit=cover,gravity=auto,format=auto/https:%2F%2Fdev-to-uploads.s3.amazonaws.com%2Fuploads%2Fuser%2Fprofile_image%2F3914549%2Ff1c513e8-2169-458d-95e0-fc431716ed4d.png https://dev.to/member_86a0f420 en member_86a0f420 Tue, 05 May 2026 18:34:39 +0000 https://dev.to/member_86a0f420/i-built-a-firefox-new-tab-extension-weather-clock-dashboard-2edk https://dev.to/member_86a0f420/i-built-a-firefox-new-tab-extension-weather-clock-dashboard-2edk <p>I wanted a productive new tab page that loaded instantly. Most weather widgets require API key setup or phone home constantly. So I built my own.</p> <p><strong>Weather &amp; Clock Dashboard</strong> is a Firefox new tab extension. Here's what it does and how it works.</p> <h2> What it does </h2> <ul> <li> <strong>Live weather</strong> — current conditions + 3-day forecast for any city</li> <li> <strong>World clocks</strong> — multiple time zones side by side (great for remote teams)</li> <li> <strong>Search bar</strong> — uses your default Firefox search engine</li> <li> <strong>Dark/light mode</strong> — one-click toggle</li> </ul> <h2> Technical approach </h2> <p>Pure HTML/CSS/JS. No React, no Vue, no bundler, no dependencies.</p> <p>Weather data from <a href="https://open-meteo.com/" rel="noopener noreferrer">Open-Meteo</a> — a free, open-source weather API with no authentication required. The extension geocodes your city on first run, stores coordinates locally, and queries Open-Meteo from the browser directly. Nothing goes through my servers.</p> <p>Time zones use the browser's built-in <code>Intl.DateTimeFormat</code> API — accurate and no library needed.</p> <p>Total installed size: ~50KB. Load time: &lt;100ms.</p> <h2> AMO review process </h2> <p>Submitting to Mozilla's Add-on store took about 3 days. The reviewer flagged one issue: I was using <code>innerHTML</code> in one place (fair point), which I fixed before approval. The review process was smooth overall.</p> <h2> Install it </h2> <p><strong>Firefox Add-ons store:</strong><br> <a href="https://addons.mozilla.org/en-US/firefox/addon/weather-clock-dashboard/" rel="noopener noreferrer">https://addons.mozilla.org/en-US/firefox/addon/weather-clock-dashboard/</a></p> <p><strong>Source code (MIT):</strong><br> <a href="https://github.com/oren-sys/weather-clock-dashboard" rel="noopener noreferrer">https://github.com/oren-sys/weather-clock-dashboard</a></p> <p>Happy to answer questions about building Firefox extensions or the AMO submission process!</p> javascript productivity showdev sideprojects