Commit Genius

• 

  google extension

• 

  web app

Inspiration I built Commit Genius to solve a universal developer pain point: writing clear, consistent Git commit messages. Poor commit history creates confusion, slows down debugging, and makes collaboration harder. I was inspired by the Conventional Commits standard to automate and simplify this process.

What I Learned Browser Extension Development: Mastered Chrome Manifest V3, content scripts, and message passing between isolated contexts. Vanilla JS Power: Built a robust, framework-free application using modern CSS and JavaScript. Developer Experience (DX): Designed tools that integrate seamlessly into existing workflows (like injecting directly into GitHub).

How I Built It Frontend: Pure HTML5, CSS3 (with variables for theming), and vanilla JavaScript. Extension: Chrome Extension API for injecting UI into GitHub and messaging between components. Architecture: Dual-platform—standalone web app + browser extension sharing the same core logic.

Key Challenges GitHub’s Dynamic DOM: Reliably injecting our button into GitHub’s complex interface. Context Isolation: Bridging communication between the extension popup and GitHub’s page using chrome.runtime.sendMessage. Dual-Platform UI: Designing a single interface that works as both a full web app and a constrained popup.

What’s Next CLI tool for terminal integration Team analytics dashboard for commit health IDE plugins (VS Code, IntelliJ) AI-powered message suggestions

Commit Genius turns a tedious task into an automated, seamless experience—helping developers write better code, one commit at a time.

Built With

• chrome-extension-api
• css
• css3
• github-codespaces
• html5
• javascript
• roo