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.
By default dev server will run on http://localhost:3000, but you can change the default port if need (see configuration below).

npm run start

Bundling for production

The following script will build a production-ready bundle in the /dist/ folder.
You can then feed this folder to your webserver, like in the nginx configuration file below.

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 :

1. replace squadcalc.mydomain.com with whatever your domain is.
2. replace proxy_set_header X-API-Key "1234-1234-1234-1234-1234"; with your own API key.
3. 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;

    # Proxy API requests to squadcalc.app
    location ^~ /api/v2/ {
        proxy_pass https://squadcalc.app;
        # Forward the IP/APIKEY in the headers
        proxy_set_header X-API-Key "1234-1234-1234-1234-1234";         # Need to be changed
        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";
        proxy_read_timeout 3600s;
        # TLS to upstream
        proxy_ssl_server_name on;
    }
    
    # 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;
    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. ➡️