RFC 0004 - Developer Rig

RFCs
6

Insane variant - create twitch extension cli tool :upside_down_face:
I hope u understand me regardless of a ton of grammatical errors, i’m not native english speaker.

TwichExt CLI - commands

– twitchext init “my-awesome-ext-name” (possible init steps below)

  • Auth on twitch developer portal
  • Select one of pre-created ext from dev dashboard
  • Select available dev stack like Vanila JS vs TypeScript vs Flow, MobX vs Redux vs MobX-State-Tree
  • Select linter TSLint vs ESLInt vs Null
  • Auto create and init boilerplate with: webpack/gulp/* + babel + TypeScript/Flow + MobX/Redux/MobX-State-Tree + TSLint/ESLint + Jest

– twitchext rig (start local server with DevRig)
– twitchext deploy (build extension in zip and send it as new “In development” version ofc need to check if version already “Live” and so on, also here screenshots from pre-defined folder can be uploaded, after deploy log in console link on this version to continue preparation for hosted test also link on “channel for review”)

Troubles and how to avoid them

  1. Supporting this amount of dev stack variations - suicide. Best way provide one boilerplate following best practices on dev stack like this for example: React + MobX + Babel + Flow + ESLint + Jest + WebPack(possible best practices list):
    – Babel plugin to remove console.* messages
    – Localization strings example
    – Auto-hide overlay with video player elements(after 5 sec)
    – On context change event reactions like theme changing/game/resolution/language
    – ESLint/TSLint rules following guidelines and policies
    – …
  2. After deploy there is many things u need to change manualy in dev dashboard. Solution - create config twitchext.json
    Config example:
{
  "twitchext": {
    // Settings
    "name": "My awesome ext name",
    "summary": "My awesome ext so awesome Kappa",
    "author": "awesomeDev322",
    "oauthRedirectUri": "https://localhost/",
    "logo": "./images/awesomeIconOfAwesomeExt.png",
    "description": "Awesome description for awesome ext", 
    // Screenshots
    "screenshots": "./screenshots", // all screens from this path uploads on deploy
    // Version details
    "version": "0.1.0",
    "supportEmail": "awesome@awesomeservice.com",
    "EULAOrTermsOfServiceUrl": "",
    "privacyPolicyUrl": "",
    // Extension capabilities
    "requesIdentityLink": false,
    "requiredConfigurations": "awesome but required config info",
    "requiredBroadcastersAbilities": "",
    "whitelistedConfigUrls": "https://awesomedomain.io",
    "whitelistedPanelUrls": "https://alsoawesomedomain.io",
    // Asset Hosting
    "hosting": {
      "testingBaseURI": "https://localhost:8080", // if not defined use standard
      "viewerPath": "viewer.html", // if not defined use standard
      "configPath": "config.html",
      "liveConfigPath": "",
      "supportMobile": true // extension support mobile(only for panels)
    },
    // Access
    "broadcasterWhitelist": [ 46365073 ],
    "testingAccounts": [ 46365073,43665292,46365073 ],
    // Review details
    "nameOfChannelForReview": "https://www.twitch.tv/awesomeDev322",
    "walkthrougnGuide": "My awesome ext do awesome things and do it awesome what a twist LUL My awesome ext do awesome things and do it awesome what a twist LUL My awesome ext do awesome things and do it awesome what a twist LUL My awesome ext do awesome things and do it awesome what a twist LUL My awesome ext do awesome things and do it awesome what a twist LUL",
  }
}
  1. Some tools require experience(like MobX/Flow/Jest) can be fixed in two ways:
    – 2 boilerplates: “pro” and “vanila”(for beginners)
    – Provide small description/intro for all tools

Summary

TwitchExt CLI + boilerplate on fixed dev stack following best practices + DevRig = Profit!?

1 Like