https://github.com/jchavarri/chrome-extension-starter-reason-react

Getting Started: Building a Chrome Extension with ReasonReact
https://github.com/jchavarri/chrome-extension-starter-reason-react

chrome-extension react reason reason-react reasonml

Last synced: 7 months ago
JSON representation

Getting Started: Building a Chrome Extension with ReasonReact

• Host: GitHub
• URL: https://github.com/jchavarri/chrome-extension-starter-reason-react
• Owner: jchavarri
• License: mit
• Created: 2017-11-23T18:52:36.000Z (almost 8 years ago)
• Default Branch: master
• Last Pushed: 2018-06-09T10:15:07.000Z (over 7 years ago)
• Last Synced: 2025-02-28T06:04:21.843Z (7 months ago)
• Topics: chrome-extension, react, reason, reason-react, reasonml
• Language: OCaml
• Size: 9.77 KB
• Stars: 24
• Watchers: 2
• Forks: 3
• Open Issues: 0
• Metadata Files:
  • Readme: README.md
  • License: LICENSE

Awesome Lists containing this project

README

          
# A Chrome Extension with ReasonReact

This is a starter example to build a Chrome extension using ReasonReact. It is 100% based on the original started project ["Getting Started: Building a Chrome Extension"](https://developer.chrome.com/extensions/getstarted).

The project consists on placing a clickable icon right next to Chrome's Omnibox for easy access. Clicking that icon opens a popup window that allows the user to choose the background color of the current page. If the user had selected a background color for the page earlier, the extension will remember the user's choice and use it as the default, once the popup is clicked:

![Getting started preview](https://developer.chrome.com/static/images/gettingstarted-preview.png)

### Running

Run this project:

```

npm install

npm start

# in another tab

npm run webpack

```

After you see the webpack compilation succeed (the `npm run webpack` step), open up the nested html files in `src/*` (**no server needed!**). Then modify whichever file in `src` and refresh the page to see the changes.

**For more elaborate ReasonReact examples**, please see https://github.com/reasonml-community/reason-react-example

### TODO

Contributions welcomed :)

- [ ] Make production webpack config

- [ ] The project is based in [this temporary branch of `bucklescript-chrome`](https://github.com/jchavarri/bucklescript-chrome/tree/start-extensions) (the bindings for Chrome API). `package.json` should be changed once / if the changes are merged upstream