Seperated docker files for deployment and development + update readme.md

docker-compose.dev.yaml

@@ -0,0 +1,32 @@
+services:
+  reverse_proxy:
+    build: ./proxy
+    restart: always
+    ports:
+      - "80:80"
+
+  front:
+    build:
+      context: ./traque-front
+      dockerfile: Dockerfile.dev
+    restart: always
+    volumes:
+      - ./traque-front:/app
+      - /app/node_modules
+    environment:
+      NEXT_PUBLIC_SOCKET_HOST: 'localhost'
+
+  back:
+    build:
+      context: ./traque-back
+      dockerfile: Dockerfile.dev
+    restart: always
+    ports:
+      - "3001:3001"
+    volumes:
+      - ./traque-back:/app
+      - /app/node_modules
+    environment:
+      ADMIN_PASSWORD_HASH: '23e3c6886ff8fcba302deac05c46612ed3af99e40a2a14252810f540f3c186aa'
+      HOST: '0.0.0.0'
+      PORT: 3001

docker-compose.yaml

@@ -1,23 +1,18 @@
 services:
   reverse_proxy:
-    #image: git.rezel.net/ludotech/traque-proxy:latest
+    image: git.rezel.net/ludotech/traque-proxy:latest
-    build: ./proxy
     ports:
       - "80:80"
     restart: always
 
   front:
-    #image: git.rezel.net/ludotech/traque-front:latest
+    image: git.rezel.net/ludotech/traque-front:latest
-    build: ./traque-front
     restart: always
     environment:
-      NEXT_PUBLIC_SOCKET_HOST: 'localhost'
+      NEXT_PUBLIC_SOCKET_HOST: 'traque.rezel.net'
-      NEXT_PUBLIC_SOCKET_PORT: 3001
-      #NEXT_PUBLIC_SOCKET_HOST: 'traque.rezel.net'
 
   back:
-    #image: git.rezel.net/ludotech/traque-back:latest
+    image: git.rezel.net/ludotech/traque-back:latest
-    build: ./traque-back
     restart: always
     ports:
       - "3001:3001"
@@ -25,5 +20,3 @@ services:
       ADMIN_PASSWORD_HASH: '23e3c6886ff8fcba302deac05c46612ed3af99e40a2a14252810f540f3c186aa'
       HOST: '0.0.0.0'
       PORT: 3001
-
-

package-lock.json

@@ -1,6 +0,0 @@
-{
-  "name": "traque",
-  "lockfileVersion": 3,
-  "requires": true,
-  "packages": {}
-}

readme.md

@@ -3,7 +3,7 @@ lang: en-GB
 ---
 
 # The game
-## General principle
+### General principle
 La traque is an IRL team game where the goal is to catch another team without being caught by another team.
 Each team starts with the starting position of the tracked team as well as a picture of them, they don't know who they are being tracked by.
 To get the latest known position of the tracked team, a team can update their latest known position as their own position.
@@ -12,68 +12,49 @@ Each team has to update their location at a given interval, if they don't, they
 The game is played in a zone, if a team goes outside the zone for a given time, they receive a penalty.
 For further information see the pdf in the doc folder.
 
-## The zone
+### The zone
 The zone is similar to the one in Fortnite, it is a circle that gets smaller and smaller as the game goes on.
 The zone is defined by two circles, the starting zone and the final zone, a number of reductions, the delay between two reductions, and the duration of a reduction.
 
-## The penalties
+### The penalties
 A penalty can be given to a team for going outside the zone or not updating their position. After 3 penalties a team is eliminated.
 
 # Structure of the app
-The app is divided in two parts, a Next.js front end and a Node.js back end.
+The app is divided in three parts, a Next.js front end, a Node.js back end and a reverse proxy.
-The front end is divided in a team section and an admin section.
+- The front end is divided in a team section and an admin section.
-The backend manages the game state and the teams, and communicates with the front end through `socket.io`
+- The backend manages the game state and the teams, and communicates with the front end through `socket.io`.
+- You need a reverse proxy to redirect requests to the right service (frontend or backend). Requests with URL starting with `/back/` are redirected to the backend (usually port 3001), all others to the front (usually port 3000).
 
 # Setting up the app
-## Development environment
+## Configuration
-### Front end configuration
+You can edit the front and back environment in the docker-compose file you plan to use.
-Edit the .env file in `traque-front` and add specify the following values:
+- The `docker-compose.yaml` and `Dockerfile` files are used for deployment.
+- The `docker-compose.dev.yaml` and `Dockerfile.dev` files are used for development.
+
+### Back
 ```
-NEXT_PUBLIC_SOCKET_HOST = 'example.com'
+HOST : host of the server
-NEXT_PUBLIC_SOCKET_PORT = 3001
+PORT : port of the server
-```
+SSL_KEY : path to the key file
-Where NEXT_PUBLIC_SOCKET_HOST is the host of the socket server and NEXT_PUBLIC_SOCKET_PORT is the port of the socket server.
+SSL_CERT : path to the certificate file
-### Back end configuration
+ADMIN_PASSWORD_HASH : hash of the password for the admin user
-Edit the .env file in `traque-back` and add specify the following values:
-```
-HOST = 'example.com'
-PORT = 3001
-SSL_KEY = "/path/to/privkey.pem"
-SSL_CERT = "/path/to/cert.pem"
-ADMIN_PASSWORD_HASH = 'admin_password_sha256_hash_here'
 ```
 
-Where ADMIN_PASSWORD_HASH is the password for the admin user, HOST is the host of the server, PORT is the port of the server, SSL_KEY is the path to the key file and SSL_CERT is the path to the certificate file. 
 The SSL_KEY and SSL_CERT are used for HTTPS and are required for the server to work. This is because the browser will block the GeoLocation API if the connection is not secure.
 
-Note : make sure PORT and NEXT_PUBLIC_SOCKET_PORT are the same
+### Front
+```
+NEXT_PUBLIC_SOCKET_HOST : host of the socket server
+NEXT_PUBLIC_SOCKET_PORT : port of the socket server (has to be the same as the port of the server)
+```
 
-### Running the project
+## Development
-#### Reverse proxy
+Run `docker compose -f docker-compose.dev.yaml up --build` to start the docker application in development mode. This means that each modification in the frontend or backend will be applied without the need to restart the server.
-You need a reverse proxy to redirect requests to the right service (frontend or backend). Requests with URL starting with `/back/` are redirected to the backend (usually port 3001), all others to the front (usually port 3000).
-
-#### Front end
-To run the front end, navigate to the `traque-front` directory and run the following commands:
-```
-npm install
-npm run dev
-```
-#### Back end
-To run the back end, navigate to the `traque-back` directory and run the following commands:
-```
-npm install
-npm start
-```
-Then navigate to the host and port specified in the .env file to access the application.
-```
-https://example.com
-```
 
 ## Deployment
-You can then deploy the docker application with `docker compose up`.
+Run `docker compose up` to deploy the docker application.
-
-You can change the production environment variables for the backend in the `docker-compose.yml` file. The frontend environment variables can be changed in the `.env` file in the `traque-front` directory.
 
 # Authors
 - [Quentin Roussel](mailto:quentin.roussel11@gmail.com) (initial version)
-- Mathieu Oriol ()
+- Mathieu Oriol
+- Sébastien Rivière

traque-back/Dockerfile

@@ -1,4 +1,4 @@
-# Use Node 20 alpine as parent image
+# Use Node 22 alpine as parent image
 FROM node:22-alpine
 
 # Change the working directory on the Docker image to /app
@@ -13,11 +13,12 @@ RUN npm install
 # Copy the rest of project files into this image
 COPY . .
 
+# Create those folders if they don't already exist
 RUN if [ ! -d uploads ]; then mkdir uploads; fi
-
 RUN if [ ! -d trajectories ]; then mkdir trajectories; fi
 
+# Expose the port
 EXPOSE 3001
 
 # Start the application
-CMD npm start
+CMD ["npm", "run", "start"]

traque-back/Dockerfile.dev

@@ -0,0 +1,27 @@
+# Use Node 22 alpine as parent image
+FROM node:22-alpine
+
+# Change the working directory on the Docker image to /app
+WORKDIR /app
+
+# Change specified variables
+ENV NODE_ENV=development
+
+# Copy package.json and package-lock.json to the /app directory
+COPY package.json package-lock.json ./
+
+# Install dependencies
+RUN npm install
+
+# Copy the rest of project files into this image
+COPY . .
+
+# Create those folders if they don't already exist
+RUN if [ ! -d uploads ]; then mkdir uploads; fi
+RUN if [ ! -d trajectories ]; then mkdir trajectories; fi
+
+# Expose the port
+EXPOSE 3001
+
+# Start the server in dev mode
+CMD ["npm", "run", "dev"]

traque-back/package.json

@@ -5,7 +5,8 @@
   "main": "index.js",
   "scripts": {
     "test": "echo \"Error: no test specified\" && exit 1",
-    "start": "node index.js"
+    "start": "node index.js",
+    "dev": "nodemon index.js"
   },
   "author": "Quentin Roussel",
   "license": "ISC",
@@ -16,5 +17,8 @@
     "multer": "^1.4.5-lts.1",
     "random-location": "^1.1.3",
     "socket.io": "^4.7.5"
+  },
+  "devDependencies": {
+    "nodemon": "^3.1.10"
   }
 }

traque-front/Dockerfile

@@ -1,3 +1,4 @@
+# Use Node 22 alpine as parent image
 FROM node:22-alpine AS base
 
 # Install dependencies only when needed

traque-front/Dockerfile.dev

@@ -0,0 +1,27 @@
+# Use Node 22 alpine as parent image
+FROM node:22-alpine
+
+# Change the working directory on the Docker image to /app
+WORKDIR /app
+
+# Installs glibc compatibility on Alpine to support native Node.js modules that require glibc
+RUN apk add --no-cache libc6-compat
+
+# Change specified variables
+ENV NODE_ENV=development
+ENV NEXT_TELEMETRY_DISABLED=1
+
+# Copy package.json and package-lock.json to the /app directory
+COPY package.json package-lock.json* ./
+
+# Install dependencies
+RUN npm install
+
+# Copy the rest of project files into this image
+COPY . .
+
+# Expose the port
+EXPOSE 3000
+
+# Start the server in dev mode
+CMD ["npm", "run", "dev"]