All Projects → mmazzarolo → Chrome Another Tab

mmazzarolo / Chrome Another Tab

Licence: gpl-3.0
Just building a Chrome Extension with Create React App and TypeScript.

Programming Languages

typescript
32286 projects

Projects that are alternatives of or similar to Chrome Another Tab

Curiosity
Find Amazing Github Projects ⚡️
Stars: ✭ 216 (-7.3%)
Mutual labels:  chrome-extension
What Have You Made Today
Chrome & FireFox extension to replace the default home page. What have you made today?
Stars: ✭ 223 (-4.29%)
Mutual labels:  chrome-extension
Gofw
Chrome 扩展:麻麻再也不用担心 Google API 抽风了
Stars: ✭ 229 (-1.72%)
Mutual labels:  chrome-extension
Like On Github
Chrome extension - Link a repository with the extension and automatically save the links to content you like
Stars: ✭ 218 (-6.44%)
Mutual labels:  chrome-extension
Bandwidth Hero
💂 Saves data by compressing images on web page
Stars: ✭ 220 (-5.58%)
Mutual labels:  chrome-extension
Bypass Paywalls Chrome
Bypass Paywalls web browser extension for Chrome and Firefox.
Stars: ✭ 20,876 (+8859.66%)
Mutual labels:  chrome-extension
Client
一叶客户端源代码
Stars: ✭ 212 (-9.01%)
Mutual labels:  chrome-extension
Browserextension
💻 SteamDB's extension for Steam websites
Stars: ✭ 230 (-1.29%)
Mutual labels:  chrome-extension
Responsive Viewer
Responsive Viewer - chrome extension to show multiple screens in one view.
Stars: ✭ 221 (-5.15%)
Mutual labels:  chrome-extension
Module Linker
browse modules by clicking directly on "import" statements on GitHub ⛺
Stars: ✭ 229 (-1.72%)
Mutual labels:  chrome-extension
Excellent Software
收集那些优秀的软件(Windows & Mac & Android & Chrome Plugins)
Stars: ✭ 220 (-5.58%)
Mutual labels:  chrome-extension
Ghosttext
👻 Use your text editor to write in your browser. Everything you type in the editor will be instantly updated in the browser (and vice versa).
Stars: ✭ 2,614 (+1021.89%)
Mutual labels:  chrome-extension
Refined Github
Browser extension that simplifies the GitHub interface and adds useful features
Stars: ✭ 16,446 (+6958.37%)
Mutual labels:  chrome-extension
Web Clipper
For Notion,OneNote,Bear,Yuque,Joplin。Clip anything to anywhere
Stars: ✭ 3,645 (+1464.38%)
Mutual labels:  chrome-extension
Etheraddresslookup
Adds links to strings that look like Ethereum addresses to your favourite blockchain explorer. Adds protection against private key phishing. Offers custom site bookmarks.
Stars: ✭ 230 (-1.29%)
Mutual labels:  chrome-extension
Generator Web Extension
Advanced WebExtension generator that creates everything you need to get started with cross-browser web-extension development.
Stars: ✭ 212 (-9.01%)
Mutual labels:  chrome-extension
Grpc Web Devtools
Chrome & Firefox Browser extension to aid gRPC-Web development
Stars: ✭ 223 (-4.29%)
Mutual labels:  chrome-extension
Generator Chrome Extension Kickstart
Scaffold out a Web Extension http://yeoman.io
Stars: ✭ 232 (-0.43%)
Mutual labels:  chrome-extension
Audion
Audion (Web Audio Inspector) is a Chrome extension that adds a Web Audio panel to Developer Tools. This panel visualizes the web audio graph in real-time and lets users inspect nodes.
Stars: ✭ 230 (-1.29%)
Mutual labels:  chrome-extension
Piper
Browser extension that adds Picture in Picture support to YouTube, Netflix, Amazon Video, Twitch, Plex, and more!
Stars: ✭ 227 (-2.58%)
Mutual labels:  chrome-extension

 

Another Tab - Chrome Extension

An open source Chrome extension that shows your bookmarks when you open a new tab.
Built with Create React App and TypeScript.

 

Another Tab

Another Tab Download Another Tab from the Chrome Web Store

...or try it live!

Overview

I initially built this extension just for personal use... and for trying building a Chrome extension 🤷‍♂️, so for now it has just the features that I need...
That said, PRs are welcome!
Check the DEVLOG to see the history of the project.

Features

  • Shows your bookmarks in the new tab page
  • Bookmarks filtering/search
  • Keyboard navigation support
  • Bookmark folders visibility toggle
  • Themes support
  • Drag & drop bookmark sorting

Stack

  • React (using Create React App) and hooks
  • TypeScript
  • Styled-Components
  • Redux, Redux-Saga and Typesafe-Actions

Contributing

Feature request

I already created a few issues with some features that I feel like would be really welcomed addition, and I'm open to any other additional suggestion... especially if you already have an idea to implement it's UI/UX.

Developing locally

This is a standard Create React App, so you can easily start working on it by simply cloning the project and running yarn to install all its dependencies.
To develop the app locally you can run yarn start, I already included some fake bookmarks to simulate the production behaviour of the extension.

Development tips

This app uses TypeScript, React Hooks, Redux and Styled-Components, so you might need to be confortable with these technologies to completely understand the codebase.
The app is still pretty simple, doesn't have too many components and most of the logic is just in the Chrome Bookmarks parsing and in the Redux sagas.
If you feel intimidated by the codebase please just open an issue/send a PR, I'm open to discussion and tips.
Also, if you're not confortable with hooks feel free to use class components.

Chrome Web Store deployment

I setup a semi-automated Chrome Web Store deployment using CircleCI.
It currently runs only when the master branch receives a new push, but I still haven't automated the version number bumping (so I still have to do it manually).
It would be great making the publishing step manipulate the manifest.json so that it reflects the package.json version and/or a git tag.

Live example deployment

The "live example" is just a customized version of the production build of the app deployed on GitHub Pages. If you check the gh-pages script in the package.json you'll see that I'm setting a REACT_APP_IS_LIVE_EXAMPLE environment variable before running the GitHub Pages deployment: this will allow the build to use the fake bookmarks instead of trying to get them from the Chrome API (like if it was an extension running in the browser).

GitHub organization?

If the app starts getting contributions I'll gladly create a new ad-hoc organization for it, instead of keeping it in my personal profile.

Note that the project description data, including the texts, logos, images, and/or trademarks, for each open source project belongs to its rightful owner. If you wish to add or remove any projects, please contact us at [email protected].