Save to Pocket is a browser extension that is used to save pages to a connected Pocket account when clicking a toolbar button, selecting a context menu item, or pressing keyboard shortcut. When a page is saved, a “Saved to Pocket” notification appears and offers additional actions, including:
- Add Tags (with support for Suggested Tags for Pocket Premium subscribers)
- Remove Page
- View List
- Settings
This is the skeleton structure for the Save to Pocket extension codebase.
It leverages a rollup
build script to keep things simple when working with the operational code.
At this time it is set up to use the following:
- React
- Jest for testing
- Eslint for JS linting
- Babel for ES6/7
- Linaria
- Rollup
- Storybook
- Prepare your project
- Install dependencies
- Create a development/production build
- Load the extension into your browser
Before you get started you will need to do the following:
- Register an API key from https://getpocket.com/developer/
- Create a keys.json file in the root directory of the project with the folowing format:
{
"browserName": "key"
}
- During the build process it will inject the key into the manifest file
The app is bundled with rollup via node. You may use NPM to run the build/start/test scripts.
npm install
Run npm run build
This will create an optimized build and place it inside _build
at the root
directory.
Running npm run storybook
will open a development envorinment to allow for building and testing of simple components.
Run npm run release
This will create an optimized build, zip it up, and place it inside _releases
at the root
directory.
To load the extension:
- Open chrome and navigate to chrome://extensions
- Check the
Developer mode
in the upper right - Select
Load unpacked extension...
- Select the
_build
folder when prompted.
TBD
-
downshift - MIT License (MIT) Copyright (c) 2017 PayPal
-
linaria - MIT License (MIT) Copyright (c) 2017 Callstack
-
match-sorter - MIT License (MIT) Copyright (c) 2020 Kent C. Dodds
-
prop-types - MIT License (MIT) Copyright (c) 2013-present, Facebook, Inc.
-
react - MIT License (MIT) Copyright (c) 2013-present, Facebook, Inc.
-
react-dom - MIT License (MIT) Copyright (c) 2013-present, Facebook, Inc.
-
autosize-input - MIT License (MIT) Copyright (c) 2017 Jed Watson.
-
webextension-polyfill - Mozilla Public License Version 2.0
-
babel - MIT License (MIT) Copyright (c) 2014-present Sebastian McKenzie and other contributors
-
rollup - MIT License (MIT) Copyright (c) 2017 contributers
-
storybook - MIT License (MIT) Copyright (c) 2017 Kadira Inc.
-
types - MIT License (MIT)
-
cross-env - MIT License (MIT) Copyright (c) 2017 Kent C. Dodds
-
eslint - Copyright (c) OpenJS Foundation
-
jest - MIT License (MIT) Copyright (c) Facebook, Inc.
-
prettier - MIT License (MIT) Copyright (c) James Long
-
styled-jsx - MIT License (MIT) Copyright (c) 2016-present Vercel, Inc.