Create a Chrome Extension with React and Webpack - by Traveling Tech Guy

A Silicon Valley Code Camp session

In this session we'll cover:

1. What are Chrome extensions and why should you care? (3 minutes)
2. How to create a basic Chrome extension (10 minutes)
3. How to add React to the view parts, and how to use Webpack to package the extension (20 minutes)
4. Tie it all togather into a functional extension (10 minutes)
5. Q&A

The repo

The repo contains 4 folders:

1. Basic - a basic extension that does nothing.
2. Reactive - an extension that demonstartes working with React and Webpack, as well as advanced extension concepts.
3. StockQuote - our final extension, using all we've learned to get current stock quotes.
4. AgentOrange - a bonus extension, showing how to use a content script to manipulate a loaded page.

The docs folder contains the presentation, and can be viewed online at https://travelingtechguy.github.io/svcc-chrome-extension.

Comment: All the code attached is functional and minimal. It could probably be refactored to look nicer, or more OO, or more React-y. But that's not the purpose of this session. Feel free to improve on the code, and make it nicer, and even more functional. My sole request is: if you find bugs, or logical errors, or if the technology moves on, and certain concepts require updates - please open a PR. It'll be my pleasure to update this repo, and keep it current and working.