Skip to content

About

Web browser extension for enhanced bookmark usage

Resources

Code of conduct

Stars

0 stars

Watchers

0 watching

Forks

Repository files navigation

Bookmark+ Logo

πŸ“š Bookmark+

Enhanced bookmark management with intelligent tagging and lightning-fast search

Features β€’ Installation β€’ Development β€’ Contributing β€’ License

Version License Build Status

React TypeScript Webpack Sass

Chrome Firefox Opera Edge


✨ Features

πŸš€ Core Features

  • πŸ“š Smart Bookmark Management - Organize your bookmarks intelligently
  • 🏷️ Advanced Tagging System - Flexible tag-based organization
  • πŸ” Lightning Search - Find bookmarks instantly with advanced filters
  • ⚑ Fast Performance - Optimized React + TypeScript architecture
  • 🎨 Beautiful UI - Modern, responsive design with SASS styling

🌐 Cross-Platform

  • πŸ”΅ Chrome Extensions - Full Chrome Web Store support
  • 🦊 Firefox Add-ons - Complete Firefox compatibility
  • πŸ”΄ Opera Extensions - Native Opera integration
  • πŸ”· Edge Extensions - Microsoft Edge support
  • πŸ”„ Unified Codebase - One source for all browsers

πŸš€ Quick Start

Prerequisites

Node.js Yarn npm

Installation

# Clone the repository
git clone https://github.com/your-username/bookmark-plus.git
cd bookmark-plus

# Install dependencies
npm install
# or
yarn install

Development

# Development mode with hot reload
npm run dev:chrome    # πŸ”΅ Chrome
npm run dev:firefox   # 🦊 Firefox  
npm run dev:opera     # πŸ”΄ Opera

# Production build
npm run build         # πŸš€ All browsers
npm run build:chrome  # πŸ”΅ Chrome only

Browser Installation

πŸ”΅ Chrome Installation
  1. Open chrome://extensions/
  2. Enable Developer mode (top-right toggle)
  3. Click Load unpacked
  4. Select the extension/chrome folder
  5. πŸŽ‰ Ready to use!
🦊 Firefox Installation
  1. Open about:debugging
  2. Click This Firefox
  3. Click Load Temporary Add-on
  4. Select manifest.json in extension/firefox
  5. πŸŽ‰ Ready to use!
πŸ”΄ Opera Installation
  1. Open opera:extensions
  2. Enable Developer mode
  3. Click Load unpacked
  4. Select the extension/opera folder
  5. πŸŽ‰ Ready to use!

πŸ—οΈ Architecture

Tech Stack

React
React
TypeScript
TypeScript
Webpack
Webpack
Sass
Sass
Babel
Babel
ESLint
ESLint

Project Structure

πŸ“¦ bookmark-plus/
β”œβ”€β”€ πŸ“‚ source/                    # 🎯 TypeScript + React source
β”‚   β”œβ”€β”€ πŸ“‚ Background/            # πŸ”§ Background scripts
β”‚   β”œβ”€β”€ πŸ“‚ ContentScript/         # πŸ“„ Content scripts  
β”‚   β”œβ”€β”€ πŸ“‚ Popup/                 # πŸ–ΌοΈ Extension popup
β”‚   β”œβ”€β”€ πŸ“‚ Options/               # βš™οΈ Options page
β”‚   β”œβ”€β”€ πŸ“‚ components/            # 🧩 Reusable components
β”‚   β”œβ”€β”€ πŸ“‚ services/              # πŸ› οΈ Business logic
β”‚   └── πŸ“„ manifest.json          # πŸ“‹ Extension manifest
β”œβ”€β”€ πŸ“‚ views/                     # 🌐 HTML templates
β”œβ”€β”€ πŸ“‚ extension/                 # πŸ“¦ Built extensions
β”‚   β”œβ”€β”€ πŸ“‚ chrome/               # πŸ”΅ Chrome build
β”‚   β”œβ”€β”€ πŸ“‚ firefox/              # 🦊 Firefox build
β”‚   └── πŸ“‚ opera/                # πŸ”΄ Opera build
β”œβ”€β”€ πŸ“„ webpack.config.js         # ⚑ Build configuration
└── πŸ“„ package.json              # πŸ“‹ Project metadata

πŸ”§ Development Scripts

Command Description Usage
npm run dev:chrome πŸ”΅ Chrome development with hot reload Daily development
npm run dev:firefox 🦊 Firefox development with hot reload Firefox testing
npm run dev:opera πŸ”΄ Opera development with hot reload Opera testing
npm run build πŸš€ Production build for all browsers Release preparation
npm run lint πŸ” Code quality check Pre-commit hook
npm run lint:fix πŸ”§ Auto-fix linting issues Code cleanup

🀝 Contributing

We love contributions! Here's how you can help make Bookmark+ even better:

PRs Welcome Issues Welcome Discussions Open
  1. 🍴 Fork the repository
  2. 🌿 Create your feature branch (git checkout -b feature/amazing-feature)
  3. πŸ’» Commit your changes (git commit -m 'Add amazing feature')
  4. πŸš€ Push to the branch (git push origin feature/amazing-feature)
  5. 🎯 Open a Pull Request

πŸ™ Acknowledgments

Built with πŸ’œ using the excellent web-extension-starter boilerplate

Special thanks to @abhijithvijayan for the amazing foundation!


πŸ“„ License

MIT License Β© 2024 Bookmark+

License MIT


Made with ❀️ for the developer community

Buy Me a Coffee

πŸ“§ Contact β€’ 🌐 Website

About

Web browser extension for enhanced bookmark usage

Resources

Code of conduct

Stars

0 stars

Watchers

0 watching

Forks

Releases

Sponsor this project

Packages

Contributors

Languages