Configuration

Configure the Wordgrid leaderboard server and connect your frontend to a custom API URL.

Wordgrid server configuration is handled through environment variables loaded from a .env file. The frontend requires a one-line code change to point at your server.

Server environment variables

The server reads configuration from a .env file in the server/ directory using python-dotenv.

Variable	Default	Description
MONGO_URI	mongodb://localhost:27017/wordgrid	MongoDB connection string. The database name is taken from the URI path.
PORT	5000	Port the Flask server listens on.
DEBUG	True	Flask debug mode. Set to False in production.

.env.example

The repository ships with an .env.example you can copy as a starting point:

.env.example

# MongoDB config
MONGO_URI=mongodb://localhost:27017/wordgrid

# Flask config
PORT=5000
DEBUG=True

Copy it to .env and update the values for your environment:

cp .env.example .env

Using MongoDB Atlas

To connect to a MongoDB Atlas cluster, replace the default MONGO_URI with your Atlas connection string:

.env

MONGO_URI=mongodb+srv://<username>:<password>@cluster0.example.mongodb.net/wordgrid
PORT=5000
DEBUG=False

Connecting the frontend to your server

The frontend’s API base URL is defined as a constant near the top of app.js:

app.js

// API base URL
const API_URL = 'https://wordgrid-api.proplayer919.dev:7000';

To use your own server, change this value to your server’s URL:

app.js

// API base URL
const API_URL = 'http://localhost:5000';

API_URL is hardcoded in app.js — it is not a runtime or build-time configuration option. You must edit the file directly every time you want to point the frontend at a different server.

Where API_URL is used

API_URL is referenced in two functions in app.js:

fetchLeaderboardForDate(dateStr) — fetches the top scores for a given date:

app.js

async function fetchLeaderboardForDate(dateStr) {
  const resp = await fetch(`${API_URL}/leaderboard/${encodeURIComponent(dateStr)}`, { cache: 'no-store' });
  if (!resp.ok) throw new Error(`HTTP ${resp.status}`);
  const arr = await resp.json();
  const sorted = Array.isArray(arr) ? arr.slice().sort((a, b) => b.score - a.score) : [];
  return sorted.slice(0, 10);
}

submitLeaderboardEntry(name, scoreVal, dateStr) — posts a completed score to the leaderboard:

app.js

async function submitLeaderboardEntry(name, scoreVal, dateStr) {
  try {
    const payload = { name: String(name).slice(0, 50), score: Math.round(Number(scoreVal) || 0), date: dateStr };
    const resp = await fetch(`${API_URL}/leaderboard`, {
      method: 'POST',
      headers: { 'Content-Type': 'application/json' },
      body: JSON.stringify(payload),
    });
    ...
  }
}

The leaderboard API does not require authentication. Any client that can reach the server can submit scores. If you want to restrict submissions, you will need to add your own authentication layer in front of the Flask server.