Skip to content

Latest commit

 

History

History
124 lines (77 loc) · 5.66 KB

README.md

File metadata and controls

124 lines (77 loc) · 5.66 KB
Raw

serge-web

GitHub license JavaScript Style Guide lerna Maintainability Test Coverage Build Status

Serious Gaming, Evolved - web interface

Installation and quick-start

In your command line, navigate to the project and then run the following commands:

  yarn install
  yarn build
  yarn serge

This will start the full application in 'demo' mode, you can see the application in action by visiting: http://localhost:8080.

Front-end development

For front-end developers relying on live rebuilds, can simply run the following

  yarn install
  yarn build
  yarn develop

This will do all of the building for you and then start the front-end server. The development environment will start up, and after a few seconds the browser page will open at something like localhost:3000. The IP address for the backend server should be appended to this, so the URL looks like: http://localhost:3000/?host=http://192.168.1.115:8080.

Note: to get into the backend in admin mode, you may need to use a URL like: http://localhost:3000/serge/admin?host=http://localhost:8080

This will also start our Storybook implementation for more information about that, please see the readme in the components package. If you'd rather not run storybook as part of this process, then simply run yarn dev instead of yarn develop

Quick access to games & roles

Again for developers, there are convenient ways of going directly into a particular wargame, registered as a particular user. This is through the user of the wargame and access URL parameters, like this:

http://localhost:3000/?wargame=wargame-k5kw38gf&access=p5543

Monorepo & package management

This repo is a monorepo using Lerna.

Splitting up large codebases into separate independently versioned packages is extremely useful for code sharing. However, making changes across many repositories is messy and difficult to track, and testing across repositories gets complicated really fast.

To solve these (and many other) problems, some projects will organize their codebases into multi-package repositories (sometimes called monorepos).

Each package folder has it's own npm package.json and is automatically linked together with lerna. Just remember to add the package to the dependencies section of package.json (don't forget to prefix with the @serge scope!) and then run yarn install in the root of the repo.

Manage dependencies for packages like normal, but remember to use yarn add instead of npm install.

Run locally

You'll need Git and Node.js installed to get this project running.

Note: You will need the active LTS (Long-term support) Node.js version for this project (as specified in .nvmrc)

Fork repository (optional)

If you're an external contributor make sure to fork this project first

Clone repository

git clone git@github.com:serge-web/serge-web.git # or clone your own fork

cd serge-web

Using nvm (optional)

If you work across multiple Node.js projects there's a good chance they require different Node.js and npm versions.

To enable this we use nvm (Node Version Manager) to switch between versions easily.

  1. Install nvm
  2. Run nvm install in the project directory (this will use .nvmrc)

Scripts

The top level project contains scripts that are then executed for all packages.

  • lint Checks syntax and simple errors in javascript and stylesheet files.
  • test Runs tests in all the packages.
  • build Runs the build script in all packages which require building.
  • start Runs the complete application in demo mode.
  • start-client Only starts the client application.
  • start-server Only starts the server application.
  • develop Runs the client and server applications as well as the Storybook application and watches for typescript errors.
  • serge A friendly alias for start-server

Database commands

Console commands for during dev and demos

clearDatabase() will clear message types (reload page and wait 2 seconds for rebuild and subsequent reload)

clearDatabase2() will clear created messages (reload page manually to start fresh)

Git hooks

Git commit hooks trigger linting of all staged files when a change is committed.

Code formatting & linting

Formats with prettier and lints with eslint preconfigured with standard rules

Development guidelines

For information and guidance about how to contribute to this project. Please see the Development standards guidelines

Licensing

The Serge is licensed under the Apache License 2.0.