Memo game implementation in ReactJS and NodeJS
- One statefull component - App
- Card, CardGrid, Highscore, RegisterPlayer and Toollbar are stateless inherit from PureComponent, all data are passed using props
- logic folder - app logic layer. Functions to manipulate state and communicate with server, underneath it uses lodash/fp for immutability, functions in this module are pure (with one exception cardShuffle helper function). Returns either state or promise that resolves with state
- handlers - react <-> logic layer, event function that are executed within app context, those functions aren't pure. They execute setState each time state was modified by logic functions to nnotify react about changes
Idea was to move all logic away from React and apply it through event functions. We can call it a subset of DDD, also all functions that manipulate state are tested.
After yarn start documentation is available at http://127.0.0.1:8080/documentation. Use it as tests for backend since all of the logic there requires mocks to be tested, so using docs is better solution.
- replace lodash with RamdaJS
- apply react-redux with some frp to remove not-so-pretty function
- create pure components with functions rather than classes
Tested on Chrome since it has native support for fetch function
Install yarn, read how here.
Run the following commands:
git clone git@github.com:DPOrganizer/react-boilerplate.gitcd react-boilerplateyarn install
To start the application you can now run: yarn start
yarn lintRun code lintingyarn testRun tests using jestyarn test-coverageRun tests using jest and display coverageyarn buildBundle the applicationyarn startRun the development environmentyarn deployBuild the application in production modeyarn deploy-windowsBuild the application in production mode under Windows