Extro is an opinionated, open-source browser extension starter kit designed to accelerate the development of production-ready extensions. It leverages a modern tech stack and incorporates best practices learned from building multiple browser extensions, focusing on code reuse and scalability.
Key Features:
- Full Type-Safety: Built with TypeScript for robust and maintainable code.
- Comprehensive Page Support: Includes pre-configured setups for all essential extension pages: background service worker, popup, options, devtools, newtab, sidepanel, and unlisted custom pages.
- Content Scripts: Easily integrate UI elements and logic directly into web pages.
- Authentication (OAuth): Securely manage user authentication sessions across all extension pages.
- Data Management: Provides solutions for storage and inter-page messaging.
- Developer Experience: Features hot reloading for rapid development, linting, and formatting with Biome, and enhanced DX with
ts-reset. - Deployment & CI/CD: Supports one-click publishing and includes pre-configured CI/CD pipelines for streamlined releases.
- Internationalization (i18n): Ready for global audiences with built-in internationalization support.
- Analytics: Integrates with OpenPanel for open-source analytics.
- UI Components: Compatible with shadcn/ui and utilizes Tailwind CSS for a modern, extendable UI.
- Experimental AI Integration: Includes native AI integration capabilities.
- Environment Variables: Manages configuration with environment variables.
- Unit Tests: Ensures code quality and reliability with unit testing setup.
Tech Stack Highlights:
- Frontend: React, shadcn/ui, Tailwind CSS
- Extension Framework: WXT (Next-gen Web Extension Framework)
- Backend/Database: Supabase (open-source Firebase alternative)
- Package Manager/Build Tool: Bun, Vite
- Code Quality: TypeScript, Husky (Git hooks), Biome (Linting and formatting)
- Forms: React Hook Form
- Analytics: OpenPanel
Use Cases:
Extro is ideal for developers and teams looking to quickly build and deploy high-quality browser extensions for Chrome, Firefox, and and Edge. It provides a solid foundation for various extension types, from productivity tools to data-driven applications, ensuring a smooth development workflow and a scalable architecture.
