This chrome extension was designed to summarize web content easily so users can spend less time reading content and more time on the things they enjoy!
To set up an OpenAI account and get an API key, follow these steps:
Visit the OpenAI website (https://openai.com) and click on the "Sign Up" button. Create an account using your email address or by signing in with Google or Microsoft. Once logged in, navigate to the API section (https://platform.openai.com/). In the left sidebar, click on "API Keys" and then "Create new secret key" to generate your API key. Copy and securely store your API key, as it won't be shown again.
Note: To use the API, you'll need to purchase credits. After logging in, go to the "Billing" section in your account dashboard. Here, you can add a payment method and buy credits. The amount of credits you'll need depends on your usage, so start with a small amount and monitor your consumption. Remember to keep your API key confidential and never share it publicly. It's also a good practice to set up usage limits and notifications in your OpenAI account settings to avoid unexpected charges.
The backend serves as the server-side component of the extension. Its primary role is to process and summarize text selected by users in their browser. When the extension captures selected text, it sends this data to the backend, which then communicates with the OpenAI API to generate a summary. The backend ensures secure management of API keys, performs text processing, and sends the summarized content back to the extension for display. By offloading these tasks to the backend, you enhance security, maintain separation of concerns, and ensure that sensitive operations are not exposed in the frontend code.
Go to backend directory:
cd API
Create a virtual environment:
python -m venv env
Activate the virtual environment:
On macOS/Linux:
source env/bin/activate
On Windows:
env\Scripts\activate
Install dependencies:
pip install -r requirements.txt
Create a .env file in the API directory and add your environment variables:
OPENAI_API_KEY=your_openai_api_key)
Run the FastAPI application:
uvicorn main:app --reload
After usage deactivate your virtual environment:
deactivate
The frontend of the Chrome extension is designed to capture user interactions on web pages and facilitate communication with the backend. It consists of a content script that listens for text selections, a background script that handles the messaging between the content script and the backend server, and a manifest file that configures the extension's metadata and permissions. When a user selects text, the content script sends this data to the background script, which then requests a summary from the backend server. The extension's user interface, defined in the manifest, displays the summarized text, providing a streamlined and integrated user experience directly within the browser.
Load the Extension:
Open Chrome and navigate to the Extensions page by entering chrome://extensions/ in the address bar. Enable Developer mode by toggling the switch in the top right corner.
Click the "Load unpacked" button and select the directory containing your extension files. Pin the Extension:
After loading the extension, pin it to the Chrome toolbar for easy access. Click on the puzzle piece icon (Extensions) in the top right corner of Chrome, then click the pin icon next to your extension.
On any webpage, select the text you want to summarize. You can either highlight specific text with your mouse or use the "Select All" option to choose all content on the page. A popup will appear with the summarized content generated by the extension.