Baseguard

🌱 Inspiration

Browser compatibility checking creates a lot of extra work for web developers. They spend time searching documentation, adding fallback code, and testing in different browsers to use new web features. The Baseline initiative made it easier to see which features are widely supported, but developers still needed to check and fix things by hand. BaseGuard was built to fix this problem and let AI handle compatibility, so developers can code without worrying about browser issues.

🛠️ What it does

BaseGuard is a command-line tool that blocks browser compatibility bugs from going live. When developers commit their code, BaseGuard:

• Scans for features that are not supported using official Baseline data.
• Uses Gemini AI to give advice on best fixes and explain user impact.
• Automatically applies fixes using the Jules coding agent.

Developers can use the newest features in JavaScript and CSS, and BaseGuard will make sure everything works in the browsers their users need. They can set up git hooks to catch problems before shipping code. The tool works with popular frameworks like React, Vue, Svelte, Angular, or just plain JS and CSS.

🧰 How we built it

BaseGuard was designed around several layers:

• Detection uses web-features and custom parsers for finding unsupported features.
• Analysis connects to Gemini AI for researching fixes.
• Implementation uses Jules AI to write code patches.
• Integration uses Husky to add git hooks and a simple CLI interface.

The tech stack includes Node.js, Commander.js for the CLI, Babel and PostCSS for parsing, Gemini for analysis, Jules for code generation, and Husky for hooks.

Code flow:
parse → detect features → lookup Baseline → find issues → Gemini gives advice → Jules creates fixes → patch gets added → commit continues.

⚡ Challenges faced

Mapping feature names from code to Baseline IDs was tricky, so a dictionary was built to match and fall back when needed. Different frameworks needed their own parsers, so modular architecture was set up to switch automatically. It was also challenging to turn technical Baseline data into plain language. The API key system was changed from shared keys to user-supplied keys for better security. Patching code across file types required careful use of diff libraries.

🏆 Accomplishments

BaseGuard is the first to combine Baseline detection with AI-powered auto-fixing. It works with any editor since it relies on git rather than editor plugins. The setup is fast, so developers can start with good defaults right away.

🚀 What’s next

The roadmap includes a VS Code extension with real-time warnings and one-click fixes, support for more frameworks, and local caching for faster checks.

1

Built With

• babel
• boxen
• chalk
• husky
• javascript
• node.js
• ora
• postcss
• typescript