For your next side project, make a browser extension

• nutab

  2 10 0.0 Svelte

  Svelte / Sveltekit also works great and is a bit more lightweight / performant while being easier / faster to develop with.

  I have an implementation on GitHub for my personal hybrid bookmark-manager / hackernews-reader newtab extension[0]. Its still a wip but i use the website version[1] daily as it doesn’t need to be installed and can still be set as my newtab page (warning as I’ve never opened it on mobile).

  [0] https://github.com/fractalhq/nutab

• firefox-easy-container-shortcuts

  1 83 3.9 JavaScript

  Easy, opinionated, keyboard shortcuts for Firefox 57+ containers.

  Browser extensions are useful. I've made some simple ones and published a few:

  https://addons.mozilla.org/en-US/firefox/user/14310707/

  But it's also worth considering where the browser gives priority. For example, while browser extensions can add custom keyboard shortcuts, they can't override the keybindings a website uses. Want to use the keyboard shortcut Ctrl-Shift-1 for a browser extension while a Google Docs page is focused? Nope, sorry, can't be done.

  https://github.com/gsomoza/firefox-easy-container-shortcuts/...

  It's pretty clear that while a browser extension can access browser APIs that a web app can't, the extension is still a second-class citizen in other respects.

• Appwrite

  appwrite.io

  sponsored

  Appwrite - The open-source backend cloud platform. The open-source backend cloud platform for developing Web, Mobile, and Flutter applications. You can set up your backend faster with real-time APIs for authentication, databases, file storage, cloud functions, and much more!

  

• plasmo

  3 6,804 9.3 TypeScript

  🧩 The Browser Extension Framework

  

  Shameless plug, but we built the Plasmo Framework to make that (and a lot more) super easy: https://github.com/plasmohq/plasmo

• pixiebrix-extension

  3 72 10.0 TypeScript

  PixieBrix browser extension

  

  If you don't want to actually write the code and deal with the browser webstores, you can also use an "extension builder" tool like https://www.pixiebrix.com/ to call APIs, move data around, and build simple UIs.

• demo-browser-extension

  11 41 10.0 JavaScript

  Example Chrome Extension - open source examples for Chrome extension APIs

  I was enthusiastic enough about extensions that I decided to publish a book about building them: https://www.buildingbrowserextensions.com/

  Browser extensions are severely underrated as a platform because they aren't sexy. For all that mobile devices have given us, so much of our work continues to be done using a desktop browser. Enhancements such as augmenting websites with widgets, supplying contextual information, and automating repetitive tasks using the authenticated session - when applied appropriately - can save someone hours every day.

• googleimagesrestored

  1 360 0.0 JavaScript

  This extension attempts to make Google Images look and feel like it did before they changed everything on August 6th, 2019.

  i very much care about supporting firefox users. for example, i maintain a separate, mozilla-signed, manifest v2 version of an XPI of an extension i made [0] just so firefox users can keep using it. i do so even though this compromises my own ideals about not wanting to use 2FA out of principle.

  [0] https://github.com/fanfare/googleimagesrestored/releases

• rosegarden

  1 3 0.0 JavaScript

  Rosegarden gives you the promises for writing cross platform webextensions on Chrome and other browsers missing the promise based API.

  I have made this even easier with Rosegarden, so that you can just use a promisified browser object in both Firefox and Chrome!

  The library is tiny, under 5 kb.

  https://github.com/peterhil/rosegarden

• SurveyJS

  surveyjs.io

  sponsored

  A Non-Cloud Alternative to Google Forms that has it all.. SurveyJS JavaScript libraries allow you to easily set up a robust form management system fully integrated into your IT infrastructure where users can create and edit multiple dynamic JSON-based forms in a no-code form builder. Learn more now.

  

• spellbook

  1 25 0.0 JavaScript

  Spellbook is a bookmark extension for Chrome and Firefox (by peterhil)

• Notion-Boost-browser-extension

  8 429 0.0 JavaScript

  Chrome & Firefox extension for Notion to add 20+ features like sticky outline, small text & full width by default, hide comments & help button, bolder text etc. Download here: https://gourav.io/notion-boost

  https://github.com/GorvGoyl/Notion-Boost-browser-extension/

  ChatGPT Writer - 20+ users

• webextensions

  11 510 0.0 HTML

  Charter and administrivia for the WebExtensions Community Group (WECG)

  

  Somewhat tangentially, I've been pushing for a popup/overlay API that allows to specify the position and size, and doesn't require any origin permissions.

  https://github.com/w3c/webextensions/issues/307

• twitter-profile-search

  1 3 10.0 JavaScript

  Bringing profile search button to Twitter web!

  Well, shameless plug, but I made something similar: https://github.com/rounakdatta/twitter-profile-search :)

• tante-jacky

  1 0 10.0 JavaScript

  Bridge for German banking websites to work with your USB chipTAN reader

• control-panel-for-twitter

  24 1,376 9.4 JavaScript

  Browser extension which gives you more control over your Twitter timeline and adds missing features and UI improvements - available for desktop and mobile browsers

  I love the section on "Earning the pixels", as this is something I also put a lot of time into in extensions, from the target site itself to the options page in my extensions having per-browser CSS to make sure it fits in with the browser's own options UI (and in light and dark mode).

  With Twitter, earning the pixels in the site UI is even more fraught as it's a React Native for Web app, so you really don't want to touch the app's own DOM directly, as it will most likely get wiped out on the next render.

  e.g. The latest version of Tweak New Twitter [0] keeps you on the "Following" timeline, gets rids of the new "For you" tab and adds a new "Retweets" tab - to highlight the Retweets tab as active when the user clicks it, I had to add a styling hook class to

  and use that to manually style the Retweet tab as active and override styles for existing tabs to make them display as inactive. Another layer of fun: at any point the user can change the Default/Dim/Lights out theme and the highlight colour using the Display dialogue, so I needed to figure out how to detect these changes, figure out what was now being used and re-apply them to custom UI on the fly.

  [0] https://github.com/insin/tweak-new-twitter#tweak-new-twitter

Suggest a related project