Overlay is a browser extension that helps developers evaluate open source packages before picking them. It gathers data from various sources, such as Snyk Advisor, Debricked, Socket.dev, and Deps.dev, and displays them on the package pages of popular registries like npm, PyPI, and Go.
With Overlay, you can quickly consider packages based on metrics like popularity, quality, security, maintenance, and compatibility. You can also see detailed information about each package, such as its license, dependencies, vulnerabilities, issues, releases, and more.
Overlay aims to help developers make informed decisions when choosing open source packages for their projects.
- Websites: StackOverflow, npmjs.com and pypi.org (see Issue #14 for future plans)
- Registries: NPM, PYPI and Go (only on
pkg.go.dev
) - Advisories: Debricked, Snyk, Socket and DepsDev
Overlay is available for Chrome and Firefox. You can install it from the following links:
After installing Overlay, you can use it on any supported page (such as StackOverflow). You will notice indicators on package names and links, showing the number of issues. When you hover over an indicator, you will see more details about the package. You can also click on the indicator to open a modal with even more details.
demo.mp4
You can customize the sources that Overlay uses by clicking on the Overlay logo in the extensions bar.
We would love to hear your feedback and suggestions on how to improve Overlay. You can contact us by:
- Creating an issue on our GitHub repository for bugs and features
- Joining our GitHub discussion for questions and ideas
- Participating in our Discord channel
We welcome contributions from anyone who wants to help us improve Overlay. If you are interested in contributing, please fork this repository and make your changes. Then submit a pull request with a clear description of your changes and why they are needed. We will review your pull request and merge it if it meets our standards.
Please make sure to follow our code style and conventions.
If you have any questions or suggestions about contributing, please feel free to contact us.
Overlay is written in Vue.js and uses a background script to fetch package data from various external sources.
It injects the indicator as a WebComponent into the current web pages and uses a popup menu to control the displayed sources.
To start developing the extension locally, follow these steps:
- Clone the project from the repository.
- Install the dependencies securely with
yarn setup
. - In one terminal, run
yarn build:watch
. This will rebuild the extension every time you change a file. - In another terminal, run
yarn start:chrome
(oryarn start:firefox
). This will reload the extension on the development browser every time the extension is built.
You can now test and debug the extension on Chrome or Firefox.
To run unit tests, use yarn test
. We use Jest for testing.
For end-to-end tests, see the e2e/README.md file.
- A YouTube video for the Ma'akaf community about how to start to contribute to this project (in Hebrew).
- https://www.linkedin.com/in/baruchiro/
- https://www.linkedin.com/in/jossef/
- https://www.linkedin.com/in/guy-nachshon-17ba80198/
- https://www.linkedin.com/in/bar-lanyado-bb50b3110/
- https://www.linkedin.com/in/bogdan-kortnov-58996b213/
- https://www.linkedin.com/in/uriklar/
- https://www.linkedin.com/in/elad-tal-0355531b7/
- You?
Overlay is licensed under the MIT license. See the LICENSE file for more details.