Hey there!
I wanted to share my project that can be used as a starter for extensions development using React:
https://github.com/mBeierl/twitch-extension-starter
It also has build & package scripts that will create the ZIP file needed to upload a new version of your extension.
Any feedback and contributions are welcome!
Just found this. You’re amazing.
Thanks! 
New parcel update solves the csp issue and allows multiple entry points. Will update the repo soon
Amazing work.
I based my extension on your repo but i changed some stuff to correspond to my project ! 
Please feel free to submit a PR if you think your changes might benefit others as well. 
FYI: I just pushed an update (v1.2). It adds new entrypoints for mobile, video component & video fullscreen.
I also use the official parcel-bundler release now, as they’ve fixed some stuff (like the CSP issue) and added lot more features to further improve DX.
Hi there mBeierl,
Can this work with the developer rig? If so, you wouldnt have a “getting started” guide for getting this starter extension working with the developer rig?
I appreciate any response! thank you!
Hi @Exxili,
It works with the developer rig. Follow these steps :
git clone https://github.com/mBeierl/twitch-extension-starter.git
cd twitch-extension-starter
yarn
EXT_CLIENT_ID=<client id> EXT_SECRET=<secret> EXT_VERSION=<version> yarn start
If you have any issue, i’m here
Arnaud
Hey arnaud, That does indeed launch the extension itself hosting at localhost:8080. But when then launching the developer rig via run.cmd provided the extension does not display on the Rig.
Perhaps I am doing something wrong, are we not supposed to host the extension with the rig? I may have got my thoughts mixed here.
The rig runs the testing environment, and using the ENV variable provided loads the config data from Twitch on where to look for your extension. If you’re running your extension on localhost:8080, have you set that as the Testing Base URI in your extension settings? If you have, the next things to check would be go to the extension url and make sure it’s accessible to you and accept any invalid certificates. If you’ve done that, check the config settings in the rig to make sure that’s all correct, and the console on the dev rig for errors.
Just to chime in, the current Run script is highly tuned to getting a user to Hello World using the existing Hello World sample. If you’re looking to run your project locally, I’d recommend checking out this guide - https://github.com/twitchdev/developer-rig/blob/master/docs/MacLocal.md - it breaks down the run steps that the script is using and you can apply it to your own code. You’ll want to focus on the yarn host command.
If you have suggestions for better general scripts, happy to hear your thoughts!
I personally still have to test the rig myself. Was testing my starter repo directly on Twitch for now, but generally it should also work using the rig as @arnaudmanaranche mentioned.
Once I get to it, will update the README in my the starter repo to explain how to use it with the rig.
@mBeierl I wanted to ask you something, I saw how you structured the project (I haven’t been able to get it working yet, I’m a beginner) the question is, does it not work using react router for your links? Do you need to have a separate html for the extension like you did here for example
if (rootVideoComponent) {import("./components/VideoComponentPage/VideoComponent.js").then(VideoComponent =>
ReactDOM.render(<VideoComponent.default />, rootVideoComponent)
);
instead of using Route?
Thank you
If you were to check the timestamp of this thread when you bumped it you would notice that it’s 10 months old, and is very out-dated.
The main issue with the way components are loaded in the repo from this thread is that it bundles all views together into a single bundle. Extensions are a multi-page app and should be treated as such in the build process, rather than creating a singular bundle for all views.
TwitchDev has released their own extension boilerplate built on React, you may want to check that out instead: https://github.com/twitchdev/extensions-boilerplate
Ok, thank you. I did not know 10 months old was very outdated 
I was not bumping it, it is a question
Anyways, I was not able to get the extensions-boilerplate working the other day, I will try again today after all I’ve read, maybe I will be able to, I need to get a react project running by Monday.
Thank you, it’s good to know that I better work on the other option, it is kind of hard for me
Yeah, I definitely recommend using the official TwitchDev repos. There’s also the extension-getting-started repo, which should give you a good intro if you’re a beginner.
The starter repo I created last year was even before the official extension rig from TwitchDev arrived. I will add an outdated note to its README and archive it on GitHub.
Thank you for letting me know