🤼‍♂️ A boilerplate server and client setup for Three.js multiplayer using Socket.io
Switch branches/tags
Nothing to show
Clone or download
Fetching latest commit…
Cannot retrieve the latest commit at this time.
Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
public
resources
src
views
.gitignore
LICENSE
README.md
package-lock.json
package.json
server.js

README.md

THREE Multiplayer

PRs Welcome

My boilerplate Node.js server and client setup for Three.js multiplayer projects using Socket.io

Multiplayer

Installation

  1. Clone the repo, e.g git clone https://github.com/juniorxsound/THREE-Multiplayer.git
  2. Run npm install to install all the dependencies

Tested on macOS 10.13.3 using Node.js v8.9.3 and npm v5.6.0

Usage

Use npm run start to start the server and bundler

NPM

The start script launches:

  • nodemon Which restarts the server on every change (port: 1989)
  • watchify Which bundles the client code from src/ on every change to ./public/js/bundle.js

Server Log

On connection each client recives it's uniqe ID and on every movement broadcasts to all the other clients all the locations of everyone connected

{
  'some-user-id': {
    position: [0.4, 1.4, -0.5],
    rotation: [0, 0, 0]
  }
}

You can also run npm run build to bundle and minify the client code to ./public/js/bundle.min.js

Browserify is setup to transform both ES6 Javascript and glslify for GLSL shader bundling (example of a project that uses glslify)

Pushing to Heroku

This is a detailed tutorial of how to push your code to Heroku through Github to serve your experience publicly

Special thanks to Dror Ayalon