Skip to content

Latest commit

 

History

History
65 lines (41 loc) · 2.36 KB

README.md

File metadata and controls

65 lines (41 loc) · 2.36 KB

SVG Banners

React for streamElements

  • Hi, I want to be a leader to help people with streaming and nice UI integrations.

  • Follow me on twitch: https://www.twitch.tv/t1gu1sensei (Im a French QC Canadian, but I understand english well if you have some questions)

  • You can ask for some feature in the issue section with the enhancement label.

  • If you want contribute to the project, go for it!

Install

  • Make sure you know how to use React.js
  • npm install to install packages
  • npm run start to run the project locally
  • npm run build to build project and get final files

How to import to streamElements

  • HTML: Copy build/static/index.html for the HTML section
  • JS: Copy only build/static/js/bundle.min.js for the javascript section
  • CSS: Copy build/static/css/bundle.min.css for the css section
  • Image: Don't worry buddy, images are inline into base64. (Nothing to do)

Listen EVENTS (follow, subs, etc)

I already integrated that part: https://docs.streamelements.com/docs/connecting-via-websocket. So you just have to create your .env file and put your token on REACT_APP_STREAMELEMENTS_TOKEN.

env

Create the .env file at the root of the project and add your token to the REACT_APP_STREAMELEMENTS_TOKEN env variable. At the root of the project and add channel name to the REACT_APP_CHANNEL_NAME env variable to use BOT that will send you chat message.

Example:

REACT_APP_STREAMELEMENTS_TOKEN=my_stream_element_token
REACT_APP_CHANNEL_NAME=channelName

Nice packages integrated

Animate.css

StreamElements API Documentation (Events)

https://github.com/StreamElements/widgets/blob/master/CustomCode.md

Currently I add everything of that in providers/AlertsProviders.js

TODO: Add other events like Host, Raid, Merch

Twitch chat events (tmi.js)

https://github.com/tmijs/tmi.js

Currently I add everything of that in providers/ChatProvider.js