chrommy

• 

  overall look

Inspiration

I discovered this competition while researching Google DevTest, and it felt like an exciting challenge to build a Chrome extension within just two weeks (I found out about it on November 4th). I instantly fell in love with the process of creating a Chrome extension because of the significant impact it can have—unlike a single webpage, it enhances users' browsing experiences directly.

What It Does

The extension features a sidebar that allows users to summarize the content of the current tab and ask follow-up questions. It also functions as a general AI assistant. I built additional features, including the ability to save chat history and let users input personal information beforehand, enabling sessions to start with preloaded user context. Additionally, I created a predictive typing feature that suggests sentences while users type in any text area.

How It Was Built

I used Vite for the sidebar, integrated Tailwind CSS for styling, and leveraged several other tools to bring the project to life.

Challenges We Faced

One major challenge was ensuring the chat API responded as expected. It took long hours of testing various system messages to achieve optimal performance. Additionally, building the UI and related components presented numerous obstacles, but persistence and problem-solving helped us overcome them.

Accomplishments We’re Proud Of

Completing a fully functional chat system within two weeks exceeded my expectations and reaffirmed my ability to learn quickly. I’m particularly proud of my determination to keep going, even when the project seemed impossible to complete. The experience was both challenging and rewarding.

What We Learned

The biggest takeaway was learning how to create a Chrome extension—from understanding how background scripts and side panels work to integrating features seamlessly. This was also my first time contributing to an open-source project, making it a valuable learning experience and a strong showcase of my skills.

Built With

• chatapi
• javascript
• tailwindcss
• vite