Scraper Configuration UI - Chrome Extension Development

Challenge Context

• Build a chrome extension to capture CSS selectors from web pages, which will in term generate a json based config to be sent to a backend API.

Project Context

• Client is building a web scraper to scrape some information from a few different websites, and the extension will help users better identify the key elements to scrape from the websites.

Expected Outcome

• A fully working Chrome extension that covers all the requirements.

Challenge Details

• We'd like the extension to be build with ReactJS, this could be a good start if you are unfamiliar with the approach.
• The extension should try to maintain compatibility with FireFox by using the Web Extensions API.
• The extension should support localization, perhaps by using react-i18next, the purpose is that there should be a centralized place to provide translation texts for different languages.
• Here's the previous challenge we launched to build a basic version of the extension, now we are completely rewriting it.
• Please register to download the detailed functional requirements spec from the challenge forum.

Scorecard Aid

• This challenge will use the standard code challenge scorecard without unit tests.

Technology

• ReactJS
• Javascript
• Chrome Extension Development
• REST

Browser

• Chrome Latest on all systems

Final Submission Guidelines

• All original source code in a single zip file.
• A detailed README in markdown format explaining how to build, configure, run and verify your submission.
• Specifically, please include details on how to test this extension locally and publish it for others to download. Please clearly describe how to uninstall the extension in dev mode as well.