generator-player

A React/Redux/Typescript boilerplate generator to quickly get started on a new player application. Includes a browser based router (react-router) and a browser proxy to the monolith's base page for a better development experience.

A few resources on the technologies used:

• React
• Redux
• React Router
• ReDucks Pattern

Installation

1. install Yeoman and generator-player using npm (we assume you have pre-installed node.js).

$ npm install -g yo
$ npm install -g generator-player

2. Create a new folder or clone an empty git repo with the name of the app prefixed with "player-". Make that your current directory.

$ cd player-demo-app

3. Then generate the application, it will ask you for the application name. Use the same name as the folder:

$ yo player

4. It will attempt to run an installation to fetch all the dependencies, once that is complete, you can open it up in vscode and you're all set up to develop!

Scripts

Few scripts to remember:

$ npm start         // will start a dev server and watch your files, refreshing on every save.
$ npm run start:bp  // will open a browser proxy and watch your files, refreshing the monolith base page.

Note: The second option assumes you've already setup a local IIS application on your computer.

Folder Structure

.
+-- __mocks__           // mock files for jest tests
+-- scripts             // dev scripts
+-- src                 // contains all typescript code
|   +-- api             // API specific code
|   +-- common          // root reducer, translations, & store
|   +-- components      // all react components, follows the reDUCKS structure
|   +-- models          // typings
|   +-- pages           // all pages + router
|   +-- index.tsx       // root index/entry point for webpack
+-- tests               // jest tests
+-- .gitignore          
+-- config.json         // app configurations (locales groups, mocs, etc.)
+-- package.json        // package configurations + contains player configurations
+-- README.md           // self-explanatory
+-- tsconfig.json       // typescript configuration
+-- webpack.config.js   // webpack configuration for app

Player Resources

• Player control's portal (view controls developed for player): http://laxdevexwt/player-controls-portal/
• Contact manuel ([email protected]) for any issues or you can create an issue on this repo itself.

License

MIT © Manuel Yang