Building a Game with ReactJS and WebGL
JavaScript HTML CSS
Latest commit 0d4165f Sep 7, 2016 @AndrewRayCode Bumping package versions and updating coordinate system
There was an issue with r3r and latest react
toxicFork/react-three-renderer#102 updating
both packages fixed it.

Also installed highest possible three, r3r doesn't allow for 0.80.0 yet.

This is demo code to accompany the SitePoint article "Building a Game with ReactJS and WebGL"


npm install
npm start

Then open http://localhost:8080/webpack-dev-server/index.html

Project Setup

This basic example follows the Presentational and Container Components example. The logic is managed in GameContainer in the containers/ directory. The view code, game entitites, etc, live in components/.

The game logic is separated entirely from react and managed with the reducer functions in the game-reducers/ folder.

The game state is set once per requesetAnimationFrame callback in GameContainer.js.

This project use Babel, Webpack, and ESLint for ES6 syntax, asset management and code quality tools.