This is a simple game developed using React Redux Starter Kit https://github.com/davezuko/react-redux-starter-kit.git.
The primary goal of this project is to play around with React and Redux
- node
^5.0.0 - yarn
^0.23.0or npm^3.0.0
After confirming that your environment meets the above requirements, you can clone the repo by doing the following:
$ git clone https://github.com/jileeshs/react-redux-game.git
$ cd react-redux-game.When that's done, install the project dependencies. It is recommended that you use Yarn for deterministic dependency management, but npm install will suffice.
$ yarn # Install project dependencies (or `npm install`)After completing the installation step, you're ready to start the project!
$ yarn start # Start the development server (or `npm start`)While developing, you will probably rely mostly on yarn start; however, there are additional scripts at your disposal:
yarn <script> |
Description |
|---|---|
start |
Serves your app at localhost:3000 |
build |
Builds the application to ./dist |
test |
Runs unit tests with Karma. See testing |
test:watch |
Runs test in watch mode to re-run tests when changed |
lint |
Lints the project for potential errors |
lint:fix |
Lints the project and fixes all correctable errors |
Hot reloading is enabled by default when the application is running in development mode (yarn start). This feature is implemented with webpack's Hot Module Replacement capabilities, where code updates can be injected to the application while it's running, no full reload required. Here's how it works:
-
For JavaScript modules, a code change will trigger the application to re-render from the top of the tree. Global state is preserved (i.e. redux), but any local component state is reset. This differs from React Hot Loader, but we've found that performing a full re-render helps avoid subtle bugs caused by RHL patching.
-
For Sass, any change will update the styles in realtime, no additional configuration or reload needed.
We use react-router route definitions (<route>/index.js) to define units of logic within our application. See the project structure section for more information.
Out of the box, this starter kit is deployable by serving the ./dist folder generated by yarn build. This project does not concern itself with the details of server-side rendering or API structure, since that demands a more opinionated structure that makes it difficult to extend the starter kit.