WIP yml files, scripts for convenience, updating documentation.

Author: fyang151

.devcontainer/devcontainer.json

@@ -3,7 +3,6 @@
 	"name": "Sailbot Workspace",
 	"dockerComposeFile": [
 		"docker-compose.yml",
-		// "website/docker-compose.website.yml", // website
 
 		// Uncomment the files containing the programs you need
 		// "docs/docker-compose.docs.yml", // docs

.devcontainer/docker-compose.yml

@@ -8,11 +8,6 @@ services:
     network_mode: host
     privileged: true
     user: ros
-    ports:
-      # website
-      - "3005:3005"
-      # docs
-      # - "8000:8000"
     volumes:
       - ..:/workspaces/sailbot_workspace:cached
       - sailbot-new-project-bashhistory:/home/ros/commandhistory:delegated

.devcontainer/website/README.md

@@ -1,3 +1,5 @@
+#### NOTE: We now only use this for deployment! We do website development locally now. Hmph.
+
 # Website Image
 
 Used for running [our website](https://github.com/UBCSailbot/sailbot_workspace/tree/main/src/website).

.devcontainer/website/docker-compose.mongodb.yml

@@ -0,0 +1,15 @@
+# hello from website team
+# website development only needs mongodb and not the other fancy ros services
+
+services:
+  mongodb:
+    image: mongo:7.0
+    container_name: sailbot-mongodb
+    ports:
+      - "27017:27017"
+    volumes:
+      - mongodb-data:/data/db:delegated
+    restart: unless-stopped
+
+volumes:
+  mongodb-data:

.devcontainer/website/docker-compose.website.yml

@@ -36,31 +36,49 @@ This directory contains all installed packages.
 
 When installing a new package to the website, please follow the steps below:
 
-1. Access the terminal of the website container on Docker.
-
-2. Run the command `npm install <package-name>`.
+1. Run the command `npm install <package-name>`.
    Replace `<package-name>` with the actual name of the package you want to add.
 
    - Should you encounter errors related to resolving peer dependencies, please re-run the command with
      the header `--legacy-peer-deps`. Do not to use `--force` unless you're well aware of the potential consequences.
 
-3. Review the `package.json` file to ensure the new package and its version have been added to the dependencies section.
+2. Review the `package.json` file to ensure the new package and its version have been added to the dependencies section.
    - Confirm that `package-lock.json` has also been updated.
      This file holds specific version information to ensure consistent installations across different environments.
-4. Once the installation process is finished, please make sure to commit the files `package.json` and `package-lock.json`.
+3. Once the installation process is finished, please make sure to commit the files `package.json` and `package-lock.json`.
    These files are essential for version controlling the dependencies that have been added.
 
 ## Run
 
-Using [Sailbot Workspace](https://github.com/UBCSailbot/sailbot_workspace),
-the website should be up and running on [http://localhost:3005](http://localhost:3005).
-
-Otherwise, you execute the following commands to run it in development mode:
+You can run the website in development mode by executing the following command:
 
 ```bash
 npm run dev
 ```
 
+This will start the website in development mode and spin up a Docker container for our MongoDB database.
+Make sure you have Docker installed!
+
+Once you have run the website in development mode, you can access it at [http://localhost:3005](http://localhost:3005).
+
+After spinning up the database, it will keep running in the background until Docker is stopped. You can just manually stop the database by running:
+
+```bash
+npm run db:stop
+```
+
+Otherwise, here are some useful commands:
+
+| Command              | Description                                              |
+| -------------------- | -------------------------------------------------------- |
+| `npm run db:start`   | Starts the MongoDB database container                    |
+| `npm run db:stop`    | Stops the MongoDB database container                     |
+| `npm run web:dev`    | Runs the website in development mode on port 3005        |
+| `npm run dev`        | Starts both the database and website in development mode |
+| `npm run web:build`  | Builds the website for production                        |
+| `npm run web:start`  | Starts the production website on port 3005               |
+| `npm run simulation` | Runs the simulation script                               |
+
 ## Linters
 
 Before merging in new changes to the repository, please execute the following commands in order:

.devcontainer/website/website.Dockerfile

@@ -2,9 +2,13 @@
   "private": true,
   "scripts": {
     "postinstall": "cd tests && npm install",
-    "dev": "next dev -p 3005",
-    "build": "next build",
-    "start": "next start -p 3005",
+    "db:start": "docker compose -f ../../.devcontainer/website/docker-compose.mongodb.yml up -d",
+    "db:stop": "docker compose -f ../../.devcontainer/website/docker-compose.mongodb.yml down",
+    "web:dev": "next dev -p 3005",
+    "dev": "npm run db:start && npm run web:dev",
+    "web:build": "next build",
+    "web:start": "next start -p 3005",
+    "simulation": "bash scripts/run-simulation.sh",
     "lint": "prettier --check . && stylelint --allow-empty-input \"**/*.{css,scss}\" && next lint",
     "format": "prettier --write ."
   },

src/website/README.md

@@ -0,0 +1,9 @@
+#!/bin/bash
+
+[ ! -d "venv" ] && python3 -m venv venv
+
+source venv/bin/activate
+pip install pymongo --quiet
+
+cd tests/simulation
+python3 simulation.py