Installation & Configuration

Next: Translating SquadCalc. ➡️

Want to fork, clone, contribute ? Here's a quick overview.

Clone

git clone https://github.com/sh4rkman/SquadCalc.git
cd SquadCalc
npm ci

Running a development server

The following npm script will launch squadcalc in watch-mode : you can code and test at the same time.

npm run start

Bundling for production

The following script will build a production-ready bundle in the /dist/ folder , see bellow.

npm run build

Nginx Reverse Proxy for rehosting

When rehosting the app, you'll need to run squadcalc behind a reverse proxy in order to handle API request and forward them to https://squadcalc.app/api/v2 with an API Key. (get your API Key on Github, or Discord)

Here's an example Nginx conf file to use in your setup :

• replace proxy_set_header X-API-Key "1234-1234-1234-1234-1234"; with your own API key.
• Update root /PATH/TO/squadcalc/dist; to point to your SquadCalc frontend build.

# HTTP Configuration
server {
    listen         80;
    listen         [::]:80;
    server_name    squadcalc.mydomain.com  www.squadcalc.mydomain.com;
    return         301 https://squadcalc.mydomain.com$request_uri;
}


# HTTPS Configuration
server {

    listen                    443 ssl http2;
    listen                    [::]:443 ssl http2;
    server_name               squadcalc.mydomain.com www.squadcalc.mydomain.com;

    location ^~ /api/v2/ {
        proxy_pass https://squadcalc.app;
        proxy_set_header X-API-Key "1234-1234-1234-1234-1234";                  # Need to be changed
        # Basic proxy headers
        proxy_set_header X-Real-IP         $remote_addr;
        proxy_set_header X-Forwarded-For   $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
        # WebSocket support
        proxy_http_version 1.1;
        proxy_set_header Upgrade    $http_upgrade;
        proxy_set_header Connection "upgrade";
        # TLS to upstream
        proxy_ssl_server_name on;
        # Keep WebSocket alive
        proxy_read_timeout 3600s;
    }
    
    # Default Path
    root /change/your/path/to/squadcalc/dist/;                                   # Need to be changed

    # gzip
    gzip on;
    gzip_types text/plain application/json application/xml text/css text/javascript application/javascript;
  
    # SSL Configuration
    ssl_certificate           /etc/letsencrypt/live/squadcalc.mydomain.com/fullchain.pem;
    ssl_certificate_key       /etc/letsencrypt/live/squadcalc.mydomain.com/privkey.pem;
    ssl_protocols             TLSv1.2 TLSv1.3;
    add_header                Strict-Transport-Security "max-age=63072000";
}

(Optional) Configuration

You can configure a .env file to define specific environment variables. The .env file need to placed at the root of the project.

Example .env file for production use :

# Enable or disable WebSocket functionality for SquadMortarOverlay (default to disabled)
# If set to 'true' SquadCalc will try to open a socket with any running local instance of squadmortaroverlay.exe
# see https://github.com/Devil4ngle/SquadMortarOverlay
# WEBSOCKET=true

# Enable or disable search engine indexing
# If set to 'true' a robots.txt with allow all will be created
# If set to 'false' a robots.txt with disallow all will be created (default)
# INDEX=true

# Enable or disable Factions/Vehicles functions
# If set to 'true' no faction will be displayed after selecting a layer
# Default to false
# DISABLE_FACTIONS=true

# Specify the port to run the local webserver on when using `npm run start`
# Defaut to :3000
# DEV_PORT 1234

Next: Translating SquadCalc. ➡️